关键词：
🖥️ 微信小程序专栏：小程序开发 初级知识
🧑💼 个人简介：一个不甘平庸的平凡人🍬✨ 个人主页：CoderHing的个人主页
🍀 格言: ☀️ 路漫漫其修远兮,吾将上下而求索☀️
👉 你的一键三连是我更新的最大动力❤️
目录
一、认识小程序开发
什么是小程序?
小程序（Mini Program）是一种不需要下载安装即可使用的应用，它实现了“触手可及”的梦想
使用起来方便快捷，用完即走
事实上,目前小程序在我们生活中已经随处可见（特别是这次疫情的推动，不管是什么岗位、什么年龄阶段的人，到哪都需要打开健康码）
最初我们提到小程序时，往往指的是 微信小程序：
但是目前小程序技术本身已经被各个平台所实现和支持；
那么目前常见的小程序有哪些呢？
微信小程序、支付宝小程序、淘宝小程序、抖音小程序、头条小程序、QQ小程序、美团小程序等
各个平台小程序的时间线:
各个平台小程序大概的发布时间线：
2017年1月 微信小程序上线，依附于微信App；
2018年7月 百度小程序上线，依附于百度App；
2018年9月 支付宝程序线，依附于支付宝App；
2018年10月 抖音小程序上线，依附于抖音App；
2018年11月 头条小程序上线，依附于头条App；
2019年5月 QQ小程序上线，依附于QQApp；
2019年10月 美团小程序上线，依附于美团App；
各个平台为什么都需要支持小程序?
你有,我也得有
大厂竞争格局中一个重要的一环。
小程序作为介于H5页面和App之间的一项技术，它有自身很大的优势；
体验比传统H5页面要好很多；
相当于传统的App,使用起来更加方便,不需要在应用商店中下载安装,甚至注册登录等麻烦的操作
小程序可以间接的动态为App添加新功能
传统的App更新需要先打包，上架到应用商店之后需要通过审核（App Store）；
小程序可以在App不更新的情况下，动态为自己的应用添加新的功能需求
目前 这么多小程序的竞争格局中，哪一个是使用最广泛的呢？
显示是微信小程序，目前支付宝、抖音小程序也或多或少有人在使用；
其实我们透过小程序看本质，他们本身还是应用和平台之间的竞争，有最大流量入口的平台，对应的小程序也是用户更多一些
目前在公司开发小程序主要开发的还是微信小程序，其他平台的小程序往往是平台本身的一些公司或者顺手开发的
所以一定要重点学习 微信小程序的开发
二、小程序开发选择
小程序由谁来开发
我们确定一下小程序的定位是怎么样的
介于原生App和手机H5页面之间的一个产品定位。
那么，由此我们也会产生一个疑惑：小程序是由谁来开发呢
难道搞出一个《小程序开发工程师》
由谁开发事实上是由它的技术特点所决定的，比如微信小程序WXML、WXSS、JavaScript；
它更接近于我们前端的开发技术栈，所以小程序都是由我们前端来开发的
也就是说呢，你想要成为一个前端工程师或者找一份前端的工作，小程序是你必须学会的。
三、小程序开发前准备
开发小程序的技术选型
原生小程序开发：
微信小程序:(浏览器直接搜索 微信小程序)
主要技术包括 : WXML WXSS Js
支付宝小程序:(浏览器直接搜索 支付宝小程序)
主要技术包括:AXML ACSS Js
选择框架开发小程序:
Mpvue:
Mpvue是一个使用Vue开发小程序的前端框架，也是 支持 微信小程序、百度智能小程序，头条小程序 和 支付宝小程序；
该框架在2018年之后就不再维护和更新了，所以目前已经被放弃；
Wepy:
WePY是由腾讯开源的，一款让小程序支持组件化开发的框架，通过预编译的手段让开发者可以选择自己喜欢的开发风格去开发小程序。
该框架目前维护的也较少，在前两年还有挺多的项目在使用，不推荐使用；
uni-app 和 taro
Uni-app:
由DCloud团队开发和维护;
uni-app是一个 使用Vue开发 所有前端应用的框架,开发者编写一套代码,可发布到IOS 安卓 Web(响应式) 及各种小程序 快应用等 多个平台
uni-app目前是很多公司的技术选型，特别是希望适配移动端App的公司；
Taro:
由京东团队开发和维护;
taro 是一个开放式 跨端 跨框架 解决方案，支持使用 React/Vue/Nerv 等框架来开发 微信 / 京东 / 百度 / 支付宝 / 字节跳动 / QQ / 飞书 小程序 / H5 / RN 等应用
taro因为本身支持React、Vue的选择，给了我们更加灵活的选择空间
特别是在Taro3.x之后，支持Vue3、React Hook写法等
uni-app和taro开发原生App
无论是适配原生小程序还是原生App,都有较多的适配问题,所以还需要多了解原生的一些开发知识
产品使用体验整体相较于原生App差很多
也有其他的技术选项来开发原生App：ReactNative、Flutter；
需掌握的预备知识
小程序的核心技术主要是三个:
页面布局: WXML 类似 HTML
页面样式 WXSS 几乎就是CSS(某些不支持,某些增强,基本一致)
页面脚本 JavaScript + WXS(WeixinScript)
如果你之前已经掌握了Vue或者React等框架开发，那么学习小程序是更简单的
因为里面的核心思想都是一致的（比如组件化开发 数据响应式 mustache语法 事件绑定等等）
注册账号 - 申请AppID
注册账号:申请AppID
接入流程: (百度 微信小程序)
|
|
|
下载小程序开发工具
小程序的开发工具:
微信开发者工具: 官方提供的开发工具,必须下载,安装
VSCode:很多人比较习惯使用它来编写代码
微信开发者工具下载:(百度)
使用VSCode开发
推荐插件:
|
|  |
|
创建小程序项目
开发工具的解析
四、小程序目录的结构
项目目录结构
阅读官方文档
五、小程序的开发体验
小程序开发体验
小程序开发初体验
1 数据绑定
2 列表渲染
3 事件监听
|
| |
六、小程序MVVM架构
Vue的MVVM和小程序MVVM对比
|
|
|
MVVM为什么好用?
DOM Listeners: ViewModel层可以将DOM的监听绑定到Model层
Data Bindings: ViewModel层可以将数据的变量, 响应式的反应到View层
MVVM架构将我们从 命令式编程 转移到 声明式编程
微信小程序|小程序开发
🖥️微信小程序专栏：小程序开发初级知识🧑💼个人简介：一个不甘平庸的平凡人🍬✨个人主页：CoderHing的个人主页🍀格言:☀️路漫漫其修远兮,吾将上下而求索☀️👉你的一键三连是我... 查看详情
微信小程序开发环境搭建
微信小程序可谓是今天最火的一个名词了，一经出现真是轰炸了整个开发人员，当然很多App开发人员有了一个担心，微信小程序的到来会不会给移动端App带来一个寒冬，身为一个Android开发者我是不相信的，即使有，那也是很遥... 查看详情
微信小程序开发系列——1.微信小程序介绍
摘要：本文介绍了微信小程序在今年发展的来龙去脉，介绍了微信小程序在微信中的基础特性和用法，为开发做好准备。1.微信小程序的介绍好不容易毕业拿到学位证书了，在九月入学研究生之前原本以为可以休... 查看详情
微信小程序开发引入vant没反应
微信小程序开发引入vant没反应是服务器崩溃造成的。微信小程序有很多，一部分是服务器不稳定的，如果在某个时间段有大量的人使用微信小程序，可能就会直接导致服务器崩溃。这种情况就是服务器崩溃造成的。参考技术A微... 查看详情
小程序开发运营必看：微信小程序平台运营规范
一、原则及相关说明?微信最核心的价值，就是连接——提供一对一、一对多和多对多的连接方式，从而实现人与人、人与智能终端、人与社交化娱乐、人与硬件设备的连接，同时连接服务、资讯、商业。?微信团队一直致... 查看详情
微信小程序开发:http请求
在微信小程序进行网络通信，只能和指定的域名进行通信，微信小程序包括四种类型的网络请求。普通HTTPS请求(wx.request)上传文件(wx.uploadFile)下载文件(wx.downloadFile)WebSocket通信(wx.connectSocket)这里以介绍wx.request,wx.uploadFile,wx.dowloadFil... 查看详情
微信小程序开发——微信小程序下拉刷新真机无法弹回(代码片段)
开发工具中下拉之后页面回弹有一定的延迟，这个时间也有点久。真机测试，下拉后连回弹都没有，这个问题要解决，就得在下拉函数里加上停止下拉刷新的API，如下：/***下拉刷新*/onPullDownRefresh:function(e)this.getList()wx.stopPullDownRe... 查看详情
微信小程序开发要求
参考技术A一、微信小程序wxml有编程基础的工程师在接触到wxml之后才会发现，这种语言的编程理念和html页面的编程技术很相似当你稍微研究一下，就会知道开发一个微信小程序所需的技术含量并不高，只是一些标签的替换，比... 查看详情
微信小程序开发？
如果不适用微信官方IDE，能用什么软件开发小程序？求助！！！1、注册微信小程序账号小程序注册账号这个直接进入微信小程序官网自行注册即可，在此不多赘述。微信小程序官方2、获取APPID获取小程序APPIDAPPID在哪里获取呢，... 查看详情
微信小程序开发(代码片段)
1、微信小程序简介1.1、什么是微信小程序 百度百科给出的定义：微信小程序,英文名WechatMiniProgram，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开... 查看详情
微信小程序开发(代码片段)
1、微信小程序简介1.1、什么是微信小程序 百度百科给出的定义：微信小程序,英文名WechatMiniProgram，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开... 查看详情
大佬教你微信小程序分包（附微信小程序开发学习手册）(代码片段)
...原文地址：https://blog.csdn.net/atu1111/article/details/120487943微信小程序分包1.为什么要分包在微信小程序上线时，要求整个小程序所有分包大小不超过16M（主包+所有分包 查看详情
大佬教你微信小程序分包（附微信小程序开发学习手册）(代码片段)
...原文地址：https://blog.csdn.net/atu1111/article/details/120487943微信小程序分包1.为什么要分包在微信小程序上线时，要求整个小程序所有分包大小不超过16M（主包+所有分包 查看详情
小程序微信小程序开发流程(代码片段)
...）登录流程时序流程图2）认识openid，unionid和code一、概述微信小程序是一种基于微信平台的应用程序，用户可以在微信中直接使用这些小程序，无需下载和安装，具有轻便、快速、实用等特点。微信小程序通常可以提供各种服务... 查看详情
微信小程序开发资源汇总awesome-wechat-weapp(不定期更新)
...程序开发文档小程序设计指南小程序开发者工具新闻报道微信正式开放内测“小程序”，不开发APP的日子真的来了？(36氪)关于微信小程序（应用号），我能透露的几个细节(可能吧)你的产品适不适合做微信小程序？你需要这篇产... 查看详情
微信小程序需要啥知识
...常用的Web开发所需要的、以及会制作手机网页。如何选择微信小程序开发公司？开发公司分为两种，一种是平台式模板公司，一种是定制开发公司1、定制开发公司，这种公司收费较高，一般一万起；但是优势也很明显，功能可... 查看详情
微信小程序开发基础「配置」与「逻辑层」(代码片段)
微信小程序作为微信生态重要的一环，在实际生活、工作、商业中的应用越来越广泛。想学习微信小程序开发的朋友也越来越多，本文将在小程序框架的基础上就微信小程序项目开发所必需的基础知识及语法特点进行了详细总结... 查看详情
微信小程序开发——点击按钮退出小程序的实现
微信小程序官方是没有提供退出的API的，但是在navigator这个组件中，是有退出这个功能的：详情参考官方文档：navigator。示例代码：1navigatoropen-type="exit"target="miniProgram"关闭小程序/navigator不过这个... 微信小程序... 查看详情