制作微信游戏小程序

一、制作微信游戏小程序

制作微信游戏小程序是当前移动互联网行业中备受关注的热点话题之一。随着移动互联网的普及和发展，微信游戏小程序作为一种全新的应用形式逐渐走进人们的生活，受到了广泛的欢迎和喜爱。如今，越来越多的企业和个人开始意识到微信游戏小程序的巨大商机，纷纷加入到制作微信游戏小程序的行列中。

微信游戏小程序的背景

随着移动互联网的快速发展，人们对于移动应用的需求越来越高。微信作为最大的社交软件之一，每天都有亿万用户在其中活跃，因此微信平台也成为许多开发者和企业竞相进入的场所。微信游戏小程序的推出，为开发者提供了一个全新的创作平台，不仅可以借助微信庞大的用户群体实现快速推广，还可以通过微信的社交属性增加用户的黏性和互动性。

制作微信游戏小程序具有诸多优势，包括免下载、随时随地使用、社交分享等特点，给用户带来了全新的使用体验。因此，越来越多的企业开始将目光转向微信游戏小程序，希望借助这一新兴的平台实现自身的业务突破和增长。

微信游戏小程序的制作流程

制作微信游戏小程序虽然有一定的技术门槛，但随着相关技术的不断成熟和发展，制作微信游戏小程序的流程变得越来越简单和便捷。一般而言，制作微信游戏小程序的流程可以分为以下几个步骤：

• 确定游戏类型和内容：首先需要明确所制作的微信游戏小程序的类型和内容，包括游戏风格、玩法规则等，这是制作的基础。
• 搭建开发环境：搭建微信小程序开发环境，包括安装相关的开发工具、注册小程序账号等。
• 编写代码：根据游戏的设计方案和功能需求，编写相应的代码实现游戏的各项功能。
• 测试调试：对制作好的微信游戏小程序进行测试和调试，确保运行稳定、流畅。
• 发布上线：完成测试后，将微信游戏小程序提交审核并发布上线，让用户可以体验到你的作品。

制作微信游戏小程序的关键技术

想要制作一款优秀的微信游戏小程序，除了熟悉制作流程外，对于一些关键技术也需要有所了解和掌握。下面是一些制作微信游戏小程序时常用到的关键技术：

• 微信小游戏开发框架：微信小游戏开发框架是支持开发者使用原生开发语言（如JavaScript）开发微信小游戏的一套开发工具和 API，具有丰富的组件和接口，便于开发者进行游戏开发和调试。
• 微信小程序云开发：微信小程序云开发是微信小程序的后端云服务，可以免去搭建服务器的繁琐过程，提供了强大的云端能力，包括数据库、存储、云函数等，帮助开发者快速开发应用。
• 微信开放能力：利用微信开放能力，可以实现微信登录、分享、支付等功能，提升用户体验和增加用户互动性。
• 游戏引擎：选择适合自己的游戏引擎，如Cocos Creator、Egret引擎等，可以更高效地实现游戏逻辑和界面效果。

微信游戏小程序的优化策略

为了提高微信游戏小程序的用户体验和推广效果，需要不断优化和改进。以下是一些提高微信游戏小程序质量的优化策略：

• 优化加载速度：通过压缩代码、减少图片大小等方式，提升微信游戏小程序的加载速度，让用户可以更快速地进入游戏。
• 精细化运营：根据用户数据和反馈，不断调整游戏内容和运营策略，提升用户留存和活跃度。
• 社交分享：加入社交分享功能，让用户可以分享游戏成绩和内容，扩大游戏传播范围。
• 活动促销：定期举办游戏活动和促销活动，提高用户参与度和留存率。

总结

制作微信游戏小程序是一项充满挑战和乐趣的工作，需要开发者不断学习和尝试，适应行业发展的变化。希望通过本文的介绍，读者们对于制作微信游戏小程序有了更深入的了解，能够在未来的创作中取得更好的成就。

二、游戏微信小程序制作

游戏微信小程序制作指南

微信小程序作为一种轻量级应用形式，日益受到用户青睐。在游戏行业中，开发和推广游戏微信小程序已成为一种新的趋势。为了帮助开发者更好地制作游戏微信小程序，本文将分享一些关键的制作指南和技巧。

1. 游戏微信小程序的特点

游戏微信小程序相比传统APP具有轻量级、无需下载安装、即点即玩等特点，能够快速吸引用户体验。同时，微信小程序拥有良好的社交传播属性，便于用户分享和传播，有利于游戏推广。

2. 游戏微信小程序制作步骤

制作游戏微信小程序的基本步骤包括：确定游戏类型、策划游戏内容、设计UI界面、开发程序代码、测试调试优化等。在制作过程中，开发者需要充分考虑用户体验和社交分享等因素。

3. 游戏微信小程序制作技巧

在制作游戏微信小程序时，开发者可以采用一些技巧来提升用户体验和游戏品质。比如优化游戏性能、设计精致的UI界面、添加社交互动功能、推出活动福利等，都能有效提升用户参与度和留存率。

4. 游戏微信小程序SEO优化

在制作游戏微信小程序的同时，开发者还需要注意SEO优化，以提升小程序在微信搜索中的排名和曝光度。关键词优化、页面内容质量、外链建设等都是提升SEO效果的重要手段。

5. 游戏微信小程序推广策略

为了让游戏微信小程序获得更多的用户和流量，开发者需要制定合适的推广策略。可以通过微信群分享、社交媒体宣传、线上活动合作等方式来扩大用户规模和提升品牌知名度。

6. 游戏微信小程序数据分析

游戏微信小程序制作完成后，开发者还需要进行数据分析，了解用户行为和反馈，以不断优化和改进小程序。通过数据分析，可以发现用户偏好、热门功能、留存情况等信息，指导后续运营工作。

总的来说，游戏微信小程序制作是一个技术与运营相结合的过程，需要开发者在技术实现的基础上注重用户体验和运营推广，方能取得成功。希望以上内容能够帮助正在制作游戏微信小程序的开发者更好地把握核心要点，取得更好的成绩。

三、如何制作微信小程序？

2017年微信小程序发布开始，我就开始接触和学习微信小程序，看着小程序不断的更新迭代，功能越来越丰富，在这过程中，开发过商城小程序、停车扫码计费小程序、工具打卡小程序、流量主小程序等等，现在也有自己盈利的产品，对于开发也有了一点点经验给大家。

小程序是一种新的开放能力，开发者可以快速地开发一个小程序。小程序可以在微信内被便捷地获取和传播，同时具有出色的使用体验。

作为一个过来人，从自己这么多年的开发经验和实战过程中，总结出一份小程序学习路线，可以说全网最详细也不为过，学习路线字数超4万字，但远远还没不够，只能当作是一个基础版本，之后我会不断丰富填充内容和知识点。

学习路线，不仅包含教你如何从零入门学习开发小程序，而且也从自己的经验中说说小程序如何运营，此外，还会涉及如何用小程序赚钱，拆解市场上成功的小程序案例，以及小程序如何结合AI来赚钱等等，小程序只是一种工具，如何利用小程序来为我们创造价值才是关键。

微信小程序学习路线总体大纲：

一.什么是小程序

二.学习路线特点

三.学习小程序前需要的基础知识

四.开发小程序前准备

五.小程序入门基础知识

六.小程序进阶知识

七.小程序常用框架

八.小程序常用插件

九.小程序开源源码

十.小程序运营

十一.小程序赚钱案例

十二.小程序流量主

温馨提示：可以根据自己的需求找相对应的类目，学习都要循序渐进。

一、小程序学习路线

这份学习路线并不完美，还在持续更新，与时俱进，与时代同行。

1.1什么是小程序？

微信小程序无需下载、触手可及、用完即走、无需卸载

1.2微信小程序的发展前景？

微信小程序功能已经非常丰富，基本满足我们业务需求使用，不管是个体还是企业都会考虑用小程序来解决自身业务需求，此外个人用小程序开发赚钱的也很多，也诞生了很多用户量级小程序，收益也非常可观。求职和开展副业，甚至自由职业也是必不可少的技能。

二、小程序学习路线特点

一份全面的小程序知识点大梳理和汇总

2.1分阶段学习

使用符合对知识点的重要程度做了区分，按需学习

2.2知识点附有描述和资源链接

提供大量优质学习资源

三、前言 – 学编程需要的特质

3.1定目标

拼命执行

不半途而废

3.2学小程序前需要的知识基础

描述：前端知识（Javascript、html、css）是小程序开发的基础，不需要你有多熟练，起码有了解，建议把小程序经常用到的知识点学好，再入门小程序会容易很多。

注意：现在很多课程都是以某一个框架教学，很少用到原生，这对于刚入门的我们来说并不好，一是我们不知道原生组件和语法，不利用我们了解小程序底层逻辑。二是学习框架也是需要成本，增加了学习的负担，可能把框架学完了，你的兴趣也降低了很多。

3.3前端资源：

阿里云前端实战学习：https://edu.aliyun.com/roadmap/frontend

W3Cschool 编程入门实战：https://www.w3cschool.cn/codecamp/

