微信小程序入门前瞻

微信小程序是微信官方推出的轻应用,以手机端类似于网页的形式构造微信内等同于App的用户体验。小程序在这两年逐渐发力,逐渐成为了应用市场上不可忽视的一个重要组成部分。我们着手开发小程序时,可能会遇到以下几个问题:

1.小程序是html5制作的吗

可以说小程序源于h5,从事前端的朋友们如果看到了小程序创建项目自动生成的代码就会发现,小程序的代码与React.Js的代码非常类似,这对于从事React Native或使用React.js来工作的前端或者移动端程序员非常友好,同时,只要熟悉前端的朋友就会发现,wxss,js,wxml的编写与前端开发中的css,js,html的写法几乎完全一样。所以前端程序员开发小程序应该是毫无压力的

小程序的开发模式

小程序允许有一个管理者和多个开发者,这给了企业开发者更方便的开发方式,更加适应集体开发模式。同时,小程序也有官方的开发者工具,同时在sublime等开发者工具上也都能进行小程序开发,相信后续也会有更多的IDE厂家进行插件或者IDE开发。另外,本地进行开发式,可以选择不检验域名安全性调试。一旦提交审核,那么提供接口的域名必须是https形式的。后台人员在配置时,需要配置好SSL证书。

小程序的真机调试

小程序可以在没有在小程序官方appid的情况下进行开发工具上的预览,但是如果你想要在你的手机上预览,则必须填写appid。否则会出现上传和预览按钮不能点击的情况这里写图片描述

当你填入小程序的appid并创建项目后,上图所示的上传和测试按钮便可以点击了。小程序可以上传多个版本给微信官方进行审核,这个过程和App store的审核类似。

小程序的结构

如图
这里写图片描述

pages中是所有页面的集合
app.js是应用全局的一些控制。
app.json文件对页面整体结构进行了控制,
app.json文件内容

{
  "pages":[
      "pages/list/list",
    "pages/board/board",
    "pages/item/item",
    "pages/search/search",
    "pages/logs/logs"
  ],
  "window":{
    "navigationBarBackgroundColor": "#35495e",
    "navigationBarTextStyle": "white",
    "navigationBarTitleText": "电影",
    "backgroundColor": "#fff",
    "backgroundTextStyle": "dark",
    "enablePullDownRefresh": true
  },
  "tabBar": {
    "color": "#a9b7b7",
    "selectedColor": "#11cd6e",
    "borderStyle": "white",
    "list": [
      {
        "selectedIconPath": "images/delSelected.png",
        "iconPath": "images/del.png",
        "pagePath": "pages/board/board",
        "text": "首页"
      },
      {
        "selectedIconPath": "images/setSelected.png",
        "iconPath": "images/set.png",
        "pagePath": "pages/logs/logs",
        "text": "日志"
      }
    ]
  }

}

pages定以的是所有的页面,默认会显示排在第一个的页面
tabbar显示的是第一个应用底部的标签。

app.wxss是全局的样式控制。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值