昨天，我们为大家详细分析了微信小程序的主要功能。不少网友在后台给我们留言666。感谢您的支持。希望大家仔细读一下昨天的文章，也许会有很多启发。至于什么，我们稍后揭晓。今天，我们为大家整理了一份简单的小程序开发教程。了解技术的朋友可以看一下小程序的规则。不懂技术的朋友可以粗略浏览一下。找懂技术的开发朋友来学习开发小程序。需要多长时间以及费用是多少？如果您对技术开发人员的回复没有判断力，可以在后台给我们留言，我们会帮您判断真伪。废话不多说，下面是一个简单的小程序开发教程：

1.获取微信小程序

登录后，您可以在网站“设置”-“开发者设置”中查看微信小程序。请注意，您不能直接使用服务帐号或订阅帐号。

2. 创建项目

为了帮助开发者简单高效地开发微信小程序，微信官方推出了全新的开发者工具，集开发调试、代码编辑、程序发布等功能于一体。关于开发者工具，我们将从编写代码、创建页面、预览小程序三个方面给大家介绍基础知识。

3. 编写代码

小程序包含三个必备文件app.js、app.json、app.wxss。其中.js后缀是脚本文件，.json后缀是配置文件，.wxss后缀是样式表文件。微信小程序会读取这些文件并生成小程序实例。

下面我们简单了解一下这三个文件的作用，方便从头开始修改和开发自己的微信小程序。

app.js是小程序的脚本代码。我们可以监控和处理小程序的生命周期函数，并在这个文件中声明全局变量。调用框架提供的丰富的API，比如本例中的同步存储、同步读取本地数据。

app.json是整个小程序的全局配置。在这个文件中，我们可以配置小程序由哪些页面组成，配置小程序的窗口背景颜色，配置导航栏样式，配置默认标题。请注意，不能向该文件添加任何注释。

app.wxss是整个小程序的通用样式表。我们可以直接在页面组件的属性上使用app.wxss中声明的样式规则。

小程序有两个主要页面，页面和日志页面，分别是欢迎页面和小程序启动日志显示页面。它们都在目录中。 app.json中需要写入微信小程序中每个页面的【路径+页面名称】，其中的第一个页面就是小程序的首页。

每个小程序页面由同一路径下四个不同的同名后缀文件组成，如：.js、.wxml、.wxss、.json。 .js 后缀的文件是脚本文件，.json 后缀的文件是配置文件，.wxss 后缀的文件是样式表文件，.wxml 后缀的文件是页面结构文件。

.wxml是页面的结构文件：

在本例中， 、 和 用于构建页面结构、绑定数据和交互处理功能。

.js是页面的脚本文件。在这个文件中，我们可以监控和处理页面的生命周期函数、获取小程序实例、声明和处理数据、响应页面交互事件等。

.wxss 是页面的样式表：

页面的样式表是可选的。当存在页面样式表时，页面样式表中的样式规则会级联到app.wxss中的样式规则。如果不指定页面的样式表，也可以直接使用页面结构文件中app.wxss中指定的样式规则。

.json是页面的配置文件：

页面配置文件是可选的。当存在页面配置文件时，页面中的配置项会覆盖app.json中相同的配置项。如果没有指定页面配置文件，页面会直接使用app.json中的默认配置。

日志页面结构

日志页面使用控制标签来组织代码，使用wx:for绑定日志数据，并将日志数据循环到节点中。

运行结果如下：

4. 手机预览

使用开发者工具开发完成小程序后，上传至微信小程序后台，点击“预览”，扫码即可在微信客户端体验。如果不符合微信小程序的要求，您将收到相应的回复。温馨提示，修改完成后可以再次上传预览。

这就是今天的全部内容。明天开始，我们将为大家介绍微信小程序的功能定义和能力。共有八篇文章。每天我们都会研究一种能力并对其进行详细分析。那就请注意一下。

小智圈每天分享小程序的最新解读。我们强烈建议您固定公众号。我们能回馈的，就是每天给你一点营养知识。