鲁达 好久没有写微信开发的文章了，笔者最近在研究小程序和微信硬件。总算有点心得，博采众家之长，整理了微信小程序开发教程。网上的微信小程序视频教程均要付费，这个让笔者略感不妥。作为开发者，深刻明白，分享才是创新的源动力。笔者在这里承诺，所有代码均开源，同时会放出响应的代码下载链接。(*^__^*)
一、知识储备
html、CSS、js 的一般性基础知识
如果不懂也没关系，先上手写代码，遇到问题再去查
懂一些服务器开发基础知识
服务器后端开发的基础知识包括https请求、数据库操作等
二、小程序结构
2.1 小程序文件对应关系
1..wxml文件：类似html5文件
页面结构 用于创建页面对象，以及处理页面生命周期控制和数据处理
2..wxss文件：类似css3文件（有些许差异）
页面样式 用于定义页面中元素结构，遵循XML语法，不是HTML语法，增加了flex布局
3..js文件：类似javascript文件
页面逻辑 设置当前页面工作时的window的配置
4..json文件：json数组
页面配置 用于定义页面样式的，语法遵循CSS语法，扩展了CSS基本用法和长度单位
2.2 小程序文件结构
小程序包含一个描述主题程序的app和多个描述各自页面的page。一个小程序主体部分由三个文件组成，必须放在项目的根目录，如下所示
一个小程序页面由四个文件组成，如下所示：
提醒：为了方便开发者减少配置项，规定描述页面的四个文件必须具有相同的路径与文件名。编译时，将自动关联。
2.3 小程序架构及实现机制
按笔者的开发经验，小程序并不是H5应用，而是更偏向于传统的CS架构，它是基于数据驱动的模式，一切皆组件（视图组件）。小程序开发语言是独立的一整套开发语言体系，既与Html+CSS+JavaScript一脉相承，而又有所区别，同时提供了各种自有的组件和API。
图片来源：腾讯大学
框架提供了自己的视图层描述语言 WXML 和 WXSS，以及基于 JavaScript 的逻辑层框架，并在视图层与逻辑层之间通过单向数据绑定进行数据传输，使开发者更加聚焦于数据与逻辑上。
三、Demo展示
接下来几篇小程序开发文章将直接上干货（Talk is cheap, show me the code!）。笔者将带大家完成一个简单的ToDoList小工具，界面如下：