1，微信小程序的开发类似于H5的开发。
其中 类似于HTML 的
同样的，view也支持ID 和CLASS
<view class='head'>我是头部</view>上面的代码等同于HTML里的
<div class='head'>我是头部</div>如果你可以轻松的认识HTML里的DIV 层级关系，那么在编写小程序代码的时候，是很轻松就能上手的。
,2，认清目录结构
在小程序开发的过程中，认清目录结构是十分重要的事情。
pages ------ 项目目录，类似于 WEB网站的 WWWutils ----- 公共样式、方法 app.js -----项目主要的JS 主要放微信授权登录 等app.json ---- 项目菜单的路径和整个项目的名称 颜色 等 属于类似网站配置的一个文件app.wxss ---全局CSS样式project.config.json ---项目配置文件，这个文件是自动生成的，一般不写 sitemap.json ---项目地图，最近加入从上面的目录看到，最关键的目录其实在PAGES，我们以后开发代码的地方就在这里。
3，小程序调用变量的符号{{}}
主要符号是英文半角的大括号2个，左右互为一对。
在小程序pages内，如果我们想新创建一个页面，那么就找到 app.json 这个文件，我们会看到以下代码"pages": [ "pages/index/index", "pages/logs/logs" ],``这时候，我们就在page 这个数组内再添加一个 logo 的页面，并让他变成小程序启动的首页面"pages": [ "pages/logo/index", "pages/index/index", "pages/logs/logs" ],`，点击保存后，我们会在小程序的页面里自动生成一个LOGO页面。上面为简单生成一个新页面，下面我们写代码在LOGO新页面下，我们会看到4个新文件，
其中index.wxml 就是类似于HTML 的页面
index.wxss 为CSS样式文件
index.js 为核心JS控制文件
index.wxml
`<view class='red'>{{word}}</view>index.wxss
/* pages/logo/index.wxss */.red { width: 100%; height: 100px; background: #ff5a00; line-height: 100px; font-size: 20px; text-align: center;}index.js
// pages/logo/index.jsPage({ /** * 页面的初始数据 */ data: { word:"你好，微信小程序" }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { }, /** * 生命周期函数--监听页面显示 */ onShow: function () { }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { }, /** * 用户点击右上角分享 */ onShareAppMessage: function () { }})其中
即为变量 word ，当然，这里写的是死值。
以下是效果图
