2017年1月9日,张小龙在2017微信公开课Pro上发布的小程序正式上线,一夜之间,小程序可谓家喻户晓,但通过接下来的几个月的观察,微信小程序并没有想象中的那么火爆。进入4月以来,微信小程序团队进行了多次发文调整,并放开了个人公众号快速注册小程序能力。不管未来如何,微信小程序已经在发力了,作为一名码农,咱还是先了解下小程序的开发流程及规范,以备不时之需!

  按照惯例,学习一门新技术或者新框架,咱们还是从官方提供的文档开始,于是找到微信小程序官方教程(https://mp.weixin.qq.com/debug/wxadoc/dev/)

  

  1、注册微信小程序账号

  按照文档指引,咱们得先注册一个微信下程序的账号,访问地址(https://mp.weixin.qq.com/cgi-bin/registermidpage?action=index&lang=zh_CN),选择“小程序”,按要求填写相关信息即可完成微信小程序的注册。(ps:微信严格区分个人公众号与小程序,因此微信小程序的注册邮箱不可以与微信个人公众号的邮箱相同)

  

  2、获取微信小程序的 AppID

  注册完成后登录,就可以在网站的“设置”-“开发者设置”中,查看到微信小程序的 AppID 了,注意不可直接使用服务号或订阅号的 AppID 。

  

  3、下载微信小程序开发者工具

  由于微信小程序的代码及规范相对封闭,因此按照微信官方的说法,为了帮助开发者简单和高效地开发微信小程序,推出了全新的开发者工具(https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/devtools.html),集成了开发调试、代码编辑及程序发布等功能。

  4、创建demo项目

  下载完成后,选择创建“项目”,填入上一步获取到的AppID,设置本地项目的名称(非小程序名称),如:demo,并选择一个本地的文件夹作为代码存储的目录,点击“新建项目”就可以了。

  为了方便上手,咱们先使用微信官方提供的样例源码(https://mp.weixin.qq.com/debug/wxadoc/dev/demo/quickstart.zip)。

  

  项目创建成功后,我们就可以点击该项目,进入并看到完整的开发者工具界面,点击左侧导航,在“编辑”里可以查看和编辑我们的代码,在“调试”里可以测试代码并模拟小程序在微信客户端效果,在“项目”里可以发送到手机里预览实际效果。

  5、手机预览

  开发者工具左侧菜单栏选择"项目",点击"预览",扫码后即可在微信客户端中体验。

  

  6、代码上传

  开发者工具左侧菜单栏选择"项目",点击"上传"即可将代码上传到微信小程序服务器。

  

  7、小程序发布

  登录微信公众平台并访问小程序首页(https://mp.weixin.qq.com/wxopen/initprofile?action=home&lang=zh_CN),按要求完成第1步,填写小程序相关信息及用户身份信息(暂时可绑定5个开发者和10个体验者),然后点击第2步“前往发布”按钮,按要求填写小程序相关信息及版本信息即可提交审核。

  

  

  至此,微信小程序相关流程已经基本走完,接下来等待微信官方审核,然后与具体的微信公众号绑定即可进行访问。

  ps:关于微信小程序具体的代码编写及规范可详见微信官方的开发者文档,这里就不做详细介绍了。

----------------------------------------------------------------------------------------------------------------------------

ps:除了代码之外,咱还可以聊点别的,有兴趣可以关注我的个人微信公众号!

微信小程序开发流程的更多相关文章

  1. 商业版微信小程序开发流程

    一.产品阶段 ①功能规划思维导图——产品经理了解清楚整个项目需求,产出清晰明确的功能需求说明. ②需求报价预算——产品经理确定好功能需求后,输出整个项目开发的报价方案. ③组建技术开发团队——初步确认 ...

  2. 微信小程序开发简述

    微信小程序简述 什么是微信小程序? 微信小程序,简称小程序,英文名Mini Program,是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用.全面开放 ...

  3. 微信小程序开发的基本流程

    微信小程序开发的基本流程 一,微信小程序简介 1,微信小程序简称小程序,张小龙在微信公开课 Pro 上发布的小程序正式上线,时间是2017年1月9日. 2,微信小程序这个词可以分解为“微信”和“小程序 ...

  4. thinkphp开发微信小程序后台流程

    thinkphp开发微信小程序后台流程,简单分享一下微信开发流程 1,注册微信小程序账号 2,注册好后,登陆微信小程序,下载微信小程序开发工具 3,用thinkphp开发企业后台,前台数据用json返 ...

  5. 【微信小程序开发•系列文章六】生命周期和路由

    这篇文章理论的知识比较多一些,都是个人观点,描述有失妥当的地方希望读者指出. [微信小程序开发•系列文章一]入门 [微信小程序开发•系列文章二]视图层 [微信小程序开发•系列文章三]数据层 [微信小程 ...

  6. 微信小程序开发之入门篇(熟悉开发工具)

    个人的每一篇博文都谈不上有什么技术含量,只是为了帮助不熟悉微信小程序开发的自己及他人提供一下思路.谢谢,下面开始! PS: 因为本人没有小程序的内测资格,所以所有的开发及Demo都是无AppId的,如 ...

  7. 微信小程序开发入门教程

    做任何程序开发要首先找到其官方文档,微信小程序目前还在邀请内测阶段,目前官方放出了部分开发文档,经过笔者一天的查看和尝试,感觉文档并不全面,但是通过这些文档已经能够看出其大概面貌了.闲话不多说,我们先 ...

  8. 从零入手微信小程序开发

    前言: 哈哈,发现我写的随笔都是项目驱使的.当然,这篇也是项目驱使的咯,前段时间领导在玩微信时候发现了微信小程序的好处,流程,切换速度快等,然后就让小弟研究研究小程序的实现. 补充下,博客大多都是处理 ...

  9. 微信小程序开发《一》:阿里云tomcat免费配置https

    小狼咕咕最近开启了微信小程序开发的征程,由于微信小程序的前后台通信必须通过https协议,所以小狼咕咕第一件要做的事就是配置一个能够通过https访问的后台服务.小狼咕咕用的是阿里云ECS服务器,Li ...

随机推荐

  1. IOS-验证码的实现和封装(可以直接调用)

    最近对OC中的图像比较感兴趣.随手搞得一个类似验证码的demo.直接贴代码了. 小demo中的VerificationCodeView是继承自UIView的,所以需要用到的时候,可以直接定义一个UIV ...

  2. Apache优化

    控制MaxClients的设置,以避免服务器产生太多的子进程而发生交换.进程间的数据交换会占用很大内存,数据交换产生的滞后使用户总感觉"不够快",所以用户就可能去按"停止 ...

  3. 深度学习实践系列(2)- 搭建notMNIST的深度神经网络

    如果你希望系统性的了解神经网络,请参考零基础入门深度学习系列,下面我会粗略的介绍一下本文中实现神经网络需要了解的知识. 什么是深度神经网络? 神经网络包含三层:输入层(X).隐藏层和输出层:f(x) ...

  4. VSCode里的一些有用的插件

    1.EaseServer 作用:开启本地 http server,然后在browser里打开html: 在调试页面的时候,打开页面比较方便,不需要先开启server,再打开html 2.Debugge ...

  5. Python之路-awk文本处理

    作业一:整理博客,内容包含awk.变量.运算符.if多分支 一.awk 1.awk是一个优秀的文本处理工具,多用来处理含有特殊分隔符的内容 常见用法 awk -F:  {print $1,$4} 作业 ...

  6. reactjs点滴记录

    reactjs: render方法后面,}后面,不要加分号,加逗号,因为是对属性赋值,否则报错: var Test = React.createClass({ render:function(){re ...

  7. 老李分享:loadrunner 的86401错误

    老李分享:loadrunner 的86401错误   系统和软件配置: os:windows 2003loadruner版本:LoadRunner11loadrunner:协议:SMTP协议并发数:2 ...

  8. js面向对象二级菜单

    <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...

  9. 在程序加载过程中显示ProgressDialog 对话框

    private ProgressDialog mProgressDlg = null; @Override protected void onCreate(Bundle savedInstanceSt ...

  10. 如何使用CocoaPods

    如何使用CocoaPods 1.进入主目录下 cd /Users/HYYT/Desktop/支付功能/微信支付宝集成/支付宝微信支付集成 2.建立Podfile(配置文件) 2.1  输入:vim P ...