小程序开发从入门到精通视频课程

如果你已经会写网页，打开小程序开发者工具却不知道从哪下手；或者你照着一个教程敲过几页代码，离开教程就写不出第二个页面——那这门课的定位正好对上你。它不解决「前端基础」问题，假定你已经懂 HTML、CSS、JavaScript，知道盒模型和常见的数组方法。它解决的是小程序这一套东西自己特有的那部分：wxml 和 html 差在哪、wxss 为什么不能直接用你熟悉的那些选择器、一个页面的生命周期跟你以前理解的不一样在什么地方。

先自查：这几个问题你现在答得上来吗

动手之前花两分钟判断一下缺口在哪儿，比无差别地从头看到尾省时间。

• app.json 里配置的 pages 数组，第一项和后面的项行为上有什么区别？
• 小程序里的单位 rpx 是怎么换算的，什么时候不该用它？
• 页面的 onLoad、onShow、onReady 各自在什么时机触发，切后台再切回来走的是哪几个？
• setData 为什么不能像改普通对象那样直接赋值，它做了什么额外的事？
• 自定义组件和页面的生命周期有哪些不同，properties 和 data 混用会出什么问题？

能答上四个以上，这个基础段落你可以快进，直接从布局和实战项目切进去。

这门课在讲什么

课程分两条线走。一条是能力线：从项目结构、配置项、wxml 数据绑定和列表渲染讲起，接着是 flex 布局在小程序里的实际用法——注意这里不是通用 flex 教程，讲的是它在小程序的容器和滚动视图里怎么配合。再往后是自定义组件、导航栏定制、基础库配置、云存储查询、小程序码生成和消息模块，最后落到卡证识别这类带接口调用的完整场景上。

另一条是项目线，围绕一个类似豆瓣评分的应用推进。它不是把知识点拆成孤立片段演示，而是按真实开发的顺序走：登录怎么做、首页怎么搭、数据怎么取回来渲染、后面怎么把重复结构抽成自定义组件、怎么处理导航栏。你会看到同一个页面在不同阶段的写法差异，这个差异本身就是课程价值所在。

看的时候该带什么问题

光看不练，看完就忘。建议每看完一个实战段落，合上视频自己复现一遍，重点盯这几件事：数据是从哪儿来的、什么时候发的请求、setData 把哪些字段推给了视图层、哪些逻辑被抽进了组件、组件之间靠什么通信。这几条能对上，说明你理解的是结构，不是代码的复读。

另外注意两类容易忽略的内容：一是基础库版本和配置项，它决定你写的某个 API 在低版本微信上会不会直接报错；二是小程序码和消息模块，这块涉及后端配合和权限申请，是纯前端视角最容易漏掉的一环。

看完你应该能

• 从零建起一个结构清晰的小程序项目，知道每个配置文件管什么。
• 用 flex 布局写出可滚动、可自适应的页面，而不是靠试数值凑。
• 把重复的界面结构抽成自定义组件，并让它在多个页面间正确传参。
• 接一个真实接口，完成数据请求、渲染、分页或下拉刷新。
• 说清小程序码怎么生成、消息推送怎么接、云存储的读写流程。

这个清单里有几条你现在完全没头绪，就从对应的段落开始看，不用按顺序。反过来，如果每条都觉得「大概会了」，那就直接跳到卡证识别那个项目，用它的复杂度检验自己是不是真的会了。