微信小程序开发前准备工作与环境流程

来源:

  微信小程序定位确定下来,微信小程的开发是一个必须面对的问题,小程序开发需要哪些准备工作?需要在什么环境下进行?微信小程序开发需要多少钱,费用是多少?都是小程序开发者必须面对的问题,小程序开发流程是怎样?腾讯云布道师贺嘉详细讲解了腾讯对于小程序的定位,以及开发者们如何更好的使用小程序。

  一、小程序开发门槛降低 面向个人开发者开放【机遇——人人都可以是产品经理】

  此前只有企业账号才能开发小程序,这其实极大地抑制了个人开发者的能力。小程序昨日正式对个人开发者开放注册。有开发能力的个人,可以在开放的类目范围内实名申请注册、开发小程序了。

  二、微信小程序开发前准备工作与环境流程

  【步骤一】当你准备开发一个微信小程序的时候,你首先需要一个小程序的 APPId ,在微信公众号官网可以获得。(暂时只有官方邀请的才可以获得)。

  你还需要准备微信开发者工具,官网同样有下载,下载安装即可,支持windows,linux,和MAC平台。

  【步骤二】小程序使用的微信自己开发 MINA 框架,提供了视图层描述语言,WXML 和 WXSS 以及基于JavaScript的逻辑层框架,并在视图层与逻辑层间提供了数据传输和事件系统,可以让开发者可以方便的聚焦于数据与逻辑上。

  打开的时候会自动提示创建一个demo,demo结构文件树如下:

微信小程序开发|小程序开发

  【步骤三】其中app.js、app.json、app.wxss 是必不可少的,是小程序生成的依赖文件。

  app.js 监听并控制这整个程序的生命周期,也是全局变量声明的地方。如下是 app.js 中的一段代码:

微信小程序开发|小程序开发

  【步骤四】上述代码中的一些 API 介绍:

  App : 注册一个小程序

  onLunch :程序加载时执行的方法

  getStorageSync:以同步的方式获取本地缓存

  setStorageSync:设置缓存

  wx.getUserInfo: 获取用户信息

  【步骤五】app.json 是对整个小程序的全局配置。不可注释。

  pages为注册页面的列表,均为相对路径,省去了后缀名,程序默认显示列表第一个。

微信小程序开发|小程序开发

  【步骤六】app.wxss 是整个小程序的公共样式表。

  其中:

  apx 是尺寸单位,可根据屏幕宽度自适应大小。与之对应的有rem:规定屏幕宽度为20rem;1rem = (750/20)rpx 。

微信小程序开发|小程序开发

  【步骤七】全局文件就这些,然后我们看 index 文件中的内容

  有三部分内容,index.js ,index.wxml ,index.wxss,下面介绍它们的作用。

  【步骤八】index.wxml 文件

  这是一个展示页面,作用于html相同。可以看出,内容分块均采用 view 标签,这也很容易让人想到Android 中的布局,但其实只是更多的是 div 标签的另一个版本,在这里面有很多 MINA 自定义的属性,而且在我们在其中也看到了{{ }}样式的值操作,这也很容易让人联想到 angularJS 中的数据双向绑定,在 MINA 中也是支持的。

  同时,页面的展示,均需要在小程序全局的json配置文件中配置,前面已有说明。

微信小程序开发|小程序开发

  【步骤九】index.js 文件

  其中:

  getApp() 获取应用实例

  Page : 声明页面。

  data: 定义数据

  bindViewTap :为在view中绑定的是tap事件定义操作方法。

  wx.navigateTo :导航到响应页面。

  onLoad : 定义页面加载时的事件。在这里使用了在全局 app.js 中定义的回调函数,将data中的数据更新,由于双向的绑定,页面中的 userInfo 实例也会更新,显示出您的头像和昵称。

微信小程序开发|小程序开发

  【步骤十】index.wxss 中同样定义了一些样式,写法思路与css文件基本一致,只是不需要再去关心屏幕适配问题。

  随后就是效果展示了,在开发者工具中扫码即可查看效果。

  【注意事项】

  这里只是入门实例,详细内容可以将来会有详细的API文档。

  微信小程序处于内测阶段,开发的详情处于保密因素不会对外界透露,期待后期更新

  三、以下是经韦物主义整理的演讲精华:

微信小程序开发

小程序是改善微信用户体验的机会

现在微信里面有一些应用,例如滴滴出行、地图等第三方应用,它们的使用体验都不太好。某种程度上,这些微信第三方服务体验的不足,对腾讯是一个机会。

我们设想,(创业者/开发者)可以预先把文件缓存在微信存储端,当用户在微信打开第三方应用之后,不需要忍耐长达3-5秒白屏的时间,即开即用。

小程序不能做什么?不适合做什么?

目前“小程序”的接口,暂时不支持游戏、测试、直播等第三方应用,虽然未来我们会做一些完善,但这些也不是我们希望开发者去做的方向。

微信小程序开发

腾讯对于“小程序”开发的应用场景理解,是——拿来做一些用户不经常使用,但是刚需的工具。例如,支付、购物、生活服务等。

微信小程序开发

小程序也不太适合做展示,因为传统在VI(交互设计)经常用来做页面显示的border(边框),小程序就不支持。小程序绝非H5开发。

微信小程序开发

微信小程序开发

我们希望极简,在交互层面,如果你的应用设计比较复杂,可能需要修改你的交互方式。

小程序适合做什么?

小程序也有很多功能,如果你按照之前的方式在一个页面里面打开几个链接,会发现链接怎么失效了?我们会在小程序开发的时候把它们变成“引用”,而不是再跳转。

小程序的开发过程不像做一个H5页面,还是更像一个基于BI(数据库)技术,做一个CI(一个PHP框架)的开发,更像基于C/S的开发。同时它有一个程序包(SDK)的概念,正常的文件里面也会获得这个对象。开发里面会有筛选。

还有运营,小程序的运营是需要验证的。

在程序开发过程中有这些挑战,主要是小程序开发怎么更像前端方向?更像CI(框架)方向?我们自己出了一个通用架构,你可以看一下,在小程序开发中严格遵守一点,我们会提供监控和高级服务,包括数据库等等。

微信小程序开发

简单说,你在小程序开发过程当中,本来要买很多的后端服务器、CDN、域名解析等等,要花上一天的时间才能配置上。在腾讯云的解决方案中,你只需要点一下按键,一次购买,需要不到5分钟。

微信小程序开发

在每一个移动端里面,都会有一些标杆性的场景。小程序现在由于还没有用户来同时使用,如果这个平台能火,一定是因为一些爆款。

从这个层面来看,小程序在一些系统的接口给我们提供了更多的可能性,包括网络设备状况、重力感应、社交等等,提供了更多的接口。简单来说,在我看来,腾讯云给小程序提供了更多的接口,让更多的开发者和我们一起,用腾讯云和小程序给用户一些能力,让小程序的开发变得更加简单。


阅读824
分享