微信小程序试水

去年火了小程序。我也试试吧。

什么小程序

微信小程序是运行在微信内部的一个应用
微信小程序可以在微信内被便捷地获取和传播，同时具有出色的使用体验。

---

优点

• 可以通过扫码或朋友推荐获取
• 无需安装，直接使用
• 即点即用，用完即走
• 开发方便
• 开发成本低

---

缺点

• 入口少，推广不便
  （1）二维码
  （2）好友推荐

• 用户体验不够好

• 开发环境不友好

• 不适合复杂应用

• 变现能力未知
  |

  ---

小程序结构

主体部分

一个小程序主体部分由三个文件组成，必须放在项目的根目录
- app.js 小程序逻辑 （必须）
- app.json 小程序公共设置 （必须）
- app.wxss 小程序公共样式表（可选）

页面部分

一个小程序页面由四个文件组成，分别是：
- js 页面逻辑（必须）
- wxml 页面结构（必须）
- json 页面配置 （可选）
- wxss 页面样式表（可选）
： 参考资料
https://mp.weixin.qq.com/debug/wxadoc/dev/framework/structure.html

---

学习资料

• 官方网站：

  • 框架
  • 组件
  • API
  • 工具
  • 讨论

• 其他：

• http://www.jianshu.com/p/45e41cdf6706

---

如何开发小程序？

准备工作：

注册小程序账号(不必须)

目前微信小程序的账户并没有对个人用户开放，但是还好微信的开发工具不要求是小程序的注册用户，也就是随便哪个人都可以使用工具进行开发测试，所以即使不注册账户也可以学习小程序。
注册和不注册的区别
注册：拥有小程序ID（AppID），可以连接真机测试
不注册：没有小程序ID，只能在本地虚拟机测试
注册地址：（我就没有注册）
https://mp.weixin.qq.com/

安装小程序的开发工具

下载后，打开使用手机扫一下微信登陆开发
下载地址：
https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=1487220581

例子：导入项目

1,添加项目

2,选择开发的好的项目的路径，进行导入

3，导入成功

例子：开发新的程序

目录：

1，新建项目

2，新建一个空的项目

3，依次建立相关文件


4，代码
app.json

{
    "pages": [
        "pages/index/index",
        "pages/hello/hello"
    ],
    "window": {
        "navigationBarBackgroundColor": "#000",
        "navigationBarTextStyle": "white",
        "navigationBarTitleText": "hello  world",
        "backgroundColor": "#000"
    },
    "tabBar": {
        "list": [
            {
                "pagePath": "pages/index/index",
                "text": "主页"
            },
            {
                "pagePath": "pages/hello/hello",
                "text": "你好"
            }
        ]
    }
}

保存之后，会自动出现hello 和index文件夹。如果没有的话自己新建一下。

index.wxml

<!--pages/index/index.wxml-->
<text>这是我的第一个小程序</text>

hello.wxml

<!--pages/hello/hello.wxml-->
<text>hello world</text>

5，运行情况

小结

认识一下我们现在使用的小程序。使用很便捷，理念很时尚，程序开发也很简单。