pink老师前端入门教程：https://www.bilibili.com/video/BV14J4114768

3.3.1小程序经常用到的前端知识点：

HTML

描述：用于定义一个网页结构的基本技术。

资源：https://developer.mozilla.org/zh-CN/docs/Learn/HTML

CSS

描述：层叠样式表，用于设计风格和布局。

资源：

弹性盒子布局flex：https://www.shuzhiduo.com/A/RnJWoL1BJq/

Javascript

描述：具有函数优先的轻量级，解释型或即时编译型的编程语言。

资源：回调函数 : https://www.bilibili.com/read/cv11101111/

3.4小程序官方资料

小程序注册接入 https://developers.weixin.qq.com/miniprogram/introduction/

官方工具 https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

官方文档<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/"> https://developers.weixin.qq.com/miniprogram/dev/framework/

运营规范 https://developers.weixin.qq.com/miniprogram/product/

开发社区<a href="https://developers.weixin.qq.com/community/develop/question"> https://developers.weixin.qq.com/community/develop/question

微信支付 https://pay.weixin.qq.com/wiki/doc/apiv3/wxpay/pages/index.shtml

客服消息<a href="https://developers.weixin.qq.com/miniprogram/introduction/custom.html"> https://developers.weixin.qq.com/miniprogram/introduction/custom.html

特殊行业所需资质资料 https://developers.weixin.qq.com/miniprogram/product/material/

we数据分析<a href="https://developers.weixin.qq.com/miniprogram/analysis/wedata/"> https://developers.weixin.qq.com/miniprogram/analysis/wedata/

3.5如何学习微信小程序

多看官方文档，多看几遍，遇到问题时再看

1.基础知识要过关，如：时间绑定、ajax请求、异步回调，搞清楚小程序外是怎么交换

2.通读一遍官方文档，看看都有哪些东西，都能干什么

3.多敲代码，看到例子、别人的demo下载下来运行，看原理和结构

4.多写多看、熟能手巧

四、开发前必读

1.开发前需要了解禁止类目和资质，看一下运营规范

2.微信小程序需要https请求，需要准备备案域名：由于备案需要一定时间，要事先准备

3.SSL证书准备

4.服务器

五、小程序学习阶段

5.1开发工具和教程资料

微信开发者工具（推荐） https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

HBuilder X https://www.dcloud.io/hbuilderx.html

小程序入门资源

小程序开发起步（官方视频教程）https://developers.weixin.qq.com/community/business/course/000264e20a0dd8e69669b609451c0d

小程序基础开发之架构、框架、组件（官方视频教程）https://developers.weixin.qq.com/community/business/course/000ca4b0990a9087193d27b905780d

微信开发者工具系列课程（官方视频教程）https://developers.weixin.qq.com/community/business/course/000884131701789a46acb81f85140d

5.2小程序环境搭建与开发工具介绍

5.2.1了解什么是微信小程序，下载必要的软件工具和基础准备

5.2.2注册小程序账号，获取appid与appscret

5.2.3安装微信开发者工具

5.2.4程序的开发体验

5.3基本目录结构与文件作用

开发者工具的使用

创建项目

了解小程序整体目录结构

项目设置

主体文件

页面文件

其他文件

配置文件详解

主配置文件app.json

页面配置文件

WXML模板

WXSS样式

逻辑层js文件

css样式

class选择器

页面样式文件wxss

尺寸单位

样式导入

5.4小程序常用基础组件

罗列的知识要点都是我们经常会用到，从实战中总结出来的。熟悉了这些知识点，开发小程序基本不成问题。

view组件

input组件

button组件

slider组件

form组件

radio组件

checkbox 组件

picker组件

swiper组件

image 组件

icon图标

switch组件

video组件

5.5小程序语法

函数

函数创建

带参合不带参函数的区别

变量

变量的使用和初始化

变量重新赋值

变量命名规范

全局变量和局部变量

5.6数据绑定和渲染

简单双向绑定

事件类型

事件绑定

事件对象

流程控制

条件语句 if 和 else

循环语句 for

条件渲染

列表渲染

5.7微信小程序的交互反馈

认识loading组件

用toast显示提示信息

显示loading提示信息

wx.canIUse 判断当前版本是否可用

wx.getWindowInfo() 获取窗口信息

wx.updateWeChatApp() 更新客户端版本

wx.swtitchTab()路由 跳转到 tabBar 页面

wx.redirectTo() 关闭当前页面，跳转到应用内的某个页面

wx.navigateTo() 保留当前页面，跳转到应用内的某个页面

wx.navigateToMiniProgram() 打开另一个小程序

wx.showShareMenu() 显示当前页面的转发按钮

wx.onCopyUrl() 复制

wx.showToast() 消息提示框

wx.startPullDownRefresh() 下拉刷新

wx.pageScrollTo() 滚动

wx.chooseImage()图片功能

wx.chooseMedia()视频功能

富文本

收货地址 wx.chooseAddress()

wx.setClipboardData()剪切板

拨打电话 wx.makePhoneCall()

扫码 wx.scanCode()

5.8缓存机制和异步交互

生成本地缓存数据

从本地缓存读取数据

获取本地缓存数据

保存多条历史记录

使用数组保存多条历史记录

清理本地缓存

5.9应用弹性盒子布局

传统布局的实现方式

弹性盒子布局

弹性盒子布局的优点

如何让元素大小适配不同宽度屏幕

六、小程序进阶

6.1资源

小程序基础能力介绍（官方视频教程）https://developers.weixin.qq.com/community/business/course/000a62c2a00cb03d0a8e5375c5b00d

小程序开发新能力解读（官方）https://developers.weixin.qq.com/community/business/course/0004ca93454498f68aac5faa25b80d

6.2常用知识要点

认识wx.request接口函数

wx.request() 发起 HTTPS 网络请求

wx.downloadFile() 下载文件资源到本地

wx.uploadFile() 将本地资源上传到服务器

wx.requestPayment() 发起微信支付

用户授权登录

6.3小程序高级

资源

小程序性能优化实践（官方视频教程）基于实际开发场景，由资深开发者分享小程序性能优化的各项能力及应用实践，提升小程序性能表现

https://developers.weixin.qq.com/community/business/course/000606628dc2e86dc0ddcbb115940d

要点

小程序原理及框架剖析 https://segmentfault.com/a/1190000038836580

浅析微信小程序的底层架构原理<a href="http://t.zoukankan.com/goloving-p-14663950.html"> http://t.zoukankan.com/goloving-p-14663950.html

【小程序】图解小程序平台架构及其特征与应用机制 https://blog.csdn.net/ImagineCode/article/details/125360895

微信小程序「官方示例代码」浅析【上】 微信小程序「官方示例代码」浅析【上】 - 知乎

微信小程序「官方示例代码」剖析【下】：运行机制 微信小程序「官方示例代码」剖析【下】：运行机制 - 知乎

「微信小程序」剖析（二）：框架原理 | 在浏览器上运行的猜想 「微信小程序」剖析（二）：框架原理 | 在浏览器上运行的猜想 - 知乎

为什么我们需要一个兼容「微信小程序」的Web框架？ 为什么我们需要一个兼容「微信小程序」的Web框架？ - 知乎

让你的「微信小程序」运行在Chrome浏览器上，让我们使用WebStorm 让你的「微信小程序」运行在Chrome浏览器上，让我们使用WebStorm - 知乎

「微信小程序」剖析（四）：原生的实时DOM转Virtual DOM 「微信小程序」剖析（四）：原生的实时DOM转Virtual DOM - 知乎

这【五篇】文章将带你深入了解「微信小程序」 这【五篇】文章将带你深入了解「微信小程序」 - 知乎

近两万字小程序攻略发布了 https://juejin.cn/post/6844903670589423623

【微信小程序】性能优化 https://juejin.cn/post/6844903638226173965

七、小程序常用框架

工具

基于Vue

uni-app ☆37.6k 使用 Vue 语法开发小程序、H5、App的统一框架 https://github.com/dcloudio/uni-app

mpvue ☆20.4k 基于 Vue.js 的小程序开发框架，从底层支持 Vue.js 语法和构建工具体系 https://github.com/Meituan-Dianping/mpvue

megalo ☆1.6k 基于 Vue 的小程序开发框架 https://github.com/kaola-fed/megalo

Okam 使用类 Vue 方式开发小程序的渐进增强框架，支持生成微信/百度等主流平台的小程序 https://github.com/ecomfe/okam

rubic – 基于 Vue3 的小程序开发框架，在小程序中使用 Composition API https://github.com/jaskang/rubic

基于React

Taro ☆32.2k 使用 React 的方式开发小程序的框架，同时支持生成多端应用 https://github.com/NervJS/taro

Remax ☆4.5k 使用真正的 React 构建小程序<a href="https://github.com/remaxjs/remax"> https://github.com/remaxjs/remax

基于Gulp

WeApp-Workflow ☆100+ – 基于 Gulp 的微信小程序前端开发工作流 https://github.com/Jeff2Ma/WeApp-Workflow

gulp-wxapp-boilerplate – 小程序+小程序云 Gulp 开发脚手架，支持云函数 mock https://github.com/ksky521/gulp-wxapp-boilerplate

