微信小程序教程及示例

2022-10-18 12:19:52

作者：初雪
链接：https://www.zhihu.com/question/50907897/answer/128494332
来源：知乎
著作权归作者所有，转载请联系作者获得授权。

微信小程序正式公测，公测时间：11月3日夜：
公告地址：https://mp.weixin.qq.com/cgi-bin/announce?action=getannouncement&key=1478163659&version=14&lang=zh_CN
公测配套使用攻略：
微信小程序公测接入指南

整理了一下最近收集了好久的资料，给同学们参考：共分了5类；
1：官方文档地址：
2：免费视频地址：
3：教程系列集合；
4：100个demo
5：学习论坛

11月5日更新内容
--------

19：_Wake新手入门攻略系列：博客地址：_Wake - 简书
_Wake：新手入门攻略《一》视图与渲染，点击事件
_Wake：新手入门攻略《二》配置及生命周期，布局基础&样式基础

demo更新：适应新版（这里特指v0.10.102800版）的demo

--------

11月2日更新内容
--------
14：Coco-LG的学习笔记：博客地址：cocoLG的专栏
 Coco-LG的学习笔记《一》事件
 Coco-LG的学习笔记《二》view(视图容器)
Coco-LG的学习笔记《三》image(图片)
15：Acmen、L学习案例系列：博客地址：Acmen、L - 博客园
 Acmen、L学习案例集锦《一》生命周期，组件
 Acmen、L学习案例集锦《二》弹框组件modal，底部菜单
 Acmen、L学习案例集锦《三》加载中提示框loading，
Acmen、L学习案例集锦《四》video视频播放，audio音频播放
16：梦断难寻新手入门篇系列：博客地址：梦断难寻 - 博客园
 梦断难寻新手入门篇《一》：熟悉项目结构
 梦断难寻新手入门篇《二》：获取系统信息，地理位置，用户信息
 梦断难寻新手入门篇《三》：下拉刷新，上拉加载更多
17：一斤代码深入理解系列：专栏地址：一斤代码 - 简书
 一斤代码深入理解系列《一》：微信小程序事件机制
 一斤代码深入理解系列《二》：微信小程序样式机制
 一斤代码深入理解系列《三》：微信小程序和服务器通信
 一斤代码深入理解系列《四》：微信小程序和服务器通信
 一斤代码深入理解系列《五》：微信小程序中使用Promise进行异步流程处理
18：qc_nj微信小程序准备工作系列：博客地址：再起航！
微信小程序准备工作：微信开发实战《一》申请测试号
 微信小程序准备工作：微信开发实战《二》微信公众平台接口调试工具 ...
微信小程序准备工作：微信开发实战《三》开发者公众号的交互原理 ...
微信小程序准备工作：微信开发实战《四》URL、Token认证、java源码、免费新浪SAE部署 ...
demo更新：适应新版（这里特指v0.10.102800版）的demo

--------

微信小程序在10月27和28日连续更新了两个版本，很多demo在新程序版本下无法使用；以下为10月30日更新内容：
--------
12：半桶水分享系列：作者博客：d617973306的博客
 半桶水技术分享：微信小程序实现跳转传参
 半桶水技术分享《二》：js实现单选功能
 半桶水技术分享《三》：wx:key理解
13：jsong技术分析系列：作者博客：博客 - jsongo0的个人空间；作者公众号：半圆生活
微信小程序开发系列分析《一》视图层
 微信小程序开发系列分析《二》数据层
 微信小程序开发系列分析《三》开发工具v0.10.102800-新增功能解析
 微信小程序开发系列分析《四》websocket
微信小程序开发系列分析《五》模块化
 微信小程序开发系列分析《六》主界面
 微信小程序开发系列分析《七》生命周期和路由

demo新增：适应新版（这里特指v0.10.102800版）的demo

--------

一：官方地址集合：
1：官方工具：https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461
2：简易教程：https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1476434677599
3：设计指南：https://mp.weixin.qq.com/debug/wxadoc/design/index.html
4：设计资源下载：https://mp.weixin.qq.com/debug/wxadoc/design/#资源下载
5：腾讯云教程：https://www.qcloud.com/doc/product/448/6405
二：免费视频地址：
均为网络收集的免费视频：
视频资源 - Demo/资源下载
三：新手教程集合：原创不易，请大家多多支持作者专栏，教程系列均得到了原作者的授权；
1：顺子_RTFSC把玩系列：博客地址：顺子_RTFSC的专栏
 微信小程序把玩《一》：window配置，tabBar底部导航，应用生命周期 ...
微信小程序把玩《二》：页面生命周期，模块化，数据绑定，view组件 ...
微信小程序把玩《三》：scroll-view组件，swiper组件，icon组件
 微信小程序把玩《四》：text组件，progress组件，button组件
 微信小程序把玩《五》：checkbox组件，form组件，input组件
 微信小程序把玩《六》：picker组件，radio组件，slider组件
 微信小程序把玩《七》：switch组件，action-sheet组件，modal组件
 微信小程序把玩《八》：toast组件，loading组件，navigator组件
 微信小程序把玩《九》：audio组件，image组件，video组件
 微信小程序把玩《十》：wx.request(object) API，wx.uploadFile(object)
