从零开始，手把手教你开发一个微信小程序

好，直接说正题。很多人一听到“开发微信小程序”，第一反应就是“这得会写代码吧”“这得专业程序员才能干吧”。其实真没那么玄乎。微信小程序开发的门槛，已经比三年前低了一大截。你不需要懂算法，不需要懂后端，甚至连数据库都不需要碰，就能跑起来一个像模像样的小程序。我从零开始带你走一遍流程，你跟着做就行，每一步我都会拆开讲清楚，保证你能看懂。

第一步，你得先有个微信小程序的账号。这个很简单，去微信公众平台官网，点“小程序”注册。用你的个人微信号扫码，填个邮箱，收个验证码，设置密码，就搞定了。注册完之后，你会在后台看到一个“AppID”，这玩意儿是你的小程序的身份证，后面开发的时候会用到，先记下来。别害怕，这一步没有任何技术含量，跟注册个微博账号差不多。注册完账号，你就能在后台看到小程序的名称、头像这些基本信息，先随便填一个，后面随时能改。

第二步，你得装一个开发工具。微信官方出了个IDE，叫“微信开发者工具”，直接去官网下载就行。Windows和Mac版本都有，根据你的电脑系统选。安装过程跟装个QQ一样，一路点“下一步”就行。打开这个工具，你会看到一个登录界面，用你刚才注册小程序的微信号扫码登录。登录之后，点击“新建项目”，填上你的项目名称、目录位置，最关键的是把刚才那个AppID复制粘贴进去。然后选择“不使用云服务”，因为咱们从零开始，先不整那些花里胡哨的。点击“确定”，一个空的小程序项目就创建好了。

看到这个界面，你可能会蒙圈：左边是代码区，中间是预览区，右边是调试区。别慌，咱们只关心两个文件：一个是app.json，这个小程序的总配置文件，决定了你的小程序长什么样、有几个页面；另一个是pages目录下的文件，这里存放你每个页面的代码。默认情况下，工具会帮你生成一个index页面，这就是你小程序的首页。你现在可以试着在预览区里点一点，看看默认的页面长什么样子。这个工具最爽的一点是，你改完代码，保存一下，预览区立刻刷新，不需要重新编译，省了很多时间。

接下来，咱们开始写真正的代码。打开pages/index.wxml文件，这是你的页面结构文件，相当于网页的HTML。删掉默认的内容，写上这么几行：我的第一个小程序点我一下。然后打开同目录下的index.wxss文件，这是样式文件，相当于网页的CSS。写上：.container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;}.title{font-size:20px;margin-bottom:20px;}。保存一下，预览区的页面就变了，一个居中的标题加一个按钮。你发现没有，写小程序跟写网页区别不大，只是标签名和属性名换成了微信自己的那套。

但光有页面结构还不够，你得让按钮有反应。打开pages/index.js文件，这是页面的逻辑文件，负责处理用户交互。找到Page({})这个大括号，在里面加一个方法：clickMe: function() {wx.showToast({title: '你好，小程序!',icon: 'none'})}。保存之后，你在预览区点一下按钮，手机屏幕中间就会弹出一个提示框，写着“你好，小程序!”。这就是小程序的交互逻辑：用户在页面上操作，触发了你在JS里定义的方法，然后小程序做出响应。整个过程没有写一行后端代码，没有配服务器，全靠微信给你提供的API跑起来了。

一个页面肯定不够用，你得学会怎么加新页面。回到app.json文件，找到pages这个数组，在里面加上一行："pages/demo"。保存之后，工具会自动在pages目录下生成一个demo文件夹，里面包含四个文件：wxml、wxss、js、json。这就跟index页面一样，结构完全一致。现在你可以在demo.wxml里写点新内容，比如一个图片或者一段文字。然后回到index页面，把刚才的按钮改一下，让它点击后跳转到demo页面：在index.js里把clickMe方法改成wx.navigateTo({url: '/pages/demo'})。保存，再点一下按钮，页面就跳转到demo页面了。小程序就是这样通过页面跳转和组件组合，搭建出完整的应用。

开发过程中，你肯定会遇到数据的问题。比如你想在页面上显示用户的名字，或者从网上拉取一些内容。小程序的JS文件里有一个data对象，专门用来存放页面数据。你在index.js的data里写上：{name: '张三'}，然后在index.wxml里用{{name}}这个语法，页面就会显示“张三”这两个字。如果你想让用户输入自己的名字，可以用input组件，绑定一个bindinput事件，把用户输入的内容实时更新到data里。这些操作都不复杂，你只要记住几个核心概念：data存数据，bind绑定事件，wx开头的API调微信的能力。搞懂这些，你就已经掌握了小程序开发80%的内容。

说说怎么让别人用你的小程序。开发工具左上角有个“上传”按钮，点击之后输入版本号，就能把你写好的代码上传到微信后台。然后去微信公众平台，找到“版本管理”，把上传的版本提交审核。审核一般1-3天，通过之后点击“发布”，你的小程序就正式上线了。这时候你打开微信，搜索你小程序的名称，就能搜到它。你还可以把小程序分享给朋友，或者生成二维码贴在公众号里。整个流程走下来，从零到上线，快的两三天就能搞定。你不需要成为程序员，只需要跟着这篇文章一步步操作，就能拥有一个属于自己的微信小程序。