微信公众平台 —— 小程序Demo开发学习笔记

小程序教程

小程序注册

作为小程序Demo开发学习笔记 不再赘述注册 、
获取Appid (注意不可直接使用服务号或订阅号的 AppID)
等步骤,官方已经写的很具体，事实上要直奔主题研究代码怎么写，直接注册个账号就可，这里我注册的

邮箱账号： [email protected]
密码： xcx@tencent

下载微信web开发者工具

这里下载的是 mac版2017.02.06 （0.13.140600）

下载Demo源码

这里下载的是源码 版本20170111

微信web开发者工具添加Demo项目

step1 本地小程序项目2017-02-07 17.00.15.png

step2 添加项目 2017-02-07 17.00.40.png

step3 添加前面下载的Demo 2017-02-07 17.01.50.png

step4 添加成功 打开项目2017-02-07 17.02.16.png

step5 成功打开 进入编辑模式 2017-02-07 17.02.33.png

简易教程

这个先跳过不看搁置，因为前面已经实现了简易步骤，假如申请appid下来了，可以再根据简易教程创建项目

框架

• javascript && wxss

微信小程序运行在三端: iOS Android和 用于调试的开发者工具
三端的脚本执行环境以及用于渲染非原生组件的环境是各不相同的:

在iOS上，小程序的javascript代码是运行在JavaScriptCore中，是由 WKWebView来渲染的，环境有iOS8 iOS9 iOS10

在Android上,小程序的javascript代码是通过X5 JSCore来解析，是由[X5](http://x5.tencent.com/tbs/)基于Mobile Chrome 37内核来渲染的

在开发工具上，小程序的javacript代码是运行在 nwjs 中，是由Chrome Webview 来渲染的 

• 目录结构

框架提供了自己的视图层描述语言WXML和WXSS,以及基于JavaScript的逻辑层框架，并在视图层与逻辑层间隔提供了数据传输和事件系统，可以让开发者专注于数据与逻辑上的开发

xiao pu.png

• 配置

• 逻辑层

• 视图层

组件

什么是组件:

• 组件是视图层的基本组成单元

• 组件自带一些功能与微信风格的样式

• 一个组件通常包括 开始标签 和 结束标签 , 属性 用来修饰这个组件， 内容 在两个标签之内

• 视图容器

• 基础内容

• 表单组件

• 导航

• 媒体组件

• 地图

• 画布

• 客服会话

API

框架提供丰富的微信原生API,可以方便的调起微信提供的能力，如获取用户信息，本地存储，支付功能等。

• 网络

• 媒体

• 文件

• 数据缓存

• 位置

• 设备

• 界面

• 开放接口

工具

• 概览

• 程序调试

• 代码编辑

• 项目预览

• 下载

• 细节点

• 历史更新日志

Q&A

开发者社区