关于微信生态的一切

2024年3月5日 247次阅读来源: 掘金

一个小时快速搭建微信小程序

「小程序」这个划时代的产品发布快一周了，互联网技术人都在摩拳擦掌，跃跃欲试。可是小程序目前还在内测，首批只发放了 200 个内测资格（泪流满面）。本以为没有 AppID 这个月就与小程序无缘了，庆幸的是微信这两天发布了正式版开发者工具，无需内测邀请也可以尝鲜了。

tmt-workflow：微信团队开源的基于 Gulp 4.0、高效跨平台可定制的前端工作流程

自动化流程
Less -> CSS (Sass 可自行定制)
CSS Autoprefixer 前缀自动补全
自动生成图片 CSS 属性，width & height 等
CSS 压缩 cssnano
CSS Sprite 雪碧图合成
Retina @2x & @3x 自动生成适配
imagemin 图片压缩
JS 合并压缩
EJS 模版语言
调试 & 部署
监听文件变动，自动刷新浏览器 (LiveReload)
FTP 发布部署
ZIP 项目打包
解决方案集成
px -> rem 兼容适配方案
智能 WebP 解决方案
去缓存文件 Reversion (MD5) 解决方案

7 天写分答微信小程序第一天: 组织与首页

编写分答过程跟踪
7 天写分答微信小程序, 第一天计划、组织架构与首页编写

微信小程序高仿手机 QQ

微信小程序一经出现，身为一个 Andrid 开发的我，对其也产生的浓厚的兴趣，于是拿仿照 QQ 练手，由于对 js,css 不太了解，也是边学边做，源码奉上，有不足之处欢迎指正，欢迎 star

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

你最想要的 “微信小程序” 运行机制系列的文章来了，除了了解框架的原理，你还将知道怎样创建一个这样的框架。

微信小程序开发之大转盘仿天猫超市抽奖

使用 TypeScript 开发微信小程序（4）——类（Class）

从 ECMAScript 6 开始，可以使用基于类的面向对象的方式。

微信小程序开发之https从无到有

原文链接：www.devsai.com 本篇不讲什么是https，什么是SSL,什么是nginx 想了解这些的请绕道，相信有很多优秀的文章会告诉你。本篇要讲的在最短的时间内，让你的网站从http升级到https。开始教程前再说一句：https你值得拥有。起因最近段时间，…

工具篇: 微信小程序开发 ide 编辑器的选择

看看哪款 IDE 是你开发微信小程序的菜
1、微信开发者工具
2，Visual Studio Code
3、Egret Wing 3.2.0

微信小程序 – 从零开始制作一个跑步微信小程序

微信小程序 – 从注册流程到完成一个可以用的跑步微信小程序。

Vux 2.0 发布

基于 WeUI 和 Vue(2.x) 开发的移动端 UI 组件库，主要服务于微信页面

为小程序而生的小 (jiao) 手架

不久前我们一直所期待的应（xiao）用（cheng）号（xu）终于诞生了，但微信制造了一系列的封闭环境，在内测版中，我们看见了开发其实是十分不便利的。为了能提升咱们的工作效率，小手架由此而生 — wxapp

现学现卖微信小程序开发（一）

现学现卖微信小程序开发（二）现学现卖微信小程序开发（三）：引入Rx，为小程序插上翅膀很早就注册了微信小程序内测，因为是拖延症晚期患者，所以一直都没有学习。直到昨天（2016年12月28日），张小龙童鞋宣布微信小程序2017年1月9日正式上线，满屏都是小程序的消息。我这时才想起…

现学现卖微信小程序开发（二）

现学现卖微信小程序开发（一）现学现卖微信小程序开发（三）：引入Rx，为小程序插上翅膀一个Todo应用的小程序版好的，那么下一步我们就先照猫画虎，新建一个todos文件夹，然后一套四样同名文件准备齐全新建todos目录和相关文件先在app.json中报个到，在pages中…