weapp-gulp – Gulp高效构建微信小程序，让开发变得更简单 https://github.com/sunnie1992/weapp-gulp

基于node

wcc.js – wcc.js 是wxml文件和wxs文件编译器的nodejs实现 https://github.com/caijw/wcc.js

wcsc.js – wcsc.js 是wxss文件编译器的nodejs实现 https://github.com/caijw/wcsc.js

其它

WePY ☆22k 支持组件化的小程序开发框架 https://github.com/Tencent/wepy

chameleon ☆9k 一套代码运行多端，一端所见即多端所见<a href="https://github.com/didi/chameleon"> https://github.com/didi/chameleon

kbone Web ☆4.5k 与小程序同构解决方案 https://github.com/Tencent/kbone

wept ☆2.8k 微信小程序实时运行环境 https://github.com/wetools/wept

wechat_web_devtools ☆2.7k Linux 下微信开发者工具 https://github.com/cytle/wechat_web_devtools

wafer ☆2.2k 快速构建具备弹性能力的微信小程序 https://github.com/tencentyun/wafer

MPX ☆3.2k 增强型小程序框架，深度性能优化，支持跨小程序平台开发，完全兼容原生小程序组件 https://github.com/didi/mpx

Labrador ☆1.7k 支持 ES6/7 的微信小程序组件化开发框架 https://github.com/maichong/labrador

licia ☆2.1k 支持小程序的 JS 工具库 https://github.com/liriliri/licia

CloudBase Framework ☆1.9k腾讯云开发开源一键部署工具，支持部署小程序及云开发应用 https://github.com/Tencent/cloudbase-framework

tina ☆1.3k 轻巧的渐进式微信小程序框架 https://github.com/tinajs/tina

minapp ☆927 – TypeScript 版小程序开发框架（兼容原生小程序代码） https://github.com/qiu8310/minapp

xpmjs ☆100+ – 微信小程序云端增强 SDK https://github.com/xpmjs/xpmjs

weapp-tailwindcss-webpack-plugin ☆100+ 在小程序里使用 TailwindCSS 吧 https://github.com/sonofmagic/weapp-tailwindcss-webpack-plugin

weact 用 JSX 快速开发小程序 https://github.com/haojy/weact

socket.io-mp-client 微信小程序 http://socket.io 客户端 https://github.com/cytle/socket.io-mp-client

@wxa AOP小程序开发框架 https://wxajs.github.io/wxa/

wxml-parser – JavaScript WXML parser https://github.com/seanlong/wxml-parser

weappx – 基于 redux 的数据层管理框架 https://github.com/tolerance-go/weappx

weapp-start – 基于插件机制的开发脚手架，改善原生小程序开发体验 https://github.com/tolerance-go/weapp-start

Egret Wing – 支持微信小程序实时预览的 IDE http://developer.egret.com/cn/github/egret-docs/Wing/update/update320/index.html

wxapp-graphql – 小程序 GraphQL 客户端 https://github.com/Authing/wxapp-graphql

wenaox – 小程序数据层管理 ，轻量性能好，支持中间件<a href="https://github.com/cnyballk/wenaox"> https://github.com/cnyballk/wenaox

cheers-mp – Almost零配置微信原生小程序脚手架，vue-cli般的体验~(ts、less、原生npm、云OSS、CI自动发布体验版) https://github.com/bigmeow/cheers-mp

we-mobx – 在微信小程序中使用 MobX https://github.com/cicec/we-mobx

weconsole – 功能全面、界面与体验对标 Chrome devtools 的可定制化的小程序开发调试面板 https://github.com/weimobGroup/WeConsole

px 转 rpx 插件

postcss-pxtorpx-pro – postcss px 转 rpx 插件 https://github.com/Genuifx/postcss-pxtorpx-pro

px2rpx – Px 转 Rpx 在线工具 https://github.com/allanguys/px2rpx

八、小程序常用插件

wxapp.vim – 提供微信小程序开发全方位支持的 vim 插件 https://github.com/chemzqm/wxapp.vim

Matchmaker – IntelliJ IDEA 插件，注入方法 https://github.com/lypeer/Matchmaker

wechatCode-complete – webstorm 插件（代码提示） https://github.com/qbright/wechatCode-complete

wxapp – sublime plugin https://github.com/FloydaGithub/wxapp

minapp – vscode 插件（支持 原生/mpvue/wepy 框架） https://github.com/qiu8310/minapp/blob/master/packages/minapp-vscode/README.md

vscode-live-sass-compiler – vscode插件根据.scss文件自动生成wxss文件 https://github.com/ritwickdey/vscode-live-sass-compiler

WePY Plugin For IntelliJ Platform – 让PhpStorm/WebStorm全面支持WePY的开发，包括API(原生/WePY)和组件(官方/自定义)的自动完成/错误检查/高亮/不依赖Vue/… http://wepy.iniself.com/

wxml – vscode插件–微信小程序格式化以及高亮组件(高度自定义) https://github.com/cnyballk/wxml-vscode

wux-weapp-snippets – Wux Weapp Snippets for VS Code. https://github.com/wux-weapp/wux-weapp-snippets

wux-weapp-atom-snippets – Wux Weapp Snippets for Atom. https://github.com/wux-weapp/wux-weapp-atom-snippets

wux-weapp-sublime-snippets – Wux Weapp Snippets Plugin for Sublime Text 2/3. https://github.com/wux-weapp/wux-weapp-sublime-snippets

组件

UI组件库

weui-wxss ☆12.4K+ – 同微信原生视觉体验一致的基础样式库 https://github.com/Tencent/weui-wxss

vant-weapp ☆12.3k+ – 高颜值、好用、易扩展的微信小程序 UI 库 https://github.com/youzan/vant-weapp

iview-weapp ☆5.5k+ – 一套高质量的微信小程序 UI 组件库 https://github.com/TalkingData/iview-weapp

wux-weapp ☆4.2k+ – 一套组件化、可复用、易扩展的微信小程序 UI 组件库<a href="https://github.com/wux-weapp/wux-weapp"> https://github.com/wux-weapp/wux-weapp

Lin UI ☆2k+ – 一套设计优良、基于原生微信小程序语法的 UI 组件库<a href="https://github.com/TaleLin/lin-ui"> https://github.com/TaleLin/lin-ui

Wa-UI ☆200+ – 针对微信小程序整合的一套 UI 库<a href="https://github.com/liujians/Wa-UI"> https://github.com/liujians/Wa-UI

wuss-weapp – 一款高质量，组件齐全，高自定义的微信小程序UI组件库 https://github.com/phonycode/wuss-weapp

日历

wx_calendar ☆300+ – 小程序日历 https://github.com/treadpit/wx_calendar

miniprogram-datepicker – 小程序日期选择器（支持农历） https://github.com/pithyone/miniprogram-datepicker

mpvue-calendar – 微信小程序/浏览器端的日历组件mpvue-calendar；基于mpvue平台 支持农历、按周切换、可自定义。 https://github.com/Hzy0913/mpvue-calendar

富文本

wxParse ☆7.2K+ – 微信小程序富文本解析自定义组件，支持 HTML 及 markdown 解析 https://github.com/icindy/wxParse

mp-html ☆1.4K+ – 小程序富文本组件，支持渲染和编辑 html，支持在微信、QQ、百度、支付宝、头条和 uni-app 平台使用<a href="https://github.com/jin-yufeng/mp-html"> https://github.com/jin-yufeng/mp-html

滑动

wx-scrollable-tab-view ☆200+ – 小程序可滑动得 tab-view https://github.com/zhongjie-chen/wx-scrollable-tab-view

wx-alphabetical-listview ☆100+ – 微信小程序带字母滑动的 listview https://github.com/zhongjie-chen/wx-alphabetical-listview

wx-drawer ☆100+ – 小程序模仿 QQ6.0 侧滑菜单 https://github.com/zhongjie-chen/wx-drawer

we-swiper ☆100+ – 微信小程序触摸内容滑动解决方案 we-swiper ☆100+ – 微信小程序触摸内容滑动解决方案

侧滑布局 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E4%BE%A7%E6%BB%91%E5%B8%83%E5%B1%80/weapp-slider-master

图表

wx-charts ☆4.1k+ – 微信小程序图表 charts 组件 https://github.com/xiaolin3303/wx-charts

wxapp-charts ☆100+ – 微信小程序图表 charts 组件 https://github.com/hawx1993/wxapp-charts

chartjs-wechat-mini-app ☆100+ – chartjs 微信小程序适配 https://github.com/xiabingwu/chartjs-wechat-mini-app

wepy-com-charts – 微信小程序 wepy 图表控件<a href="https://github.com/CalvinHong/wepy-com-charts"> https://github.com/CalvinHong/wepy-com-charts

anka-tracker – 小程序打点库，用于统计用户行为数据<a href="https://github.com/iException/anka-tracker"> https://github.com/iException/anka-tracker

图片

image-cropper ☆900+ –

微信小程序图片裁剪组件 https://github.com/1977474741/image-cropper

