从零到一，手把手教你建造自己的微信小程序

注册小程序账号这事，比你想的简单，但也比你想的坑多。打开微信公众平台，点“立即注册”，选“小程序”类型。注意，邮箱别用那种已经绑过个人微信或公众号的，会提示被占用，得换个干净的。填完邮箱，去收验证码，然后设置密码。接下来是主体类型，个人还是企业？个人免费，但功能受限，比如不能开通微信支付，类目也少；企业要认证，交300块，但能解锁全部能力。我建议，如果只是练手，先选个人，等真做起来了再升级。填完管理员信息，扫码验证，这一步要绑管理员微信，一个微信号只能绑一个小程序管理员，别随便绑。提交后等审核，通常几分钟到几小时，过了就进后台。后台界面第一眼有点懵，左边一堆菜单，但别怕，你只需要关注“开发管理”和“版本管理”这两个地方。

工具准备这块，很多人卡在第一步就放弃了。官方推荐下载“微信开发者工具”，直接搜官网，下载稳定版。安装完打开，会让你扫码登录，用刚才绑定的管理员微信扫。进去后选“小程序项目”，项目名称随便起，目录选个空文件夹，AppID选“测试号”——记住，没有AppID也能开发，但真机预览和上传发布必须要真实AppID，测试号只是让你先跑通流程。模板选“JavaScript - 基础模板”，别选云开发，那个后面再说。点确定，项目就创建好了。第一次打开编辑器，左边是模拟器，右边是代码区，下面有调试器。你可能会慌，这跟以前写网页完全不一样。别急，先看目录结构：pages文件夹放页面，app.js是入口逻辑，app.json是全局配置，app.wxss是全局样式。记住这三个文件，后面所有操作都围绕它们转。

开始写代码前，先搞懂小程序的核心逻辑。它跟普通网页最大的区别是，没有DOM，不能直接操作HTML标签，一切靠数据绑定。你写一个页面，要建三个文件：wxml（结构）、wxss（样式）、js（逻辑）。比如，你想在页面上显示“你好，小程序”，先在pages/index.wxml里写一行`{{message}}`，然后在index.js的data里写`message: '你好，小程序'`，模拟器上立刻就能显示。这就是数据绑定，改js里的值，页面自动更新。再比如，你想加个按钮，点击后改变文字，就在wxml里加`点我`，然后在js里写一个changeText函数，修改this.setData里的message。就这么简单，别想复杂了。很多人一开始就想封装组件、用框架，完全没必要，先用手写原生语法跑通一个页面，比啥都强。

接下来是页面跳转和tabBar配置。小程序底部导航栏，就是那种“首页”“我的”两个tab，需要在app.json里配。打开app.json，找到tabBar字段，没写就自己加。代码长这样：`"tabBar": {"list": [{"pagePath": "pages/index", "text": "首页"}, {"pagePath": "pages/mine", "text": "我的"}]}`。pages目录下得有对应的页面文件夹，每个文件夹里至少有wxml、js、json、wxss四个文件（json可以空着）。跳转页面用`wx.navigateTo({url: '/pages/detail?id=1'})`，这是带参数跳转，接收方式在detail页面的onLoad函数里通过options.id获取。注意，navigateTo不能跳tabBar页面，跳tabBar要用`wx.switchTab`。这些API名字有点绕，但多用几次就记住了，不行就查官方文档，别硬背。

样式和布局，这是很多人头疼的地方。小程序用的是rpx单位，750rpx等于屏幕宽度，不用管手机分辨率，自适应。比如你想让一个按钮宽度占屏幕一半，写`width: 375rpx`就行。布局推荐flex，写起来快。举个例子，一个商品卡片，左边图片右边文字，用`display: flex; align-items: center;`，图片固定宽高，文字部分flex:1。还有，小程序里不能直接用css选择器继承，每个组件都要单独写类名，这点跟网页不一样。另外，背景色、字体大小、边距这些，直接在wxss里写，跟写普通css一样，但注意不能用`*`通配符，全局样式写在app.wxss里。你要是觉得手写麻烦，可以引入WeUI这类现成样式库，但新手先别碰，自己手写几个页面，把布局手感练出来，后面看别人的代码才不懵。

数据和缓存，这一步决定你的小程序是玩具还是工具。数据存在哪？临时数据放js的data里，页面刷新就没了。要持久化，用`wx.setStorageSync('key', value)`，读取用`wx.getStorageSync('key')`。比如用户登录状态、购物车数据，都存这。等你要跟服务器交互，就得用`wx.request`发请求，这个方法跟浏览器的ajax类似，但注意，请求的域名必须在小程序后台配置合法域名，否则真机调试直接报错。本地开发可以勾选“不校验合法域名”，但上线前必须配好。再进阶一点，用云开发，这是微信官方的后端服务，不用自己买服务器，直接在小程序里写云函数，数据库操作都有现成API。我建议，如果只是做个人项目，云开发最省事，免费额度够用，还不用备案域名。

发布上线，这一步很多人前功尽弃。在开发者工具里，点“上传”按钮，填版本号和备注。然后在微信公众平台后台，进“版本管理”，找到开发版本，点“提交审核”。审核周期一般1-7天，类目选对了会快些。审核通过后，点“发布”，你的小程序就正式上线了。但上线只是开始，有个细节很多人忽略：上线后要配服务器域名、业务域名，还有隐私协议，微信现在强制要求，不填会被下架。而且，每一次改代码，都要重新上传、审核、发布，这个流程跑几次你就习惯了。我见过太多人，写代码挺溜，卡在审核上，要么类目不对，要么内容违规。所以，提交前仔细读一遍微信的运营规范，别嫌长，能帮你省很多时间。

回头看你从零到一的过程，其实就三步：注册账号、写代码、发布上线。每一步都有坑，但都能跳过去。我教你的这些，都是踩过坑后总结出来的实操经验，不是官方文档那些冷冰冰的术语。你真正动手做的时候，会发现自己遇到的坑比我还多，但没关系，每个坑都是你进步的台阶。小程序这东西，门槛不高，但天花板很高，你做成一个简单的工具型小程序，和做成一个爆款应用，用的技术栈完全不同。先跑通第一个版本，哪怕丑得不行，功能糙得不行，那也比99%只收藏不行动的人强。做出来，发到朋友圈，让朋友点一点，你会有一种从零到一的踏实感，那种感觉，比看一百篇教程都值。