微信小程序开发入门指南，从零搭建你的首个应用

看了一眼你手机桌面上那些密密麻麻的App，是不是有时候觉得烦——装一个占内存，不装又怕错过功能。微信小程序就是冲着这个痛点来的，用完即走，不占桌面，还不用更新。去年我帮一个开水果店的朋友搭了个下单小程序，他连代码都没碰过，硬是跟着教程一步步跑通了。今天咱们就聊聊，一个完全零基础的人，怎么从零到一弄出个自己的微信小程序。

先说最让人头大的问题：注册和工具。第一步是去微信公众平台注册一个小程序账号，注意别选成“订阅号”或“服务号”，入口在“小程序”分类下。注册时需要邮箱、身份证信息，个人开发者用身份证就够，企业开发者还得上传营业执照。注册完在“开发”菜单里找到“开发设置”，拿到AppID——这串字符是你的小程序在微信里的身份证。然后去官网下载微信开发者工具，安装后打开，选“新建项目”，填入AppID，模板选“JavaScript基础模板”就行。这一步很多人卡在“看不懂英文”，其实开发者工具已经全汉化了，点几下就搞定。

工具装好后，你会看到三个区域：左边是模拟器，中间是代码编辑器，下面是调试器。别被这些专业名词吓到，说白了就是左边看你做的页面长什么样，中间写代码，右边查错误。我建议你先点一下“预览”按钮，用手机微信扫个码，就会发现一个空白页面出现在手机上了——这就是你的小程序“本体”。很多人第一次看到自己写的东西出现在微信里，会特别有成就感，哪怕它只是个白底黑字的“Hello World”。这种即时反馈的快乐，是学编程最好的动力。

接下来是核心环节：理解小程序的结构。小程序不像普通网页那样一个HTML文件包打天下，它拆成了几个固定文件。以你新建的项目为例，根目录下有个`pages`文件夹，里面每个子文件夹代表一个页面，比如`index`是首页。每个页面由四个文件组成：`.wxml`（类似HTML，管页面长啥样）、`.wxss`（类似CSS，管页面好不好看）、`.js`（管页面逻辑，比如点按钮后发生什么）、`.json`（管页面配置，比如顶部标题写啥）。你打开`index.wxml`，把里面的代码删光，换成`你好，这是我的第一个小程序`，然后在`index.js`的`data`里加一句`motto: '今天天气不错'`，再在`wxml`里用双花括号`{{motto}}`引用——刷新一下，页面就会显示“今天天气不错”。这就是数据绑定的基本玩法，像变魔术一样把数据从后台拉到前台。

别急着写死数据，我们来做第一个真正能用的功能：一个点击按钮改变文字的交互。在`index.wxml`里加一个`点我试试`，然后在`index.js`的`Page({})`里，跟`data`平级的地方加一个方法：`changeText: function() { this.setData({ motto: '我被点了' }) }`。保存后点那个按钮，文字立马变了。这个`setData`是微信小程序里最核心的方法——你所有想让页面变动的操作，都得靠它。理解了这个，你就掌握了小程序开发的七成功力。剩下的三成，无非是调用微信的API，比如获取用户信息、发起支付、调用摄像头等等。

说到API调用，举个实际例子：让用户授权获取昵称和头像。在`wxml`里加一个`获取用户信息`，然后在`js`里写对应的方法：`onGetUserInfo: function(e) { console.log(e.detail.userInfo) }`。预览时点按钮，微信会弹出授权窗口，同意后控制台就能看到用户的昵称和头像数据。这里有个坑：微信在2021年调整了规则，个人小程序不能直接获取用户手机号，企业小程序需要先在后台配置。所以如果你只是个人玩玩，就别在“获取手机号”上浪费时间了。很多新手栽在这个地方，以为是自己代码写错了，其实是权限没开。

页面跳转是另一个高频需求。你想从首页点个按钮跳到“关于我们”页面，需要在`app.json`的`pages`数组里注册新页面路径，比如`"pages/about"`。然后在项目根目录的`pages`文件夹里新建`about`文件夹，里面放上四个基本的页面文件。在首页的`wxml`里加一个`去看看`，点击就能跳转。如果想带参数过去，用`url="/pages/about?id=123"`，然后在`about.js`的`onLoad`函数里用`options.id`接收。这就像给快递贴标签，发件时写地址，收件时拆包裹。掌握了页面传参，你就能做出多页面应用了，比如商品列表页点一个商品跳到详情页。

说说发布这件事。在开发者工具里点“上传”按钮，把代码打包成一个版本。然后登录微信公众平台，找到“版本管理”，把刚刚上传的版本提交审核。审核通常1-7天，节假日会慢些。审核通过后，点“发布”就正式上线了。这里有个小技巧：提交审核时，在“功能描述”里写清楚你的小程序是干嘛的，比如“一个展示水果价格的工具”，别写“测试”或“demo”，否则容易被驳回。发布后，你可以把小程序码打印出来贴在店里，或者分享到微信群。用户第一次打开会有些慢，因为微信在加载资源，之后就会很流畅。

说到底，微信小程序开发不是什么高深的技术活儿，它更像搭积木——微信把基础模块都给你准备好了，你只需要按照规则把它们拼起来。我见过退休阿姨给自己家的面馆搭了个点餐小程序，也见过高中生给班级做了个课程表查询工具。他们都不是程序员，唯一的共同点是：愿意花一个下午的时间，对着教程一步步操作。如果你今天看完了这篇文章，建议马上打开电脑，注册个账号，照着上面的步骤走一遍。别怕出错，开发者工具里的错误提示虽然看着吓人，但其实大部分都是“少了个括号”或者“路径写错了”这种小毛病。等你的第一个小程序在手机上跑起来的那一刻，你会觉得之前那些折腾都值了。