Nodejs 下微信网页开发教程 (一)

超级详细的微信网页开发教程，所有会踩到的坑都一一列举，让你分分钟开发出一个微信网页

微信移动 UI 设计规范

微信 APP UI 设计规范，你值得拥有～

微信小程序组件化解决方案wx-component

前言最近摩拜单车小程序需求越来越多，多人协作，甚至多个项目并行。如何合作的更顺畅，提升团队成员开发效率，这便是这段时间思考的问题。其中很重要的一点就是，小程序功能组件化。但小程序的开发框架目前还不支持component，结合具体开发经验，我们封装了wx-component。…

微信朋友圈上这个很火很炫的广告是怎么实现的

奥运当天，朋友圈原生推广页广告上线，6 大品牌亮相朋友圈，带来视觉上的震撼体验。本文将分析一下微信这种原生广告的实现方式。
微信广告团队这个非常了不起的发明，将把 app 端广告将正式带入原生时代！

微信小程序开发教程-从零开始（1）

前言微信小程序暂时处于内测期间，公司大的版本刚好上线了，闲来无事，看看微信小程序的文档，顺便学习学习，在此希望和大家一起共勉，发现自己越来越懒惰了，越活越没上进心了，有点危险，给自己敲下警钟吧。废话不多说，开始记录下这些天学习到的一些知识，希望对正在阅读的你有所帮助！本文为i…

微信小程序第一次官方公开课图文直播

微信团队官方的线下培训，直播图文

如何让你的微信小程序审核更容易通过？

根据我发现了无数原因，我将其整理起来，给大家参考，帮助大家更容易通过小程序审核，推荐收藏备用！

摩拜单车微信小程序开发技术总结

摩拜单车小程序已于微信小程序上线第一天正式发布，刷爆微博媒体朋友圈。本文主要讲讲技术方向的总结，在段时间的开发周期内内如何一步步从学习到进阶。

小程序之豆瓣电影源码解读

项目是从github上面下载的，因为本人觉得项目做得非常棒，含括了一些巧妙的解决思路，所以写一篇文章，将其源码精髓部分，抽出来给大家讲讲~~ 先看项目效果：首页效果一、loading加载和自定义上拉刷新 1）loading加载效果：细心同学可能发现，热映、待映、口碑等ta…

微信公众号排版手册

随着微信的发展，目前公众号的数量已经呈现信息过载状态，而良好的阅读体验也成为提高用户阅读和转发量的重要因素。与传统的Web端有所不同，移动端的阅读体验有着不同的标准。今天我们就来说说微信公众号到底如何排版。

精选微信小程序组件插件, 优秀组件插件集合

微信小程序汇总优秀的小程序, 长期更新….
欢迎提交… 编辑….

开源组件 / 及插件

wxParse – 富文本
WeToast for 微信小程序 toast 增强插件
wxSearch – 微信小程序优雅的搜索框
….

微信小程序原理

微信小程序使用了前端技术栈 JavaScript/WXML/WXSS。它背后的原理是怎么样的呢？

Weui 1.0 发布

WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身设计，令用户的使用感知更加统一。
经过半年的打磨，WeUI 1.0 正式发布，主要是新增了一些常用组件，并使用 BEM 命名，为接下来的微信小程序开发做好准备。

看完了张小龙的 2359 条饭否日记

张小龙在饭否上的账号被人挖出来了，来看看他在做微信时的心路历程吧。

首个微信小程序开发教程！

本文档将带你一步步创建完成一个微信小程序，并可以在手机上体验该小程序的实际效果。这个小程序的首页将会显示欢迎语以及当前用户的微信头像，点击头像，可以在新开的页面中查看当前小程序的启动日志。

从微信 WeUI 设计规范解读移动界面设计

文／风口上的猪毛（簡書作者）

高仿QQ小程序，我趟过的坑