wxapp-img-loader ☆400+ – 微信小程序图片预加载组件<a href="https://github.com/o2team/wxapp-img-loader"> https://github.com/o2team/wxapp-img-loader

we-cropper ☆400+ – 微信小程序图片裁剪工具 https://github.com/we-plugin/we-cropper

xing-weapp-editor – 小程序图文编辑组件<a href="https://github.com/ianho/xing-weapp-editor"> https://github.com/ianho/xing-weapp-editor

图片自适应 ，富文本解析<a href="https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%9B%BE%E7%89%87%E8%87%AA%E9%80%82%E5%BA%94%20%EF%BC%8C%E5%AF%8C%E6%96%87%E6%9C%AC%E8%A7%A3%E6%9E%90/wxapp-master"> https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%9B%BE%E7%89%87%E8%87%AA%E9%80%82%E5%BA%94%20%EF%BC%8C%E5%AF%8C%E6%96%87%E6%9C%AC%E8%A7%A3%E6%9E%90/wxapp-master

Canvas

wxa-plugin-canvas ☆300+ – 微信小程序朋友圈海报生成组件 https://github.com/jasondu/wxa-plugin-canvas

WeZRender ☆300+ – 微信小程序 Canvas 开发<a href="https://github.com/guyoung/WeZRender"> https://github.com/guyoung/WeZRender

mp_canvas_drawer – canvas绘制图片助手，一个json就制作分享朋友圈图片 https://github.com/kuckboy1994/mp_canvas_drawer

anka-brush – 一款为简化小程序里canvas画图操作而创建的工具库 https://github.com/iException/anka-brush

组件功能

WeiXinProject – 微信小程序列表上拉刷新和上拉加载 https://github.com/lidong1665/WeiXinProject

wxapp ☆300+ – 微信小程序功能组件 https://github.com/youzouzou/wxapp

wetoast ☆100+ – 微信小程序 toast 增强插件 https://github.com/kiinlam/wetoast

wxSearch ☆200+ – 微信小程序优雅的搜索框 https://github.com/icindy/wxSearch

citySelect ☆100+ – 微信小程序城市选择器 https://github.com/chenjinxinlove/citySelect

xing-weapp-component – 微信小程序基础组件扩展<a href="https://github.com/ianho/xing-weapp-component"> https://github.com/ianho/xing-weapp-component

wx-statuslayout – 小程序页面状态切换组件 https://github.com/ZzjBeatYou/wx-statuslayout

minapp-slider-left – 微信小程序左划删除组件 https://github.com/bigmeow/minapp-slider-left

mp-swipe-card – 小程序卡片滑动组件,类似探探的效果，貌似现在只支持左右滑动 https://github.com/qizf7/mp-swipe-card

we-validator – 简单灵活的表单验证插件，支持小程序、浏览器以及Nodejs端使用。https://github.com/ChanceYu/we-validator

wx-pulltorefresh-view – 简单灵活的下拉上拉刷新组件，支持微信小程序 https://github.com/zhongxuqi/wx-pulltorefresh-view

weapp-input-frame – 微信小程序验证码输入框组件 https://github.com/xjh22222228/weapp-input-frame

地图定位 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9C%B0%E5%9B%BE%E5%AE%9A%E4%BD%8D/wechat-weapp-mapdemo-master

瀑布流布局 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E7%80%91%E5%B8%83%E6%B5%81%E5%B8%83%E5%B1%80/WxMasonry-master

小程序读取excel数据 https://github.com/qiushi123/xiaochengxu_demos/tree/master/190729%E5%B0%8F%E7%A8%8B%E5%BA%8F%E8%A1%A8%E6%A0%BC

手机验证码登录 https://github.com/qiushi123/xiaochengxu_demos/tree/master/190907%E6%89%8B%E6%9C%BA%E9%AA%8C%E8%AF%81%E7%A0%81%E7%99%BB%E5%BD%95

小程序二维码 https://github.com/qiushi123/xiaochengxu_demos/tree/master/191011%E5%B0%8F%E7%A8%8B%E5%BA%8F%E4%BA%8C%E7%BB%B4%E7%A0%81

2D/3D

wxDraw ☆100+ – 微信小程序 2D 动画库 https://github.com/bobiscool/wxDraw

API、Promise

