小程序

提示

在开发小程序之前。应当掌握 HTML、CSS、JavaScript 基础 以及 ES6。

小程序基础简介

在微信小程序中主要有四种文件结构: wxml、wxss、js 和 json。其中 wxml 对应带有 vue.js 特征的 html5，wxss 对应 css3，js 对应 ES6 标准的的 javaScript。

对于 QQ 小程序，其文件结构为 QML、qss、js 和 json。

提示

QQ 小程序本质还是换汤不换药的，且 QQ 开发者工具兼容 wxml 与 wss)

小程序开发与网页开发极其相似。所以必须有适当的网页开发基础。零基础的人可能很难直接上手小程序开发。

教程目录

• 文件结构

• 运行环境

• 小程序配置

  • 全局配置

  • 页面配置

  • sitemap 配置

• 小程序框架

  • 框架介绍

  • 场景值 高级

  • 运行环境 高级

  • 运行机制 高级

  • 更新机制 高级

• 逻辑层

  • 生命周期

  • 路由

  • 注册

  • App()

  • Page()

  • 运行

  • 模块化

  • API

• 视图层

  • WXML

  • WXSS

  • WXS

  • 事件

  • 基础组件

  • 动画 高级

  • WXS 高级

  • WXS 事件 高级

  • 建议双向绑定 高级

  • 获取界面上的节点信息 高级

  • 相应显示区域变化 高级

  • 初始渲染缓存 高级

• 小程序能力

  • 网络请求

  • 存储

  • 文件系统

  • 调试

开发者工具

• 工具界面简介

• 调试

• npm

• 体验评分

官方教程

• 点击前往

案例

• GitHub repository

Mr.Hope 框架说明

• 小程序框架使用说明

• tag 值参数表

• setPage 库使用说明

• 界面简单开发学习指南

• 分享相关

学习视频

• 零基础开发小程序(比较新的视频，强调总体思想)

• 小程序-从入门到入土(比较老的视频，针对每个组件或者 API 进行了针对的讲解与示范，但部分内容已经与最新官方文档不符)

示例代码

• 小程序实例源码

  

  小程序示例二维码

官方文档

• QQ 小程序
• 微信小程序
• 微信小程序社区
  • 官方公告

QQ 开发者工具

现在很多功能还处于缺失状态，bug 到没之前那么多了。

• 查看详情

• 下载地址

微信开发者工具

微信开发者工具用来开发与调试微信小程序和微信相关网页的官方工具。小程序使用该开发工具进行开发。

• 下载地址

• 开发者工具教程

• 官方使用指南