一、微信小程序介绍
1、什么是微信小程序
传说中的微信“应用号”终于要来了,但它的正式名称很有可能是“微信小程序”。那么什么是小程序呢?小程序是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或者搜一下即可打开应用。也体现了“用完即走”的理念,用户不用关心是否安装太多应用的问题。应用将无处不在,随时可用,但又无需安装卸载。
小程序传承了企业号、服务号:触手可得,不用安装,用完即走的优点。小程序的前景是非常不错的,小程序生态很可能成为移动原生生态的下一代替代品。
2、微信小程序的优点
触手可得、不用安装、用完即走
3、微信小程序对行业的冲击
- 原生生态下生存的很多公司的商业模式会受到很大冲击
- 原生开发、 UI 设计、流量运营这些领域的人的失业率会增加
- 对浏览器生态也会产生影响
4、学习微信小程序开发需要具备的基础
- html、css、js基础
- ajax基础
- 简单的面向对象基础
前面扯了一大通的废话,下面转入正题吧,正式介绍微信小程序开发流程
二、开发工具下载及安装
官网地址:https://mp.weixin.qq.com/wiki
注意:打开界面后,点开左侧‘微信公众平台’下拉菜单——>选择‘微信公众平台-小程序’菜单,即可看到小程序开发的相关文档手册的链接
下载地址:https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html
下载完成安装包之后和安装通常的软件一样安装,安装完成后打开开发工具界面如下(下面是我已经创建了一个小demo哦):
注意:首次打开工具的时候需要扫描二维码来绑定你的微信账号,做过微信开发的都知道,上图的图标就是你的微信图像哦。
三、微信小程序:Hello World创建
1、点击’添加项目’菜单弹出具体的添加界面
AppID:目前没有正式版本,所以选择‘无AppID’,等发布正式版本后可以根据情况修改;如果你有内测邀请,你可以登录:https://mp.weixin.qq.com,在网站的“设置”-“开发者设置”中,查看到微信小程序的 AppID;
项目名称:设置一个本地项目的名称(非小程序名称),比如“我的第一个项目”;
项目目录:选择一个本地的文件夹作为代码存储的目录。类似于Eclipse的工作空间,用来保存你的项目(注意,小程序创建的时候不会自动生产一个项目文件夹哦,所以要注意了)
参数设置完成后,点击’添加项目’按钮,即可创建自己的第一个小程序了。
注意:在创建过程中,如果选择的本地文件夹是个空文件夹,开发者工具会提示,是否需要创建一个 quick start 项目。选择“是”,开发者工具会帮助我们在开发目录里生成一个简单的 demo。
2、项目界面—菜单
编辑:可以查看和编辑我们的代码
注意:每次编辑完成后,需要切换到’调试’菜单,然后点击‘重启’功能才能生效哦。
调试:可以测试代码并模拟小程序在微信客户端效果
项目:可以发送到手机里预览实际效果(似乎没有内测AppID无法上传手机预览哦)
四、微信小程序目录结构介绍
目录介绍看下图及简易结构(建议向创建一个demo,结合demo来看哦):
详细介绍:
根目录:
|-- app.js(必须) 脚本文件,小程序的逻辑文件:定义了一个应用实例,可通过getApp()获取到。
| 语法:app(json对象)
|
|-- app.json(必须) 公共配置文件,例如配配置导航条样式,底部tab菜单等
| 是一个JSON对象,pages属性类似于定义了路由数组,pages的第一个元素表示小程序的首页
|
|-- app.wxss 公共样式文件,公共的css文件
|
|-- untils 存放公用js文件的文件夹
| |
| |-- util.js
|
|-- pages 页面相关的文件夹名称不能修改
|
|-- index index页面文件夹(注意:为了减少配置项,建议页面文件夹名称和文件夹下的文件名保持一致,且js/wxml/wxss/json四个文件有相同的路由)
|
|-- index.js(必须) 当前页面对应的js文件,可通过var app = getApp()来获取当前应用实例。
| 语法:Page(json 对象)
|
|-- index.wxml(必须)
|-- index.wxss
|
|-- logs logs页面文件夹
|
|-- logs.js
|-- logs.json logs页面的数据及配置文件
|-- logs.wxml logs页面的页面布局展示文件,相当于html
|-- logs.wxss logs页面的独立样式文件
建议:查看第四部分项目目录结构是,请先创建一个简单的小程序demo,然后结合实际demo查看,并且根据简易结构中的文字注意,查看没有文件并试着修改看看效果。
总结:这篇博文前半部分是长见识,后半部分在具体到小程序的开发流程,写的有些简单,有兴趣的可以去看看官网哦,后续我也会进行完善。此外后续的博文将进行一系列的小程序开发的介绍。
欢迎程序猿小火把的关注和支持,欢迎大家来吐槽哦。我是湖北-我家小菜。