小程序开发

1 准备阶段

• 注册微信公众号

• 注册小程序账号，得到小程序AppID（开发者工具中需要用）

  小程序-开发设置-开发者ID

• 安装开发工具

  微信开发者工具

  

• 项目目录结构
  小程序由配置代码json文件、模板代码 wxml 文件、样式代码 wxss文件以及逻辑代码 JavaScript文件组成。

  根目录：
  pages：存放页面文件的文件夹
  app.js：小程序逻辑文件
  app.json：小程序配置文件
  app.wxss：小程序公共样式文件
  sitemap.json：小程序收录设置文件
  project.config.json：项目配置文件

  根目录的文件夹内：
  
  由文件名相同但是后缀不同的四个文件组成:
  .js页面逻辑
  .wxml页面结构，类似于HTML设计网页结构。
  .wxss页面样式表，如同CSS设计网页的样式。
  .json页面配置

【参考文档】
微信小程序
视频课

代码构成

JSON配置

• app.json：是当前小程序的全局配置，包括了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等。
• project.config.json：在工具上做的任何配置都会写入到这个文件，当你重新安装工具或者换电脑工作时，你只要载入同一个项目的代码包，开发者工具就自动会帮你恢复到当时你开发项目时的个性化配置，其中会包括编辑器的颜色、代码上传时自动压缩等等一系列选项。
• pages下每个页面的json

JSON 文件中无法使用注释，试图添加注释将会引发报错。

WXML

网页编程采用的是 HTML + CSS + JS 这样的组合，其中 HTML 是用来描述当前这个页面的结构，CSS 用来描述页面的样子，JS 通常是用来处理这个页面和用户的交互。
同样道理，在小程序中也有同样的角色，其中 WXML 充当的就是类似 HTML 的角色。

• wx:if 这样的属性以及 {{ }} 这样的表达式。WXML里只填充组件，JS里面管理组件的状态

WXSS

• WXSS 具有 CSS 大部分的特性，小程序在 WXSS 也做了一些扩充和修改。

JS交互

• 响应用户的点击、获取用户的位置等等。
  

微信官方文档-小程序代码构成