weapp-polyfill – [w3c 标准 API polyfill https://github.com/leancloud/weapp-polyfill

wx-promise-pro ☆666+ – 微信小程序 Promise 库<a href="https://github.com/youngjuning/wx-promise-pro"> https://github.com/youngjuning/wx-promise-pro

minapp-api-promise – 微信小程序所有 API promise 化<a href="https://github.com/bigmeow/minapp-api-promise"> https://github.com/bigmeow/minapp-api-promise

wx-api-promisify – 优雅地将微信小程序API Promise化 https://github.com/vv13/wx-api-promisify

weapp.request – 为微信小程序提供的网络请求组件，是 wx.request 的扩展，基于 Promise API，添加缓存控制。<a href="https://github.com/afishhhhh/weapp.request"> https://github.com/afishhhhh/weapp.request

miniprogram-network – Redefine the Network API of MiniProgram(小程序网络请求库) https://github.com/NewFuture/miniprogram-network

其它

wemark ☆1.100+ – 微信小程序 Markdown 渲染库 https://github.com/TooBug/wemark

wx-promise-request ☆100+ – 微信小程序请求队列管理库 https://github.com/JoeZheng2015/wx-promise-request

weapp-cookie ☆100+ – 一行代码让微信小程序支持 cookie

https://github.com/charleslo1/weapp-cookie

wxapp-lock – 微信小程序手势解锁 https://github.com/demi520/wxapp-lock

http://weapp.socket.io ☆500+ – http://socket.io 风格的 websocket 类库<a href="https://github.com/weapp-socketio/weapp.shttp://ocket.io"> https://github.com/weapp-socketio/weapp.socket.io

wxMD5 – 微信小程序 MD5 库 https://github.com/youngjuning/wxMD5

wxBase64 – 微信小程序base64 库<a href="https://github.com/youngjuning/wxBase64"> https://github.com/youngjuning/wxBase64

cue – A WX Compontent Tools https://github.com/WARJY/cue

sol-weapp ☆300+ -微信小程序营销组件:红包雨、大转盘等营销组件 https://github.com/sunniejs/sol-weapp/

we-debug – 一款灵活、易于拓展的微信小程序调试工具 https://github.com/dlhandsome/we-debug

weapp-qrcode – 微信小程序生成二维码工具 https://github.com/tomfriwel/weapp-qrcode

cheers-mp-router –

精巧强大的小程序原生路由 https://github.com/bigmeow/cheers-mp-router

wx-updata – 微信小程序官方 setData 替代品，只修改 data 中你希望修改的部分

https://github.com/SHERlocked93/wx-updata

three-platformize – 一个让 THREE 平台化的项目，已适配微信、淘宝、头条小程序 https://github.com/deepkolos/three-platformize

九、小程序开源源码（按类目分）

可直接运行成功

物流

教育

在线答题小程序 https://gitee.com/xiaofeiyang3369/myexamapp?_from=gitee_search

答题小程序 https://gitee.com/kesixin/QuestionWechatApp?_from=gitee_search

答题考试小程序 https://gitee.com/wulivicor/exam?_from=gitee_search

在线考试小程序 https://gitee.com/dabenbenyihao/online-test-applet?_from=gitee_search

答题小程序<a href="https://gitee.com/423555593/datixiaochengxu?_from=gitee_search#%E4%BD%BF%E7%94%A8%E8%AF%B4%E6%98%8E"> https://gitee.com/423555593/datixiaochengxu?_from=gitee_search#%E4%BD%BF%E7%94%A8%E8%AF%B4%E6%98%8E

交通

租车小程序前端 https://gitee.com/shanwei_city_da_shu_network/zuchemini?_from=gitee_search#%E4%BD%BF%E7%94%A8%E8%AF%B4%E6%98%8E

停车场系统小程序 https://gitee.com/wangdefu/parking_system_applet?_from=gitee_search

房地产

租房小程序 https://gitee.com/open-source-byte/house?_from=gitee_search

租房微信小程序-带管理员后台<a href="https://gitee.com/LiangSenCheng/house?_from=gitee_search"> https://gitee.com/LiangSenCheng/house?_from=gitee_search

宿舍报修助手<a href="https://gitee.com/aYuan-git/wechat-dorm-miniprogram?_from=gitee_search"> https://gitee.com/aYuan-git/wechat-dorm-miniprogram?_from=gitee_search

生活

校园综合服务平台小程序 https://gitee.com/yaozy717/hbhzdtn?_from=gitee_search

微信报修小程序 https://gitee.com/cxyax/WeChatComputer-roomMaintenance?_from=gitee_search

垃圾分类小程序 https://gitee.com/joelingwei/rubbish?_from=gitee_search

CC智慧物业小程序 https://gitee.com/voice-of-xiaozhuang/SmartPrroperty?_from=gitee_search

市民政务服务预约小程序<a href="https://gitee.com/ht-jenny/CityAppt?_from=gitee_search"> https://gitee.com/ht-jenny/CityAppt?_from=gitee_search

HC智慧家园小程序<a href="https://gitee.com/java110/WechatOwnerService?_from=gitee_search"> https://gitee.com/java110/WechatOwnerService?_from=gitee_search

口腔医院预约平台小程序 https://gitee.com/zmn_repository/wx_dental_hospital?_from=gitee_search

家政服务小程序 https://gitee.com/chun-hui-gao2022/familymini?_from=gitee_search

物资预约领取小程序 https://gitee.com/crystar/tcb-hackthon-mask?_from=gitee_search

美容机构预约小程序<a href="https://gitee.com/naive2021/smartbeauty?_from=gitee_search"> https://gitee.com/naive2021/smartbeauty?_from=gitee_search

IT科技

餐饮

餐厅订座小程序 https://gitee.com/wind-pheasant-zere/GoodFoodAppt?_from=gitee_search

文娱

婚姻登记中心小程序<a href="https://gitee.com/wang-xiaocao/SunMarry?_from=gitee_search"> https://gitee.com/wang-xiaocao/SunMarry?_from=gitee_search

旅游景区门户小程序<a href="https://gitee.com/voice-of-xiaozhuang/WeTravel?_from=gitee_search"> https://gitee.com/voice-of-xiaozhuang/WeTravel?_from=gitee_search

口袋吉他 https://gitee.com/alex1504/wx-guita_tab-public?_from=gitee_search

工具

wyq2214368/remove-water-mark-mp –

短视频去水印小程序（含服务端）https://github.com/wyq2214368/remove-water-mark-mp

xtanyu/parsing-mini – 短视频去水印小程序（含Java版本服务端） https://github.com/xtanyu/parsing-mini

realyao/Focus-clock ★100+ –

时间管理小程序：专注时钟（集成时间管理、目标计划、Todo待办、白噪声。易部署 适合新手学习入门）https://github.com/realyao/WXminiprogram-Focus-clock

小程序爱乐查 https://gitee.com/dave_hai/XiaoChengXuAiLeCha?_from=gitee_search

贴身管家小程序版 https://gitee.com/nmgwap/TieShenGuanJia-WeiXinXiaoChengXuBan?_from=gitee_search

婚礼请柬小程序 https://gitee.com/zijun2030/hun-jian?_from=gitee_search

驾校预约小程序<a href="https://gitee.com/cai-jianya111/drivermini?_from=gitee_search"> https://gitee.com/cai-jianya111/drivermini?_from=gitee_search

活动报名小程序 https://gitee.com/minzonetech/CCSmartMeet?_from=gitee_search

花栗鼠关爱小姨妈（小程序）<a href="https://gitee.com/hualishu910/Period_Diary?_from=gitee_search"> https://gitee.com/hualishu910/Period_Diary?_from=gitee_search

电商

基于vue、element ui 的轻量级、前后端分离、拥有完整sku和下单流程的完全开源商城 小程序端 https://gitee.com/gz-yami/mall4m?_from=gitee_search

社交

imageslr/taro-library ★150+ – Taro + Redux + 本地 Mock Server 小程序示例项目 https://github.com/imageslr/taro-library

校友会小程序 https://gitee.com/minzonetech/CCSmartTXL?_from=gitee_search

体育

运动场馆预约小程序 https://gitee.com/voice-of-xiaozhuang/sportmini?_from=gitee_search

健身预约小程序<a href="https://gitee.com/yupsh/fitness-reservation?_from=gitee_search"> https://gitee.com/yupsh/fitness-reservation?_from=gitee_search

汽车

资讯

RebeccaHanjw/weapp-wechat-zhihu ★800+ – 仿知乎<a href="https://github.com/RebeccaHanjw/weapp-wechat-zhihu"> https://github.com/RebeccaHanjw/weapp-wechat-zhihu

imageslr/weapp-library ★500+ – 在线借书平台（30+页面/组件化/Mock Server/云开发） https://github.com/imageslr/weapp-library

微慕WordpPress小程序开源版 前端<a href="https://github.com/iamxjb/winxin-app-watch-http://life.net"> https://github.com/iamxjb/winxin-app-watch-life.net

大白鲸旅游攻略-小程序 https://gitee.com/ckjcode/big-white-whale-travel-guide?_from=gitee_search

追格资讯小程序开源版 https://gitee.com/zhuige_com/jiangqie_kafei?_from=gitee_search

豆瓣类影视查询记录小程序 https://gitee.com/x1299906945/Mark?_from=gitee_search

高仿Readhub小程序 https://gitee.com/richard1015/News?_from=gitee_search

其它

deepkolos/three-platformize-demo-wechat – 微信小程序 THREE 包含16个loader测试demo https://github.com/deepkolos/three-platformize-demo-wechat

deepkolos/wxmp-tensorflow – 微信小程序下运行最新TensorFlowJS的解决方案 https://github.com/deepkolos/wxmp-tensorflow

只有前端，后端源码不完整

物流

教育

We重邮<a href="https://github.com/Data-Camp/WeApp_Demos/tree/master/%E9%87%8D%E9%82%AE/wecqupt-master"> https://github.com/Data-Camp/WeApp_Demos/tree/master/%E9%87%8D%E9%82%AE/wecqupt-master

交通

ofo小程序 https://github.com/MiceLiD/ofo-applet

卡卡汽车 获取用户 设备信息<a href="https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%8D%A1%E5%8D%A1%E6%B1%BD%E8%BD%A6%20%E8%8E%B7%E5%8F%96%E7%94%A8%E6%88%B7%20%E8%AE%BE%E5%A4%87%E4%BF%A1%E6%81%AF/wx_Applet-master"> https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%8D%A1%E5%8D%A1%E6%B1%BD%E8%BD%A6%20%E8%8E%B7%E5%8F%96%E7%94%A8%E6%88%B7%20%E8%AE%BE%E5%A4%87%E4%BF%A1%E6%81%AF/wx_Applet-master

滴滴公交-查公交 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E6%BB%B4%E6%BB%B4%E5%85%AC%E4%BA%A4-%E6%9F%A5%E5%85%AC%E4%BA%A4/weapp-gj-master

车源宝 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%BD%A6%E6%BA%90%E5%AE%9D/weapp-cheyuanbao-master

房地产

生活

垃圾分类小程序 https://github.com/qi19901212/Garbage

跑步小程序<a href="https://github.com/alanwangmodify/weChatApp-Run"> https://github.com/alanwangmodify/weChatApp-Run

IT科技

餐饮

餐饮点餐商城<a href="https://github.com/woniudiancang/bee"> https://github.com/woniudiancang/bee

星巴克中国 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E6%98%9F%E5%B7%B4%E5%85%8B%E4%B8%AD%E5%9B%BD/starbucks-master

餐饮点餐商城 https://github.com/woniudiancang/bee

文娱

weapp-film – 淘票票 https://github.com/luuman/weapp-film

lsqy/taro-music –

基于taro + taro-ui + redux + typescript 开发的网易云音乐小程序 https://github.com/lsqy/taro-music

仿喜马拉雅lite – 微信小程序原生开发的仿喜马拉雅小程序（极度适合新手入门） https://github.com/Notobey/Himalayan-lite

工具

wangmingjob/weapp-weipiao ★300+ – 微票 https://github.com/wangmingjob/weapp-weipiao

harveyqing/BearDiary ★200+ – 小熊の日记<a href="https://github.com/harveyqing/BearDiary"> https://github.com/harveyqing/BearDiary

leancloud/leantodo-weapp ★200+ – 集成 LeanCloud 实现的 Todo list https://github.com/leancloud/leantodo-weapp

kraaas/timer ★100+ – 番茄时钟<a href="https://github.com/kraaas/timer"> https://github.com/kraaas/timer

dunizb/wxapp-sCalc ★100+ – 简易计算器<a href="https://github.com/dunizb/wxapp-sCalc"> https://github.com/dunizb/wxapp-sCalc

litt1e-p/weapp-girls ★100+ – 豆瓣美女/妹子图<a href="https://github.com/litt1e-p/weapp-girls"> https://github.com/litt1e-p/weapp-girls

liumulin614/BeautifulGirl – 美女模特 https://github.com/liumulin614/BeautifulGirl

vace/wechatapp-news-reader ★100+ – 新闻阅读器 https://github.com/vace/wechatapp-news-reader

DengKe1994/weapp-calculator – IOS 计算器<a href="https://github.com/DengKe1994/weapp-calculator"> https://github.com/DengKe1994/weapp-calculator

monkindey/wx-github – GitHub 简历<a href="https://github.com/monkindey/wx-github"> https://github.com/monkindey/wx-github

fluency03/weapp-500px – 国外摄影社区 500px<a href="https://github.com/fluency03/weapp-500px"> https://github.com/fluency03/weapp-500px

xujinyang/CoderCalendar-WeApp – 程序员老黄历<a href="https://github.com/xujinyang/CoderCalendar-WeApp"> https://github.com/xujinyang/CoderCalendar-WeApp

brucevanfdm/WeChatMeiZhi – 妹子图 https://github.com/brucevanfdm/WeChatMeiZhi

zce/weapp-todos – TODOS 任务清单 https://github.com/zce/weapp-todos

arkilis/weapp-jandan – 煎蛋 https://github.com/arkilis/weapp-jandan

bodekjan/wechat-weather – 微信天气 https://github.com/bodekjan/wechat-weather

jasscia/ChristmasHat – 我要圣诞帽 https://github.com/jasscia/ChristmasHat

nanwangjkl/sliding_puzzle – 滑块拼图 https://github.com/nanwangjkl/sliding_puzzle

w1109790800/We-Todo – 基于LeanCloud的Todo-List<a href="https://github.com/w1109790800/We-Todo"> https://github.com/w1109790800/We-Todo

lonnng/etym – 芒果词源助手 https://github.com/lonnng/etym

wuhou123/wxxcx – 武侯的猫，基于wepy构建,整合了n多查询工具（快递，天气，记账，搞笑视频等）<a href="https://github.com/wuhou123/wxxcx"> https://github.com/wuhou123/wxxcx

upupming/HITMers – 博物馆小助手（统计值班表、签到、值班日历及备忘录、国际化、http://Streamable.com 视频上传等）https://github.com/upupming/HITMers

WarpPrism/SubwayRoutineMP – 【东京首尔曼谷新加坡巴黎地铁线路图

】https://github.com/WarpPrism/SubwayRoutineMP

GoKu-gaga/today – 口袋工具（一个小工具的集合）https://github.com/GoKu-gaga/today

cy920820/weapp-motor-movies – 马达电影助手（一个院线电影小助手） https://github.com/cy920820/weapp-motor-movies

Gwokhov/chronus – Chronus 目标日记（一款能帮助你管理生活目标的云开发微信小程序）https://github.com/Gwokhov/chronus

imliubo/Wechat_MQTT_ESP8266_BaiduIoT – 微信智能小管家 (使用微信小程序控制你的硬件设备) https://github.com/imliubo/Wechat_MQTT_ESP8266_BaiduIoT

ZhuPeng/mp-githubtrending – 以 Feed 流形式查看 GitHub Trending 仓库集合的工具 https://github.com/ZhuPeng/mp-githubtrending

yociduo/scrum-planning-poker – Scrum敏捷估算,基于wepy构建 https://github.com/yociduo/scrum-planning-poker

branliang/game-stop-app – PSN降价了（一个可以订阅PS4游戏价格的工具）https://github.com/BranLiang/game-stop-app

wk989898/wxchat-mail – 仿Gmail邮箱的微信小程序 https://github.com/wk989898/wxchat-mail

arleyGuoLei/wechat-1password –

有本密码，云开发实现的AES加密密码本，支持指纹、人脸，UI简约大方<a href="https://github.com/arleyGuoLei/wechat-1password"> https://github.com/arleyGuoLei/wechat-1password

wilhantian/periodic-table –

精致的元素周期表小程序<a href="https://github.com/wilhantian/periodic-table"> https://github.com/wilhantian/periodic-table

terryso/super9 –

抖音一键去水印小程序: Taro + 微信云开发 https://github.com/terryso/super9

redhat123456/upPhysicalExercise –

up体能训练小程序(健身训练、观看视频、制定计划于一身的综合小程序) https://github.com/redhat123456/upPhysicalExercise

redhat123456/Tanger_query –

查询小程序(查询各种各样的信息的小程序) https://github.com/redhat123456/Tanger_query

mark420524/question – 学习答题小程序，诗词歌赋小工具-早晚答小程序 https://github.com/mark420524/question

云笔记<a href="https://github.com/Data-Camp/WeApp_Demos/tree/master/%E4%BA%91%E7%AC%94%E8%AE%B0/hotapp-notepad-master"> https://github.com/Data-Camp/WeApp_Demos/tree/master/%E4%BA%91%E7%AC%94%E8%AE%B0/hotapp-notepad-master

五险一金计算 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E4%BA%94%E9%99%A9%E4%B8%80%E9%87%91%E8%AE%A1%E7%AE%97

人脸检测 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E4%BA%BA%E8%84%B8%E6%A3%80%E6%B5%8B/weapp-face-detect-master

剪刀石头布 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%89%AA%E5%88%80%E7%9F%B3%E5%A4%B4%E5%B8%83/weapp-demo-websocket-master

备忘录开发 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%A4%87%E5%BF%98%E5%BD%95/todolist-master

大转盘 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%A4%A7%E8%BD%AC%E7%9B%98/tianmao

易打卡 表单设计 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E6%98%93%E6%89%93%E5%8D%A1%20%E8%A1%A8%E5%8D%95%E8%AE%BE%E8%AE%A1/app

涂鸦 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E6%B6%82%E9%B8%A6/graffiti

电影日历 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E7%94%B5%E5%BD%B1%E6%97%A5%E5%8E%86/calendar-movie

画布：时钟 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E7%94%BB%E5%B8%83%EF%BC%9A%E6%97%B6%E9%92%9F/weCanvasClock-master

语音跟读<a href="https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%AF%AD%E9%9F%B3%E8%B7%9F%E8%AF%BB/wxreading-master"> https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%AF%AD%E9%9F%B3%E8%B7%9F%E8%AF%BB/wxreading-master

货币汇率 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%B4%A7%E5%B8%81%E6%B1%87%E7%8E%87/currencyRate-master

跑步 地理位置 计时器 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%B7%91%E6%AD%A5%20%E5%9C%B0%E7%90%86%E4%BD%8D%E7%BD%AE%20%E8%AE%A1%E6%97%B6%E5%99%A8/weChatApp-Run-master

身份证查询<a href="https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%BA%AB%E4%BB%BD%E8%AF%81%E6%9F%A5%E8%AF%A2/wechat_gadget"> https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%BA%AB%E4%BB%BD%E8%AF%81%E6%9F%A5%E8%AF%A2/wechat_gadget

辩论倒计时 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%BE%A9%E8%AE%BA%E5%80%92%E8%AE%A1%E6%97%B6/timing

题库：选择选项，切换至下一题 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E9%A2%98%E5%BA%93%EF%BC%9A%E9%80%89%E6%8B%A9%E9%80%89%E9%A1%B9%EF%BC%8C%E5%88%87%E6%8D%A2%E8%87%B3%E4%B8%8B%E4%B8%80%E9%A2%98/calculate-swiperList-master

首字母排序选择<a href="https://github.com/Data-Camp/WeApp_Demos/tree/master/%E9%A6%96%E5%AD%97%E6%AF%8D%E6%8E%92%E5%BA%8F%E9%80%89%E6%8B%A9/wxSortPickerView-master"> https://github.com/Data-Camp/WeApp_Demos/tree/master/%E9%A6%96%E5%AD%97%E6%AF%8D%E6%8E%92%E5%BA%8F%E9%80%89%E6%8B%A9/wxSortPickerView-master

麻将骰子：附详细教程<a href="https://github.com/Data-Camp/WeApp_Demos/tree/master/%E9%BA%BB%E5%B0%86%E9%AA%B0%E5%AD%90%EF%BC%9A%E9%99%84%E8%AF%A6%E7%BB%86%E6%95%99%E7%A8%8B/WeChat-app-dice"> https://github.com/Data-Camp/WeApp_Demos/tree/master/%E9%BA%BB%E5%B0%86%E9%AA%B0%E5%AD%90%EF%BC%9A%E9%99%84%E8%AF%A6%E7%BB%86%E6%95%99%E7%A8%8B/WeChat-app-dice

答题小程序<a href="https://github.com/kesixin/QuestionWechatApp"> https://github.com/kesixin/QuestionWechatApp

婚礼邀请函 https://github.com/pengMaster/marry

婚礼喜帖小程序<a href="https://github.com/chenyongze/OnceLove"> https://github.com/chenyongze/OnceLove

电商

EastWorld/wechat-app-mall ★3000+ – 微信小程序商城<a href="https://github.com/EastWorld/wechat-app-mall"> https://github.com/EastWorld/wechat-app-mall

tumobi/nideshop-mini-program ★2000+ – 基于 Node.js + MySQL 开发的开源微信小程序商城 https://github.com/tumobi/nideshop-mini-program

bayetech/wechat_mall_applet ★300+ – 电商平台 https://github.com/bayetech/wechat_mall_applet

steedos/mini-vip – 华炎微站、微商城<a href="https://github.com/steedos/mini-vip"> https://github.com/steedos/mini-vip

社交

18380435477/WeApp ★300+ – 仿微信<a href="https://github.com/18380435477/WeApp"> https://github.com/18380435477/WeApp

ericzyh/wechat-chat ★100+ – 聊天室 https://github.com/ericzyh/wechat-chat

YYJeffrey/july_client ★100+ – 七月（一款社交小程序，集内容发布、动态分享、点赞评论、互动聊天等功能） https://github.com/YYJeffrey/july_client

RAOE/show-videos – 秀视频（微信小程序短视频社交软件，视频上传，音视频合成，评论，点赞，转发，分享等） https://github.com/RAOE/show-videos

wechat-im 即时通讯 https://github.com/unmagic/wechat-im

体育

汽车

资讯

jectychen/wechat-v2ex ★300+) – V2EX https://github.com/jectychen/wechat-v2ex

