建站
咨询
售后
建站咨询
创新互联www.cdcxhl.cn八线动态BGP香港云服务器提供商，新人活动买多久送多久，划算不套路！
这篇文章主要为大家展示了微信小程序入门，内容简而易懂，希望大家可以学习一下，学习完之后肯定会有收获的，下面让小编带大家一起来看看吧。
(一) 准备工作
(1) 登录注册
注册账号：这就不谈了，只需要注意使用一个全新的邮箱，别之前注册过公众号小程序等就可以了
https://mp.weixin.qq.com/wxopen/waregister?action=step1
登录账号：通过邮箱密码登录，亦或者绑定微信后使用扫码也是可以的
https://mp.weixin.qq.com/
(2) 获取 APPID
登录后，在开发入门的阶段有一个比较重要的内容需要了解，那就是 APPID，很好理解，就是这个小程序的唯一标识，就类似我们的身份证，登录后首页左侧栏选择【开发】，跳转后，选择【开发设置】就可以看到我们的 APPID
这个 APPID 要记好哈，在刚开始学习的时候，就会使用到
(3) 下载工具
在官网选择一个合适的版本进行下载，这就是我们小程序的编译器，这里我选择的是开发版，不过选择稳定版也是可以的，针对入门并没有太大的区别，不过稳定版可能出现的小毛病会少一些
https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
安装好后，直接提示扫码登录，接着就是点击左侧【小程序】，然后点击右侧【新建】（一个大加号）填写一些基本的信息
- 项目名称和目录：自己看着弄就可以了
- APPID：之前页面中找到的 APPID 在这个时候就可以用的上了，虽然你使用测试号也是可以进入的，到底后面还是要用自己的 ID 的。
- 开发模式：小程序
- 后端服务：不使用云服务，前面还是以学习小程序本身为主，不使用此选项
- 语言：JavaScript 和 Typescript，根据自身的熟悉程序选择即可
新建后，第一个小程序就完事了哈~
(二) 初识小程序
(1) 界面总览
下面的区域就是一个初始化新建好的项目界面了，图片中标的很清楚，每一块的具体内容，第一次创建项目时，也可以在设置的通用设置中将默认的的工作区以及主题（浅色还是深色）根据自己的需要修改
说明：直接在小程序官方的工具中编写代码也可以，不过我个人选择配合 vscode 或 sublime 进行代码的编辑，在微信官方开发工具或者那个查看结果以及控制台的一些信息
(2) 文件类型
与传统的网页开发有一丝小不同，微信小程序重新定义了它的描述语言，例如 wxml、wxss 等，同时还额外提供了一层 JSON 的配置文件
wxml（页面结构文件）
用来书写、构建页面，类似传统网页开发的 HTML
wxss（样式表文件）
用于制定页面样式，从而美化页面，类似传统网页开发的 CSS
js（脚本文件）
用于指定一定页面交互逻辑，就是 Javascript
json（静态数据配置文件）
JSON 格式的配置文件，设置程序的一些配置效果
(3) 结构目录
A：总体介绍
通过官方开发工具或者vscode等其他编辑器，你可以看到，新建一个项目后，会默认生成一个初始化的项目结构，里面含有很多文件，其后缀格式都是我们上面介绍过的
下面我们针对一些主要的内容进行一个基本的介绍
├── pages // 页面文件夹 | ├── index // 首页 │ | ├── index.js // 首页逻辑脚本文件 │ | ├── index.json // 首页配置文件 │ | ├── index.wxml // 首页页面结构文件 │ | ├── index.wxss // 首页样式文件 | ├── logs // 日志页面 │ | ├── logs.js // 日志页面逻辑脚本文件 │ | ├── logs.json // 日志页面配置文件 │ | ├── logs.wxml // 日志页面页面结构文件 │ | ├── logs.wxss // 日志页面样式文件 | ├── utils // 工具js文件（第三方，可删除） │ | ├── util.js // 日志页面逻辑脚本文件 │ ├── app.js // 项目的全局脚本文件 │ ├── app.json // 项目的全局配置文件 │ ├── app.wxss // 项目的全局配置文件 │ ├── project.config.json // 项目的开发者工具的配置 │ ├── sitemap.json // 索引配置文件
网页标题：微信小程序入门-创新互联
转载注明：http://scgulin.cn/article/dipggc.html