微信小程序把玩《十一》：Image API，Record API，Audio API
微信小程序把玩《十二》：Video API，Storage API，location API
微信小程序把玩《十三》：获取设备信息 API，navigation API，animation API ...
微信小程序把玩《十四》：canvas API
2：秀杰实战系列：博客地址：博客 - 秀杰的个人空间
 秀杰实战教程系列《一》：记账应用开发
 秀杰实战教程系列《二》：微信小程序绘图课程之饼图
 秀杰实战教程系列《三》：下拉筛选菜单WXDropDownMenu组件
 秀杰实战教程系列《四》：倒计时组件，LXStepper组件-商品数量加减 ...
秀杰实战教程系列《五》：实战课程之记账应用开发（续）
秀杰实战教程系列《六》：服务端之用户注册与登录基于ThinkPHP5描述 ...
秀杰实战教程系列《七》：实现购物车页面
 秀杰实战教程系列《八》：记账应用实战服务端之用户注册与登录基于Codeigniter3描述 ...
秀杰实战教程系列《九》：应用实例教程服务端登录篇
 秀杰实战教程系列《十》：服务端实现账目CRUD
秀杰实战教程系列《十一》：对接服务端账目CRUD
秀杰实战教程系列《十二》：基于LeanCloud实现访问网络与数据存储
3：有渔入门系列：博客地址：编程艺术 - 51CTO技术博客
 有渔微信小程序系统概述《一》认识微信小程序与HelloWorld
有渔微信小程序系统概述《二》了解.js文件及.json文件
 有渔微信小程序系统概述《三》view层及小程序框架概述
 有渔微信小程序系统进阶《四》小程序组件
 有渔微信小程序技术分析《五》Mustache语法要点总结
 有渔微信小程序系统概述《六》小程序的API
有渔微信小程序技术分析《七》实例开发教程
 有渔微信小程序系统概述《八》：小程序开发中应注意的几个问题
4：疯狂的猫入门系列：博客地址：疯狂的猫 - 博客园
 微信小程序入门系列《一》：入门正确姿势
 微信小程序入门系列《二》：开发工具使用与设计规范
 微信小程序入门系列《三》：生命周期
 微信小程序入门系列《四》：触控事件
 微信小程序入门系列《五》：数据绑定
5：栁罗风尘的攻略系列：博客地址：不忘初心，才能始终
 微信小程序简易全攻略《一》开始构建与创建页面
 微信小程序简易全攻略《二》设置页面标题与底部导航
 微信小程序简易全攻略《三》创建轮播图与数据请求，表单的创建、提交、与接收 ...
微信小程序简易全攻略《四》模板条件列表渲染完成模拟公众号自动回复 ...
6：Bison试水系列：博客地址：Bison的技术博客
 IOS开发者试水：微信小程序开发教程-从零开始（1）
IOS开发者试水：微信小程序开发教程-从零开始（2）
IOS开发者试水：微信小程序开发教程-从零开始（3）
7：二当家小武零基础系列：博客地址：u012491227的专栏
 零基础入门篇：微信小程序开发博客项目《上》
零基础入门篇：微信小程序开发博客项目《中》
8：dzp_coder学习点滴系列：博客地址：dzp_coder
微信小程序学习点滴《一》：如何获取时间，页面跳转，传递参数 ...
微信小程序学习点滴《二》：开发者工具快捷键，轮播图 swiper图片组件 ...
微信小程序学习点滴《三》：开发工具及开发环境配置，尺寸单位rpx与px,rem相互转换 ...
微信小程序学习点滴《四》：网络请求
 微信小程序学习点滴《五》：网络请求(POST请求)填坑指南
 微信小程序学习点滴《六》吐司toast(消息提示框)
微信小程序学习点滴《七》选项卡(窗口顶部TabBar)及(窗口底部TabBar)页面切换
 微信小程序学习点滴《八》：数据存储参数传递数据缓存
9：Two_Water的学习系列：博客地址：【微信小程序】
微信小程序学习《一》：目录文件详解，视图渲染详解
 微信小程序学习《二》：事件详解
10：oopsguy实战系列：博客地址：oopsguy - 博客园
 精品教程：微信小程序实战之知乎日报
 精品教程《二》：微信小程序实战之小豆瓣图书
11：TITF实用代码片段系列：博客地址：FutrueJet的博客
 TITF出品：微信小程序实用案例代码片段大全《一》
TITF出品：微信小程序实用案例代码片段大全《二》
TITF出品：微信小程序实用案例代码片段大全《三》
TITF出品：微信小程序实用案例代码片段大全《四》
TITF出品：微信小程序实用案例代码片段大全《五》：ES6新特性专辑 ...
TITF出品：微信小程序实用案例代码片段大全《六》
TITF出品：微信小程序实用案例代码片段大全《七》

四：demo合集；网络上的demo十分分散，我专门集中了大部分目前可以搜寻到的demo，方便大家查找，每个demo均提供了github地址，方便查看最新更新代码；
官方开发者工具导入demo教程
 微信小程序demo：万年历|日历
 微信小程序简单demo功能：增删
 微信小程序demo：快递查询（内含结构详解）
微信小程序优质demo推荐：微信挪车
 微信小程序优质demo推荐：像素鸟游戏
 微信小程序优质demo推荐：打飞机游戏

五：学习论坛，
1：很快社区：微信小程序,weixin,微信小程序开发：评价：新内容较少，老内容较丰富；
2：weapp：微信小程序开发论坛：内容较少，但有自己的原创；
3：微信小程序联盟：微信小程序社区：也就是我的论坛，内容目前最为丰富，但是缺乏原创；
4：青雀：青雀论坛_LarkApp_国内领先的小程序开发者社区：有自己的工具；