小程序实战课1：课程预览与环境准备

一次实战课共八节，一月内完成，每周二次，主要课程安排如下：

• 第一课：准备开发环境与工具
• 第二课：完成产品原型的设计
• 第三课：根据原型创建UI
• 第四课：连接后端服务器实现商品发布
• 第五课：添加分类浏览
• 第六课：添加搜索
• 第七课：添加评论与点赞
• 第八课：添加支付

用一个月的时间，带领大家，以一个基本标准的传统软件开发流程，完成一个具有发布、浏览、搜索、支付、点评等功能的小程序商品微商城。

第一课主要内容：

1，完成微信Web开发工具的安装，熟悉其使用

2，完成腾讯云服务器的购买与设置（如果不需要，不用购买）

3，完成商品页基本UI的创建

接下来我们创建一个项目，完成以上UI的创建。如果还没有创建项目，请先创建一个项目；

主要是使用了三个组件：label,input,button。这是label，input。

这是button组件。完整的mxml代码是：

源码下载链接及密码将在实战课微信群公开。

第一课作业：

1，创建新项目，完成商品页UI的创建，运行。

2，完成共享服务器的登陆。

注意：每项作业请截图发到群内，并艾特班长。

常见问题：

关于如何购买腾讯云服务器？回复 小程序实战分享1 查看。

关于如何安装微信Web开发者工具，回复 小程序实战分享3 查看。

关于基本输入UI组件的使用，回复 小程序实战分享4 查看。

关于javascript文档，查看：http://www.w3school.com.cn/js/

关于css3文档：查看：http://www.w3school.com.cn/css3/

关于小程序官方文档，查看： https://mp.weixin.qq.com/debug/wxadoc/dev/index.html

1，关于github desktop

不是用github desktop打开，只是用它的git bash当作终端。

2，关于腾讯云服务器登陆

这个界面是腾讯云服务器的web登陆界面。建议使用mac终端或git bash，使用ssh登陆。

3，关于logs页面

这是正常的，quick start项目的默认logs页面。

4，关于如何使用课程源码？

_MACOSX是mac电脑产生的目录，解压后可以勿视。使用lesson1目录，在新建小程序项目时，选择这个lesson1目录。

5，关于app.wxss

app.wxss中定义了样式，对UI有影响。

6，关于主页

pages数组的第一行即代表主页。

7，我的输入栏没有框？

没有写css样式，看源码的app.wxss文件。

8，阿里云服务器可以用吗？

可以，一样的。我们使用ubuntu server 14.04，尽量使用相同的。

9，老师，我把代码敲完了，然后呢。点调试，没反应 ？

检查一下，是不是没有保存。ctrl+s或cmd+s保存，点【调试】，然后单【重启】。没有保存的文件，有一个绿色的圆点。

10，关于中英文符号之分

代码里很多符号有全角半角之分，编码是全部使用半角的。webstorm为了不使程序员出错，强制转换了全角到半角。

11，关于github的安装

系统是xp的，最好换一下。github desktop只能安装在windows 7+系统之上。

12，老师，百度云分享的文件如何打开？我刚才是看着截图打的代码。

是压缩包，下载解压就可以了。在新建小程序项目时，选择解压的目录。

13，关于样式

瞎胡加的，没按老师的样式来。

就应该这样，搜索才能进步！