3分钟教你创建微信小程序~

开发前准备—下载&安装微信开发者工具
下载并安装微信开发者工具
地址~

微信开发者工具介绍
微信开发者工具是官方提供的专门用于微信小程序开发调试的工具，它提供的主要功能如下：
● 快速创建小程序项目（起到脚手架的作用）
● 代码的查看和编辑（相当于 VSCode 作用）
● 对小程序功能进行调试（相当于浏览器作用）
● 小程序的预览和发布
与普通的网页开发不同，小程序的开发必须要使用专门的工具： 微信开发者工具

1.创建第一个小程序项目

点击+号，创建新项目

填写项目信息

如上图所示填写信息，要点如下：
● 项目名称：可以直接填写
● 目录：代码保存的位置，建议使用空目录
● AppID： 填写之前申请的小程序AppID (也可以使用测试账号)
● 后端服务：不使用云服务
● 模板选择：选择 Javascript 基础模板。

启动小程序项目

二.认识小程序-目录结构

小程序文件类型
小程序主要提供了 4 种文件类型：

文件作用

三.认识小程序-页面布局

页面的构成
一个完整的小程序页面需要包括 4 个类型的文件：
● .wxml 定义页面的结构，类似于 .html
● .wxss 定义页面的样式，类似于 .css
● .js 定义页面的逻辑，监听事件、发起请求等
● .json 定义页面的配置，如页面标题等

页面结构： (两个新标签 view, text)
● view 定义块级区域，相当于网页中的 div 标签
● text 定义行内区域，相当于网页中的 span标签

页面样式
● 类选择器，与网页中一致
● 标签选择器，与网页中一致
● … 大部分的 css 样式都可以用到小程序中

四.小程序-配置文件

配置文件简介
小程序配置文件是一种json格式的文件。可以起到快速新建页面、设定小程序首页、设置窗口样式及设置导航栏和底部tabBar等作用。

分类：
全局 app.json
页面 page.json

全局配置简介
和vue中全局的概念是一样的

页面配置简介
页面配置只针对某个页面生效

五.小程序适配-响应式单位rpx

响应式单位rpx
rpx ，responsive pixel：
在小程序中的单位rpx，它的特点是能够自动地适配置不同尺寸的手机屏幕。
原理：不管手机屏幕具体多宽，100%的屏幕宽度就是750rpx

rpx (responsive pixel)：规定不管屏幕为多少px，100%的屏幕宽度就是750rpx
100%屏幕的宽度 = 750rpx

---

好啦~今天就聊到这啦！