微信小程序入门介绍

一、什么是微信小程序
- 1. 简介
- 2. 技术原理
- 2.1 线程
- 2.2 API
- - 2.3 环境
- 3. 微信小程序与APP、公众号、H5
- - 3.1 小程序 VS APP
  - 3.2 小程序 VS 公众号
  - 3.3 小程序 VS H5 VS 原生APP
二、微信小程序有什么用
- 1. 用途
- 2. 优势
三、开发前准备
- 0. 能力要求
- 1. 申请小程序AppID
- - 1.1 搜索并进入微信公众平台主页，在页面右上角选择立即注册，进入注册页面
  - 1.2 选择小程序
  - 1.3 填写好相关信息和提交相应材料即可获得小程序账号（如果是个人开发的小程序请选择个人类型）
- 2. 安装开发者工具
- - 2.1 下载地址（目前只支持 Windows 和 MacOS 两种类型的）
  - 2.2 安装（按照提示安装即可）
  - 2.3 工具的基本使用
- 3. 其它注意事项
四、总结

一、什么是微信小程序

1. 简介

小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取和传播，同时具有出色的使用体验。

2. 技术原理

2.1 线程

小程序类似于普通的网页，但是又有区别。网页开发中渲染线程和脚本线互斥，长时间的脚本运行可能会导致页面失去响应。而在小程序中，二者是分开的，分别运行在不同的线程中。

2.2 API

网页开发中可以使用DOM，而小程序则无。小程序的逻辑层运行在 JSCore 中，并没有一个完整浏览器对象，因而缺少相关的DOM API和BOM API。这一区别导致了前端开发非常熟悉的一些库，例如 jQuery、 Zepto 等，在小程序中是无法运行的。同时JSCore 的环境同 NodeJS 环境也是不尽相同，所以一些 NPM 的包在小程序中也是无法运行的。

2.3 环境

网页开发者需要面对的环境是各式各样的浏览器，PC 端需要面对 IE、Chrome、QQ浏览器等，在移动端需要面对Safari、Chrome以及 iOS、Android 系统中的各式 WebView 。而小程序开发过程中需要面对的是两大操作系统 iOS 和 Android 的微信客户端，以及用于辅助开发的小程序开发者工具，小程序中三大运行环境也是有所区别的。

运行环境	逻辑层	渲染层
iOS	JavaScriptCore	WKWebView
安卓	V8（Google的开源高性能JavaScript和WebAssembly引擎，用C ++编写。）	chromium定制内核
微信开发者工具	NWJS	Chrome WebView

3. 微信小程序与APP、公众号、H5

3.1 小程序 VS APP

	微信小程序	APP
下载安装	扫描二维码、分享链接或直接搜索获取	应用商店下载并安装在手机内存中
占用空间	基本不占用手机内存	占用手机比较大的内存空间（可以储存大量数据）
开发	一次性适配所有机型，平均开发期仅为两周	需要适配多种机型，平均开发周期在3个月以上
发布	仅需公众号平台审核	需要提交到各种应用商店审核，由于审核机制不一样，需要提交的材料也不一样，十分繁琐
推广	可以通过二维码、微信搜索、用户分享等方式直接获得，推广难度比较低	需要用户主动搜索下载安装后才可用，推广难度极大

3.2 小程序 VS 公众号

微信小程序	公众号
小程序放弃了传统公众号的关注、群发、分享到朋友圈功能，而在设计规范、产品体验、运营规范、都有自己的一套审核标准，旨在培养产品本身。小程序链接是无法分享到朋友圈的，只能发给好友和群（朋友圈只能分享截图）。	订阅号：以内容为主体，适合经常给用户群发消息的产品，例如媒体。目前做的比较多的KOL大号，以及一些自媒体。服务号：以提供服务为主，比较适合做低频次（用的次数较少）使用。企业号：拥有较强的组织架构，和隐蔽性，适用于制作内部企业CRM系统。

3.3 小程序 VS H5 VS 原生APP

	小程序	H5页面	原生APP
开发难度	简单	中等	难
开发速度	快	中等	慢
后期维护	最容易	中等	最难
框架核心	混合	HTML5	原生
体验和流畅	中等	差	最好
内容体积限制	2MB	较大	无限
迭代速度	快	最快	慢
功能支持	中等	少	最多
推广成本	低	最低	高
用户流程	中等	最低	最高

二、微信小程序有什么用

1. 用途

1、引流（辐射周围5公里所有微信用户）

2、营销（支持砍价，拼团，预约，优惠券，在线商城，在线客服，在线交易等，玩转各种营销）

3、微网站（多纬度展示企业信息，商品信息，视频图文信息）

4、回头客管理（微信小程序的特性，访问即留存，只要使用过您的小程序，小程序就会留存客户手机）

5、支持一键买单，一键打电话，一键联系微信客服

