体验小程序
话不多说，直接开干...
首先下载 微信开发者工具
打开微信开发者工具，选择体验小程序
体验小程序
在本地磁盘新建一个目录，如helloWorld
小程序体验
点击确定，微信将会为我们生成一个默认的小程序欢迎页：
小程序欢迎页
小程序的构成
欢迎页的内容是由以下文件渲染出来的：
文件结构
首先，我们来分析下index.wxml
<view class="container">
<view class="userinfo">
<button wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
<block wx:else>
<image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
<text class="userinfo-nickname">{{userInfo.nickName}}</text>
</block>
</view>
<view class="usermotto">
<text class="user-motto">{{motto}}</text>
</view></view>很明显，这些内容与html相似，但又不属于html。看着像是自定义的xml。实质上，这是微信标记语言(WeiXin Markup Language)，详见看 WXML文档，可以将其与web页面的html相对应
接着分析index.wxss
/**index.wxss**/.userinfo { display: flex; flex-direction: column; align-items: center;
}.userinfo-avatar { width: 128rpx; height: 128rpx; margin: 20rpx; border-radius: 50%;
}.userinfo-nickname { color: #aaa;
}.usermotto { margin-top: 200px;
}这个文件一看就是与web页面的css相对应。WXSS(WeiXin Style Sheets)是一套样式语言，用于描述 WXML 的组件样式。官方文档
最后分析index.js文件，文件内容太长就不列出来了。虽然后缀名与web的javascript一样，但两者是不同的语言，在小程序中，被称为WXS（WeiXin Script)j, 详见官方文档
由此可见，小程序的页面是由WXML, WXS, WXSS三者构建而成。我们可以简单地将这三者分别对应于web三大标准中的html, js, css, 便于我们快速理解新概念
通过对文件进行修改，体验下开发流程，将index.js中的数据修改
修改内容
然后按编译查看效果
编译
页面的显示内容已被修改
你好，世界
作者：章鱼喵_
链接：https://www.jianshu.com/p/3b5975322873