/** 作者：Code4Android 项目地址：https://github.com/xiehui999/… 新浪微博：http://weibo.com/745687294 CSDN : http://blog.csdn.net/xiehuimx?vi…

真的炸了：让人头痛的小程序之『图片懒加载』终极解决方案

转载：请写明掘金原文链接及作者名 ‘小小小’第250名入群者，奖书一本 QQ群：139128168 ← 点击加群微信小程序中，懒加载特效让人头疼不已，因为小程序完全没法操作dom，所以位置的操作在小程序中，变得极其的难~~ 先看特效：图片懒加载我们将其拆分为如下几个步骤进…

Node.js 微信开发 — 接入指南

微信开发教程

微信小程序 Demo – 仿知乎

之前有很长一段时间我算是知乎重度依赖, 所以这次 demo 的模仿对象选择的是知乎 (但是写到一半发现我这个决定坑了, 这是后话).

demo 的界面设计以及交互设计均来自于知乎 Android 版本

微信面试题 – 获取元素的最终 background-color

解析微信面试的题目所挖的坑，以及怎么完美跳过~

微信小程序开源项目库集合

由 OpenDigg 整理并维护的微信小程序开源项目库集合.

微信网页开发者工具发布

微信官方发布开发者工具，简直造福前端狗。此微信 web 开发者工具，可以在 PC 或 Mac 上模拟访问微信内网页，帮助开发者更方便地进行开发和调试。

Mars – 腾讯移动 Web 前端知识库

腾讯移动 Web 前端知识库，面向亿万用户级的移动端 Web 解决方案。

微信小程序—仿芒果 TV（已开源）

WeUI for 小程序正式发布

为微信小程序量身设计

300 行代码写一个音乐播放器小程序

小程序、nodejs

微信小程序全面实战，架构设计 && 躲坑攻略

本文结合具体的实战经验，主要介绍微信小程序的基础知识、开发中遇到的难点、项目的架构设计、最佳实践以及踩过的坑。文章内容较多，如果想看架构设计和躲坑技巧，请直接浏览后面的正文

WxMasonry – 微信小程序实现瀑布流布局

使用 css3 的 column-＊属性
column-width
column-count
column-gap

深挖微信小程序！你需要先了解这三个内核

在 iOS 上，小程序的 javascript 代码是运行在 JavaScriptCore 中
在 Android 上，小程序的 javascript 代码是通过 X5 内核来解析
在开发工具上，小程序的 javascript 代码是运行在 nwjs（chrome 内核）中

微信小程序 Tips: 使用 mock.js 提供模拟数据

适合
初学者: 如果你是一个刚刚开始写小程序的学习者，又苦于没有 api 拿来用，那么 mock 可以帮助你快速建立模拟数据，用于学习

开发者: 如果你的公司或者组织正在开发小程序，可是后台还没有能够提供给你调用接口，但是数据格式已经确定好，那么求人不如求己，自己先通过 mock 来模拟相关接口数据，先行一步。

微信小程序『侧边栏滑动』特效

侧边栏滑动是很常见的功能，但是小程序出来不久，很多特效还没有成熟案例，只能原生重写，所以今天为大家带来4个漂亮的侧边栏特效~~ 侧边栏特效一先看效果：点击按钮侧边滑动 wxml: …

微信扫一扫揭秘

大众点评点餐小程序开发经验 – 概述

作者介绍：周中坚，美团点评工程师，4年 Web 前端开发经验，主要负责过会员卡、外卖、预订、商家平台等业务的前端开发，现在是美团点评点餐团队的一员。如果你看过《张小龙首次全面阐述小程序》这篇文章，一定会对这句话有印象：”比如我们到一个餐馆，我们可能想排队或者说点一下菜，我们并…

[[干货] 滴滴出行在小程序的实践](https://juejin.im/entry/5831a…

滴滴出行的 webapp 有着非常庞大的用户量，对于用户体验的要求很高，因此我们在做小程序的时候也是精益求精的，现在把相关实践给大家看看。