myronliu347/wechat-app-zhihudaily ★200+ – 知乎日报<a href="https://github.com/myronliu347/wechat-app-zhihudaily"> https://github.com/myronliu347/wechat-app-zhihudaily

ahonn/weapp-one ★200+ – 仿 ONE https://github.com/ahonn/weapp-one

yaoshanliang/weapp-ssha ★200+ – 企业宣传小程序 https://github.com/yaoshanliang/weapp-ssha

hilongjw/weapp-gold ★100+ – 掘金主页信息流<a href="https://github.com/hilongjw/weapp-gold"> https://github.com/hilongjw/weapp-gold

zce/weapp-douban ★100+ – 豆瓣电影 https://github.com/zce/weapp-douban

hingsir/weapp-douban-film ★100+ – 豆瓣电影 https://github.com/hingsir/weapp-douban-film

BelinChung/wxapp-hiapp ★100+ – HiApp https://github.com/BelinChung/wxapp-hiapp

romoo/weapp-demo-breadtrip ★100+ – 面包旅行 https://github.com/romoo/weapp-demo-breadtrip

githinkcn/Giteer – Giteer For 码云，基于Taro + Taro UI + Dva的小程序。 https://github.com/githinkcn/Giteer

bruintong/wechat-webapp-douban-movie – 豆瓣电影 https://github.com/bruintong/wechat-webapp-douban-movie