6、后台手机随时掌控，支持多人登录，运营就跟发朋友圈一样简单，可以一键同步朋友圈

7、你能接触客户的使用场景中，都可以用小程序来承载。

8、个人小程序可以开发一些小工具

2. 优势

① 微信拥有庞大的流量，而且微信给小程序提供了多种入口方式，方便用户直达小程序。
② 天生的社交属性，让小程序拥有更好的发展前景。（拼多多就是靠用户裂变发展起来的，半年就达到了京东的程度）
③ 开发成本低、周期短、维护费用少

三、开发前准备

0. 能力要求

微信小程序开发对于有过网页开发经验者没有更多的要求，如果是零经验的小白，建议先了解JS、HTML、CSS相关语法知识再开始准备开发小程序。

1. 申请小程序AppID

1.1 搜索并进入微信公众平台主页，在页面右上角选择立即注册，进入注册页面

1.2 选择小程序

1.3 填写好相关信息和提交相应材料即可获得小程序账号（如果是个人开发的小程序请选择个人类型）

2. 安装开发者工具

2.1 下载地址（目前只支持 Windows 和 MacOS 两种类型的）

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

2.2 安装（按照提示安装即可）

2.3 工具的基本使用

https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html

3. 其它注意事项

在新建项目时，后端服务选择小程序云开发（需要AppID才可用），这样新建的项目就会自动适配云开发的环境。（云函数运行环境为 Node.JS）

四、总结

关于小程序的简单介绍和开发前的准备工作都已经在上面了，做好开发前准备后将开始学习小程序的开发。此外学习小程序应该先学会使用微信开发者文档，下一期将介绍微信开发者文档。欢迎加入我们的学习交流群为：978381571

微信小程序新手教程 1.0相关推荐

微信小程序服务器新手教程,微信小程序新手教程上手开发与使用总结
微信小程序新手教程上手开发与使用总结,本篇默认已经成功安装微信小程序工具,来和小编一起看看吧一.模板 WXML提供模板组件给我们使用,可以在模板定义公用的代码片段,然后在需要引用的地方进行调用. 定 ...
华为云物联网平台微信小程序开发教程2.0【完整详细教程】
一.简介在之前曾发布过一篇文章"华为云物联网平台的微信小程序开发",在最近接到部分用户私信在使用开发过程中出现的问题,例如API访问的"401"现象等问题 ...
微信小程序开发分销制度济南_花店微信小程序开发教程
如何将自己的鲜花商品快速配送出去,避免鲜花过期浪费,是很多传统花店商家的难题.不过随着微信小程序的出现,这一难题也渐渐得到了解决.花店商家可以通过自己的小程序商城,打通线上渠道,可以加大推广.扩大销量 ...
微信小程序开发教程第八章：微信小程序分组开发与左滑功能实现
接着上面微信小程序开发教程第八章:微信小程序分组开发与左滑功能实现.(第一二章:微信小程序开发教程,第三四章:微信小程序项目结构以及配置&微信小程序首页面开发,第五章:微信小程序名片夹详情页开 ...
小程序开发用什么编程语言_微信小程序开发教程是什么？费用多少？
微信小程序如今已经非常常见,渗透到了我们日常生活的方方面面,包括生活服务.出行.点餐.电商购物.企业展示--商家可以开发适合自己行业的小程序,以吸引线上用户,同时提高自身服务运营效率.不过这些不同种类 ...
微信小程序新手容易犯的错误_新手程序员的错误以及如何避免它们
微信小程序新手容易犯的错误 To become a Senior Java Developer, I've been learning Java for many years and still I' ...
视频教程-微信小程序开发教程（第一阶段、页面设计）（维吾尔语）-HTML5/CSS
微信小程序开发教程(第一阶段.页面设计)(维吾尔语) 毕业于北京邮电大学计算机专业.拥有将近10年的开发经验.精通java.php.python.c/c++.微信开发等等技术! 艾孜麦提阿布都热合曼 ...
微信小程序实战教程：模仿—网易云音乐（二）
接上一篇:微信小程序实战教程:模仿-网易云音乐(一) wxml进行渲染:  <view class="lyric-content" hidden ...
微信小程序开发教程手册文档
微信小程序开发教程文档微信小程序是什么?微信小程序如何开发?微信小程序开发教程有哪些?本教程将从微信小程序本身,结合微信官方-微信小程序开发工具,带你一步步创建一个微信小程序,并在手机操作预览该小程 ...
微信小程序开发教程：项目四组件布局课后习题
<微信小程序开发教程>主编/黄寿孟易芳陶延涛湖南大学出版社目录一.单选题二.多选题三.判断题四.填空题五.简答题 1.请简单地介绍微信小程序flex布局的使用. 2.如何 ...

微信小程序新手教程 1.0