- 小程序从从2017年1月9日上线以来,被媒体说的体无完肤,到小程序的小游戏的火爆,再到Dau超过1.7亿,微信用户达到10亿,告诉我们小程序的市场有多大! * 当初第一次开发小程序时,领导说要先搭建开发环境,我当时还思索半天,网上查文档找教程。后来才知道微信开发那需要什么开发环境。我还以为像配置VUE那样的开发环境,配置些Node.js Javascript的运行时环境、npm Node.js下的包管理工具、webpack 前端资源模块化管理和打包工具、vue-cli 脚手架构建工具等等的一些东西。原来小程序配置的开发环境对我来说就不是些什么环境而是开发所需的条件而已。
一、下载微信开发者工具
二、在公众平台配置需要开发的所需条件
服务器的域名的配置,切记一个月只可以修改。这是在数据交互时是最重要的。
三、认识小程序模板的文件夹用途
Component :用于自定义组件
pages :指定小程序由哪些页面组成。
utils :可以将一些公共的代码抽离成为一个单独的 js (utils.js)文件,作为一个模块; 模块只有通过 module.exports 或者exports 才能对外暴露接口。所以当你在util.js里封装的方法想要在外部使用的话,必须通过 module.exports 或者 exports 对外暴露
app.js :全局逻辑
app.json :决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等
app.wxss :全局样式,作用于每一个页面,而page下的每一个的wxss文件只作用于当前页面,并对全局样式中的相同属性会覆盖。
project.config.json :通常大家在使用一个工具的时候,都会针对各自喜好做一些个性化配置,例如界面颜色、编译配置等等,当你换了另外一台电脑重新安装工具的时候,你还要重新配置。考虑到这点,小程序开发者工具在每个项目的根目录都会生成一个 project.config.json,你在工具上做的任何配置都会写入到这个文件,当你重新安装工具或者换电脑工作时,你只要载入同一个项目的代码包,开发者工具就自动会帮你恢复到当时你开发项目时的个性化配置,其中会包括编辑器的颜色、代码上传时自动压缩等等一系列选项。
pages/index 这些和小程序页面相关的配置
从事过网页编程的人知道,网页编程采用的是 HTML + CSS + JS 这样的组合,其中 HTML 是用来描述当前这个页面的结构,CSS 用来描述页面的样子,JS 通常是用来处理这个页面和用户的交互。同样道理,在小程序中也有同样的角色,其中 WXML 充当的就是类似 HTML 的角色。
四、开始踩坑
五、你的第一个小程序
踩坑之路很难走,只要坚持下去就会雨见天晴,守得云开见月明。
微信小程序开发语言和“前端三件套”的异同点
HTML与WXML:两者差异比较大,如果之前没有接触过Android开发,可能会觉得有些头疼。事实上,WXML更像是Android开发中的界面XML描述文件,适合于程序界面的构建;而HTML则倾向于文章的展示(这与HTML的历史有关),以及互联网页面的构建。
WXSS与CSS:两者在语言上几乎没有差别,可以直接通用。
JS文件:小程序的JS文件与前端开发使用的JS几乎没有区别,只是小程序的JS新增了微信的一些API接口,并去除了一些不必要的功能(如DOM)。
这是对小程序的初步认识,接下来就是开始我们的踩坑之路了,记得多看文档多看好的源码,别死记硬背文档里的所有东西。当初开始写代码时,还以为要把26个英文字母拼接一起才可以,要记好多好多的方法才可以编写程序,入坑后才发现程序中业务逻辑实现的思路才是最重要,有了思路就可以去文档查找你所需要的方法然后去编写,这样接下去的路就会越走越容易。第一次写,写的不够好,有需要改进的地方请提出来,谢谢了。