bruintong/wechat-webapp-douban-location – 豆瓣同城 https://github.com/bruintong/wechat-webapp-douban-location

mohuishou/scuplus-wechat – We 川大 https://github.com/mohuishou/scuplus-wechat

hankzhuo/wx-v2ex – v2ex<a href="https://github.com/hankzhuo/wx-v2ex"> https://github.com/hankzhuo/wx-v2ex

Hongye567/weapp-mark – 仿 Mark 影单的微信小程序 https://github.com/Hongye567/weapp-mark

jae-jae/weapp-github-trending – Github今日榜单 https://github.com/jae-jae/weapp-github-trending

alex1504/wx-guita_tab – 口袋吉他 https://github.com/alex1504/wx-guita_tab

Airmole/ShellBox – 贝壳小盒子（校园教务信息查询类工具，获2019高校小程序开发大赛华北区二等奖）https://github.com/Airmole/ShellBox

aquanlerou/WeHalo ★200+ – 爱敲代码的猫（WeHalo 简约风 的微信小程序版博客

） https://github.com/aquanlerou/WeHalo

yuzexia/iw3cplus – 前端社区http://www.w3cplus.com的微信小程序 https://github.com/yuzexia/iw3cplus

kilakila-heart/fuliba-front – 信息流福利吧小程序 https://github.com/kilakila-heart/fuliba-front

AnsonZnl/bookshelf –

基于云开发的书架小程序（附教程）

https://github.com/AnsonZnl/bookshelf

健康菜谱 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%81%A5%E5%BA%B7%E8%8F%9C%E8%B0%B1/caipu_weixin-master

分答微信小程序 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%88%86%E7%AD%94%E5%B0%8F%E7%A8%8B%E5%BA%8F/fenda-master

图书管理系统 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E5%9B%BE%E4%B9%A6%E7%AE%A1%E7%90%86%E7%B3%BB%E7%BB%9F/bookLibrary-master

网易云课堂小程序 https://github.com/Data-Camp/WeApp_Demos/tree/master/%E7%BD%91%E6%98%93%E4%BA%91%E8%AF%BE%E5%A0%82/wechat-Study163-master

仿芒果TV https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%8A%92%E6%9E%9CTV/wechat-Development-master

豆瓣图书<a href="https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%B1%86%E7%93%A3%E5%9B%BE%E4%B9%A6/DouBanBookApp"> https://github.com/Data-Camp/WeApp_Demos/tree/master/%E8%B1%86%E7%93%A3%E5%9B%BE%E4%B9%A6/DouBanBookApp

企业官网<a href="https://github.com/yaoshanliang/weapp-ssha"> https://github.com/yaoshanliang/weapp-ssha

小游戏

natee/wxapp-2048 ★100+ – 2048 小游戏 https://github.com/natee/wxapp-2048

yaoshanliang/weapp-jump ★100+ – 跳一跳<a href="https://github.com/yaoshanliang/weapp-jump"> https://github.com/yaoshanliang/weapp-jump

yaoshanliang/weapp-monument-valley ★100+ – 纪念碑谷<a href="https://github.com/yaoshanliang/weapp-monument-valley"> https://github.com/yaoshanliang/weapp-monument-valley

其它

huangjianke/Gitter ★700+ – Gitter for GitHub – 可能是目前颜值最高的GitHub小程序客户端 https://github.com/huangjianke/Gitter

lypeer/wechat-weapp-gank ★600+) – Gank 客户端 https://github.com/lypeer/wechat-weapp-gank

charleyw/wechat-weapp-redux ★300+ – Redux 绑定库 https://github.com/charleyw/wechat-weapp-redux

zce/weapp-boilerplate ★300+ – 微信小程序快速开发骨架 https://github.com/zce/weapp-boilerplate

lanshan-studio/wecqupt ★300+ – We 重邮 https://github.com/lanshan-studio/wecqupt

SuperKieran/weapp-artand ★200+ – Artand<a href="https://github.com/SuperKieran/weapp-artand"> https://github.com/SuperKieran/weapp-artand

dongweiming/weapp-zhihulive ★200+ – 知乎 Live https://github.com/dongweiming/weapp-zhihulive

kunkun12/weapp – 小程序 hello world 尝鲜 https://github.com/kunkun12/weapp

SeptemberMaples/wechat-weapp-demo ★100+ – 购物车 https://github.com/SeptemberMaples/wechat-weapp-demo

hijiangtao/weapp-newsapp – 公众号热门文章信息流<a href="https://github.com/hijiangtao/weapp-newsa"> https://github.com/hijiangtao/weapp-newsapp

charleyw/wechat-weapp-redux-todos ★100+ – 集成 Redux 实现的Todo list https://github.com/charleyw/wechat-weapp-redux-todos

hardog/wechat-app-flexlayout ★100+ – flexlayout https://github.com/hardog/wechat-app-flexlayout

zhuweiyou/fetop100 ★100+ – 前端TOP100 https://github.com/zhuweiyou/fetop100

Symous/WechatApp-BaisiSister – 百思不得姐 https://github.com/Symous/WechatApp-BaisiSister

zhengxiaowai/weapp-github – github https://github.com/zhengxiaowai/weapp-github

Seahub/PigRaising – PigRaising<a href="https://github.com/SeaHub/PigRaising"> https://github.com/SeaHub/PigRaising

uniquexiaobai/wechat-app-githubfeed – GitHubFeed https://github.com/uniquexiaobai/wechat-app-githubfeed

kaiwu/weui-scalajs – 使用Scala.js开发<a href="https://github.com/kaiwu/weui-scalajs"> https://github.com/kaiwu/weui-scalajs

tinajs/tina-hackernews – Hacker News 热点<a href="https://github.com/tinajs/tina-hackernews"> https://github.com/tinajs/tina-hackernews

LDouble/WeOUC – WeOUC(教务小程序) LDouble/WeOUC – WeOUC(教务小程序) https://github.com/LDouble/WeOUC

NewFuture/miniprogram-template – 原生API纯TypeScript开发小程序(VSCode as IDE)与完整开发流程 https://github.com/NewFuture/miniprogram-template

arleyGuoLei/wx-words-pk ★100+ –

2020 云开发实现单词对战小程序（随机匹配、人机对战、好友对战），专业UI https://github.com/arleyGuoLei/wx-words-pk

十、小程序运营

资源

We分析 · 小程序数据分析平台（官方视频教程）https://developers.weixin.qq.com/community/business/course/00004a73b1007048bc8ccc66e5140d

腾讯游戏：为什么你的社群不活跃（官方视频教程）https://developers.weixin.qq.com/community/business/course/0008aa0ac4c84048352d30f795c00d

周大福：社群运营团队与个性化服务（官方视频教程）https://developers.weixin.qq.com/community/business/course/000066de8c8b70217d2dc090e5540d

宝岛眼镜：「留量经营」启动期避坑指南（官方视频教程）https://developers.weixin.qq.com/community/business/course/0008ac75244ea08da62d63e4f5b80d

名创优品：从经营位置，到经营人（官方视频教程）https://developers.weixin.qq.com/community/business/course/000a82b2ebc12062b52d8ad8551c0d

十一、小程序赚钱案例

十二、小程序流量主

代开发小程序广告变现解决方案 「流量主代运营」模式 赋能服务商获得持续收益（官方视频教程）https://developers.weixin.qq.com/community/business/course/00068ca2c2c230cc0c2f4a9e956c0d

到这里已经接近4万字，其它部分内容可以看我的主页，内容都是我这些年积累下来的实战经验。

四、微信小程序制作教程？

1.懂代码的小伙伴，可以用各大小程序平台的官方开发者工具来做小程序.

