题记
世界上最远的距离不是生与死的距离,而是我站在你旁边,你却不知道我在给你推公号。
我们一起学搬砖,一起搬呀搬呀搬。周末的时光总是那么的。。。。。。小编我是应该说漫长呢,还是短暂呢?算了,还是喵喵喵喵喵吧。
自从微信小程序推出以后,随着挑一挑小游戏的爆红,小程序也越来越引起大家的关注,现在线上的小程序也数不胜数(不管质量好坏),不能说盲目的跟风,但了解一些,学些知识还是没有坏处的,技多不压身嘛,那今天咱们就一起来走进小程序。
首先第一步:注册小程序账号
第二步:下载开发工具
打仗得有武器,而腾讯腾讯已经替你考虑好了,还是重量级免费的“武器”,小程序开发工具,你可以去https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html下载适合你电脑版本的开发工具,这样开发前工作基本完成。
第三步:进入主体阶段
打开我们刚刚下载好的开发工具,微信扫码进入到下一步,此时你会发现有两个选项(针对于最新版本开发工具,小编的是一年前的,进去只有一个选项)。
![](http://dingyue.ws.126.net/Wl2wX=O=BjOwlCtSmKsZEnqV2fsSt0ESh5F7ApDL=Oh2X1555554893120.jpg)
然后点击小程序项目,然后开始创建你的项目目录,填写项目名称,当你点击确定的时候会发现没有填写appId不能进入到下一步,这就。。。。。。尴尬啦
![](http://dingyue.ws.126.net/UWc8CLPnL8CyXmNbwdHOj6x1BgQHOccv7shuxL9zJkLb31555554893120.jpg)
奥鸥,不用着急,这个时候就用到我们之前注册的小程序公众号啦,你需要的东西全在里面,以及你以后要真正的上线发布还是在之前我们注册的那个小程序公众号里面发布奥。看下图,你就明白了一切啦。
![](http://dingyue.ws.126.net/xYAdvyXAp5O7o91Uc7t65UBTautcgqlK09oSFvfdMc6vX1555554893122.jpg)
当然,有的小伙伴会说,我不想填appid,就是不想填,有别的办法吗,别急,办法肯定是有的。突然想到小编之前一直爱说的一句话,只要你能提出来的问题,那都不叫问题。你点击“体验小程序”,就一切ok啦,只不过体验选项开发过程中可能会有一些api没有开发,不过也不影响你前期的学习。
![](http://dingyue.ws.126.net/cu=IidXMDuUhq12nFwwKm9KLd5qtA1=J79=JI=dDTtyyQ1555554893123.jpg)
第四步:编辑项目开始
到这一步也是最后一步啦,基本一个傻瓜式的项目框架已经搭建好,展示层,编辑层完成的展现在你的面前,所见即所得,随时编辑项目保存,然后即时的效果就会展现出来。左边效果
![](http://dingyue.ws.126.net/9ea9q3ppjc997V9WozLgYmraP9QOuhoUSTD9T3WOyi8XA1555554893127.jpg)
代码编写及分析:
第四步中我们也看到,一个完整的项目创建完成后,会有一个文件夹,已经初始化并包含了一些简单的代码文件。最关键也是必不可少的,是 app.js、app.json、app.wxss 这三个。其中,.js 后缀的是脚本文件,.json 后缀的文件是配置文件,.wxss 后缀的是样式表文件。微信小程序会读取这些文件,并生成小程序实例。
app.js是小程序的脚本代码。我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。调用 MINA 提供的丰富的 API,如本例的同步存储及同步读取本地数据。
![](http://dingyue.ws.126.net/ccHYgAIrVt7zV2=xRBBVJic83qVtwQFsnA6llQ2PgRaQf1555554893129.jpg)
app.json 是对整个小程序的全局配置。我们可以在这个文件中配置小程序是由哪些页面组成,配置小程序的窗口 背景色,配置导航条样式,配置默认标题。注意该文件不可添加任何注释。
![](http://dingyue.ws.126.net/M7kOdLwEbVezl9RdBAyusUf7KRWrlEXe6baag85R7ky5V1555554893129.jpg)
app.wxss 是整个小程序的公共样式表。我们可以在页面组件的 class 属性上直接使用 app.wxss 中声明的样式规则。
![](http://dingyue.ws.126.net/ZjXKne4PV69Hp0JLEEz1AHjke3bd3aMXHqFO5leG03YyN1555554893129.jpg)
页面文件分析:
在项目里创建文件夹及文件,基本都是由.wxml,.wxss,.js,.json组成的,其中.wxml文件相当HTML中的.html文件,同理,.wxss相当于HTML中的.css文件。奥,奥奥,讲到这里是不是突然脑袋明亮起来,原来是这么个事呀,是的,小程序开发就是这么的容易,而且她还有很多api,你只要会套用,一切都是这么的简单的。
知道这些,小程序开发基本你已经入门了,具体能开发出什么样的小程勋,还需要你不断地学习以及不断的练习,当然,如果你有好的想法和创意,或者有自己设计的小程序设计原型图,可以分享给我,咱们可以一起学习,共同进步。
最后还是希望能够和大家一起学习,共同进步,谢谢大家的支持。
你的支持和鼓励,是我最大的动力。如果感觉是干货,欢迎收藏和分享。
热门跟贴