微信小程序开发实践入门教程

来源丨网络（侵删）

在去年2017年1月9日，张小龙在2017微信公开课Pro上发布的小程序正式上线 。时至今日，小程序已经有两年多了。

安装环境，是很简单的，下载完安装包直接安装即可。

我们的开发环境如下：

不用注册，直接运行小程序即可

从上面项目结构图，可以看到一个页面构成主要有三大部分构成 index.wxml 、index.wxss 、index.js 。一看，怎么跟前端的这么类似 。

认真一看，这功能还真是没差别 。对于会一点前端知识的，我想，要入门小程序开发，应该是很简单的 。

一个网页主要 HTML CSS JS 这样的组合，其中 HTML 是用来描述当前这个页面的结构，CSS 用来描述页面的样子，JS 是用来处理这个页面和用户的交互。小程序的页面跟这个完全相同 ，不一样的就是改了个名字 。

除了以上页面的三大构成，还有项目的根目录还有一个 app.json 和 project.config.json 。

app.json 是对当前小程序的全局配置，包括了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等。

project.config.json 可以针对各自喜好做一些个性化配置，例如界面颜色、编译配置等 。

介绍完小程序的具体目录，接下来，带大家看看如何配置项目的底部导航 。

小程序要实现这个底部导航其实很简单，我们只要在根目录下的app.json文件中配置：

具体官方文档：

https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html

小程序的页面创建，都是需要在配置文件中配置一下路径，不然无法访问 。配置也非常简单，只需要在app.json文件下找到一个pages的属性值 。

pages属性：接受一个数组，每一项都是字符串，来指定小程序由哪些页面组成。每一项代表对应页面的【路径 文件名】信息，数组的第一项代表小程序的初始页面。小程序中新增/减少页面，都需要对 pages 数组进行修改。

 注意：文件名不需要写文件后缀 ，而且路径不能写错！