2.不懂代码的小伙伴，可以利用无代码的【比文云开发者工具】来制作小程序。

下面给大家讲讲如何利用无代码小程序制作工具来制作小程序：

1.在小程序制作平台注册账号 

用电脑浏览器搜索比文云官网注册一个账号 

这个账号是用于保存小程序制作进度的，也是统一管理小程序内容以及了解小程序数据的平台，所以账号要保存好哦。 

2.套用小程序模板 

接下来就是套用小程序模板的环节了，套用模板很简单，大家可以根据小程序模板行业分类，或直接在搜索栏搜索相关行业，即可找到对应的行业小程序模板。 

选好后，直接套用即可应用到自己账号的小程序页面中。 

3.完成小程序页面设计 

进入到小程序开发页面。 

- 页面左侧会提供各种功能模块，只需要用鼠标拖动到相对小程序上就可以完成功能添加 

- 在页面右侧会提供功能和页面参数的设置，可以用键盘输入文字和数字，就能完成小程序设计。 

4.在后台申请平台的小程序账号，并绑定。

五、微信小程序怎么制作？

怎么制作微信小程序，

流程一：微信小程序注册

登录微信公众平台，点击立即注册，选择小程序模块。

流程二：微信小程序制作

对于不懂技术和编程的小白，可以采用套用模板的模式通过简单的拖拽方式一键生成微信小程序，方便快捷。

流程三：选用合适模板

在各式各样的模板中，选择适合自己行业的模板

流程四：编辑内容，发布

选择合适的模板模块中编辑内容，填充，丰富。编辑完成之后，就可以发布了。

流程五：进入打包小程序页面，选择代码包下载

流程六：微信web开发工具

进入微信公众平台，下载开发工具

流程七：小程序项目管理，点击添加项目

流程八：小程序APPID

填入申请到的小程序的 AppID，上传刚刚下载的打包文件。在开发者内可以小程序预览，确认无误后，然后上传。

以上就是微信小程序制作教程，希望对大家有所帮助！

六、怎么制作微信小程序？

微信小程序没有免费的，是需要开发的；除非是你自己懂得技术编程，自己开发一个小程序，但是这样也一样需要每年的300元微信认证费用，所以没有所谓的免费，这个大家一定要有辨别力，至于怎么制作呢，你可以通过以下的两种方式其中之一来制作自己的微信小程序，比如：一种是定制开发，不过这种开发价格较高，几万甚至十几万不等，主要的就是开发周期较长，几个月甚至更长才能上线运营；另外一种就是第三方平台开发，这种开发价格较低，根据功能几千就可以开发好，关键是开发周期短，一个星期左右就可以上线运营。所以，可以根据自身情况选择开发方式进行开发。

七、微信小程序可以自己制作吗？

微信小程序可以自己制作吗？

• 两个方法，自己去搭建小程序
• 不同的人群，可以选择不同的方法
• 不懂代码也能做，这里都教你

方法一：使用微信开发者工具

微信开发者工具是一款编程软件，可以在里面编写代码，去实现自己需要的功能

代码的知识层面会涉及到javascript，css，小程序api文档，难度比较大的

它们大概长这样：

//index.js文件
Page({
  data: {
    array: [{
      message: 'foo',
    }, {
      message: 'bar'
    }]
  }
})

//index.wxml文件
<view wx:for="{{array}}" wx:for-index="idx" wx:for-item="itemName">
  {{idx}}: {{itemName.message}}
</view>

由此可见，一个功能完善一点的小程序涉及到的编程知识面会非常广，适合科班出身的人群

方法二，小程序制作工具，不懂代码也能做

小程序制作工具会为常见的行业，提前开发好了功能，注册一个账户，开箱即用就能搭建小程序。

流程也是很简单，挑选模板，动动鼠标，和搭积木一样搭建小程序，小白也能轻松上手

➜➜

也为大家提前准备好了面面俱到的搭建教程，点击即可阅读

>> 如果回答对你有帮助的话，可以收藏起来慢慢看哦~~~

八、这个微信小程序图片怎么制作？

登录微信公众平台，在小程序设置页面可以下载该小程序的太阳码。

九、微信小程序商店制作

微信小程序商店制作：打造个性化、便捷的线上购物平台

随着移动互联网的快速发展，人们的购物方式已经发生了巨大的变化。传统的线下商店已经无法满足消费者的需求，而线上购物平台的崛起成为了主流趋势。在众多的线上购物平台中，微信小程序商店以其便捷、个性化的特点受到了广大用户的喜爱。那么，如何制作一个优质的微信小程序商店？本文将为大家详细讲解。

一、选择适合的微信小程序商店制作工具

选择一款适合的微信小程序商店制作工具是打造一个成功的微信小程序商店的第一步。目前市面上有各种各样的微信小程序商店制作工具，其中有些是免费的，有些是收费的。选择合适的工具需要根据个人的需求和预算来决定。有一些工具提供了简单易用的界面和丰富的模板，能够帮助用户快速搭建自己的微信小程序商店。

二、设计个性化的界面

微信小程序商店的界面设计是吸引用户注意力的关键。一个好的界面设计能够提升用户体验，增加用户的粘性。在设计界面时，需要考虑以下几点：

• 色彩搭配：选择合适的色彩搭配，使界面看起来更加美观舒适。
• 布局设计：合理的布局设计能够使用户快速找到自己想要的商品。
• 图片选择：选择高质量的商品图片，展示商品的特点和优势。

需要注意的是，设计风格要符合目标用户的需求和喜好，才能够吸引他们的注意力。

三、提供便捷的购物流程

一个优秀的微信小程序商店应该提供便捷的购物流程，让用户能够快速选择并支付商品。为此，需要考虑以下几点：

• 商品分类：合理的商品分类能够帮助用户快速找到自己想要的商品。
• 搜索功能：提供便捷的搜索功能，让用户能够快速找到自己想要的商品。
• 购物车功能：提供方便的购物车功能，方便用户将自己想要的商品添加到购物车中，并随时查看购物车中的商品。
• 支付功能：提供多种支付方式，方便用户选择最适合自己的支付方式。

一个便捷的购物流程能够提升用户的购物体验，增加用户的购买意愿。

四、进行推广和营销活动

制作一个用户满意的微信小程序商店只是第一步，如何吸引更多的用户并增加销量才是关键。在进行推广和营销活动时，可以考虑以下几种方式：

• 微信小程序广告：通过微信小程序广告，向更多的用户展示自己的商品。
• 社交媒体推广：通过社交媒体平台，与用户进行互动，提升品牌认知度。
• 优惠活动：开展各种优惠活动，吸引用户参与购买。
• 用户评论：鼓励用户在微信小程序商店进行评论和评分，增加其他用户的信任度。

通过合理的推广和营销活动，可以吸引更多的用户并提升销量。

五、不断优化和改进

制作一个成功的微信小程序商店并不是一蹴而就的，需要不断地优化和改进。通过收集用户反馈和数据分析，了解用户的需求和喜好，并根据这些信息来不断优化和改进微信小程序商店的功能和内容，从而提升用户体验和购买意愿。

总结起来，制作一个优质的微信小程序商店需要选择适合的制作工具、设计个性化的界面、提供便捷的购物流程、进行推广和营销活动，并不断优化和改进。希望本文对大家在微信小程序商店制作方面提供一些帮助和指导。

十、微信小程序官方制作

微信小程序官方制作一直以来都备受关注，随着移动互联网的发展，微信小程序作为一种轻应用模式，受到越来越多用户和企业的青睐。在这篇博文中，我们将深入探讨微信小程序官方制作的重要性、流程步骤以及一些最佳实践，帮助您更好地了解如何打造一个优秀的微信小程序。

为什么选择微信小程序

随着智能手机的普及，移动应用成为人们生活中不可或缺的一部分。与传统的App相比，微信小程序具有体积小、加载速度快、无需下载安装等优势，更加符合用户的快捷需求。同时，微信作为目前国内最大的社交平台之一，具有庞大的用户群体，可以为微信小程序的推广和使用带来便利。

微信小程序官方制作流程

微信小程序官方制作的流程一般包括需求分析、UI设计、开发编码、测试上线等几个主要步骤。首先，需要明确小程序的定位和功能需求，进而进行UI设计，包括界面布局、视觉风格等。接着，开发人员根据设计稿进行编码开发，确保小程序的功能正常运行。最后，经过内部测试和审核后，小程序可以正式上线使用。

微信小程序官方制作最佳实践

在进行微信小程序官方制作时，有一些最佳实践值得注意。首先，要保证小程序的页面加载速度快，用户体验良好。其次，UI设计要简洁明了，符合用户习惯，避免过于繁杂的操作流程。另外，小程序的功能要实用，符合用户需求，可以提高用户粘性和留存率。

总的来说，微信小程序官方制作是一个复杂而精细的过程，需要设计、开发、测试等多个环节的协同合作。只有不断优化和提升，才能打造出一个用户满意的微信小程序。希望本文对您了解微信小程序官方制作有所帮助，如有疑问或需要进一步的指导，请随时与我们联系。