小程序介绍 - 新闻资讯 - 云南小程序开发|云南软件开发|云南网站建设-昆明葵宇信息科技有限公司

159-8711-8523

云南网建设/小程序开发/软件开发

知识

不管是网站,软件还是小程序,都要直接或间接能为您产生价值,我们在追求其视觉表现的同时,更侧重于功能的便捷,营销的便利,运营的高效,让网站成为营销工具,让软件能切实提升企业内部管理水平和效率。优秀的程序为后期升级提供便捷的支持!

您当前位置>首页 » 新闻资讯 » 小程序相关 >

小程序介绍

发表时间:2020-10-5

发布人:葵宇科技

浏览次数:35

1. 小程序介绍

微信小程序,简称小程序,英文名 Mini Program ,是一种不需要下载安装即可使用的应用,它实现
了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用
在这里插入图片描述

1.1 为什么是微信小程序?

  1. 微信有海量用户,而且粘性很高,在微信里开发产品更容易触达用户;
  2. 推广app 或公众号的成本太高。
  3. 小程序开发适配成本低。
  4. 小程序容易小规模试错,然后快速迭代。
  5. 小程序跨平台。

1.2 微信小程序历史

  1. 2016年1月11日,微信之父张小龙时隔多年的公开亮相,解读了微信的四大价值观。张小龙指出,
    越来越多产品通过公众号来做,因为这里开发、获取用户和传播成本更低。拆分出来的服务号并没
    有提供更好的服务,所以微信内部正在研究新的形态,叫微信小程序 需要注意的是,之前是叫
    应用号
  2. 2016年9月21日,微信小程序正式开启内测。在微信生态下,触手可及、用完即走的微信小程序引
    起广泛关注。腾讯云正式上线微信小程序解决方案,提供小程序在云端服务器的技术方案。
  3. 2017年1月9日,微信推出的“小程序”正式上线。“小程序”是一种无需安装,即可使用的手
    机“应用”。不需要像往常一样下载App,用户在微信中“用完即走”。

1.3 疯狂的微信小程序

  1. 微信月活已经达到10.82亿。其中55岁以上的用户也达到6300万
  2. 信息传达数达到450亿,较去年增长18%;视频通话4.1亿次,增长100%
  3. 小程序覆盖超过200+行业,交易额增长超过6倍,服务1000亿+人次,创造出了5000亿+的商业价值

1.4 还有其他的小程序不容忽视

  1. 支付宝小程序
  2. 百度小程序
  3. QQ小程序
  4. 今日头条 + 抖音小程序

2. 环境准备

开发微信?程序之前,必须要准备好相应的环境

2.1 注册账号

  1. 建议使用全新的邮箱,没有注册过其他小程序或者公众号的。
  2. 访问注册页面,耐心完成注册即可。

2.2 获取APPID

  1. 由于后期调用微信小程序的接口等功能,需要索取开发者的小程序中的 APPID ,所以在注册成功后,
    可登录,然后获取APPID。
  2. 登录,成功后可看到如下界面,然后复制你的APPID,悄悄的保存起来,不要给别人看到😄。
    在这里插入图片描述
    在这里插入图片描述

2.3 开发工具

  1. 下载地址:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
  2. 微信小程序自带开发者工具,集开发、预览、调试、发布 于一身的 完整环境。
  3. 但是由于编码的体验不算好,因此 建议使用 VsCode + 微信小程序编辑工具 来实现编码,
    VsCode负责敲代码, 微信编辑工具负责预览

3. 创建微信小程序

3.1 打开微信开发者工具

  1. 注意 第一次登录的时候 需要扫码登录
    在这里插入图片描述

3.2 新建小程序项目

在这里插入图片描述

3.3 填写项目信息

在这里插入图片描述

3.4 . 成功

在这里插入图片描述

4. 微信开发者工具介绍

  1. 详细的使用,可以查看官网:https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html

在这里插入图片描述

5. 小程序结构目录

  1. 小程序框架的目标是通过尽可能简单、有效的方式让开发者可以在微信中开发具有原生APP的体验的服务。
  2. 小程序框架提供了自己的视图层描述语言 WXMLWXSS ,以及 JavaScript ,并在视图层与逻辑层间提供
    了数据传输和事件系统,让开发者能够专注于数据与逻辑。

5.1 小程序文件结构和传统web对比

在这里插入图片描述

5.2 基本的项目目录

在这里插入图片描述

6. 小程序配置文件

  1. 一个小程序应用程序会包括最基本的两种配置文件。一种是全局的 app.json 和页面自己的 page.json
  2. 注意:配置文件中不能出现注释

6.1 全局配置 app.json

  1. app.json 是当前小程序的全局配置,包括了小程序的所有页面路径、界眠表现、网络超时时间、底
    部 tab 等。普通快速启动项??边的 app.json 配置
    在这里插入图片描述
  2. pages 字段用于描述当前小程序所有页面路径,这是为了让微信客户端知道当前你的小程序
    页面定义在哪个目录。
  3. window 字段定义小程序所有页面的顶部背景颜色,文字颜色定义等。
  4. 完整的配置信息请参考 app.json配置
  5. tabbar
    在这里插入图片描述

6.2 页面配置 page.json

  1. 这里的 page.json 其实用来表页面目录下的 page.json 这类和小程序页面相关的配置。
  2. 开发者可以独立定义每个页面的一些属性,如顶部颜色、是否允许下拉刷新等等。
  3. 页面的配置只能设置 app.json 中部分 window 配置项的内容,页面中配置项会覆盖 app.json
    window 中相同的配置项。 属性名类型默认值描述navigationBarBackgroundColorHexColor#000000导航栏背景颜色,如 #000000navigationBarTextStyleStringwhite导航栏标题颜色,仅支持 black / whitenavigationBarTitleTextString导航栏标题?字内容backgroundColorHexColor#ffffff窗口的背景色backgroundTextStyleStringdark下拉 loading 的样式,仅支持 dark / lightenablePullDownRefreshBooleanfalse是否全局开启下拉刷新。 详情 Page.onPullDownRefreshonReachBottomDistanceNumber50页面上拉触底事件触发时距页面底部距离,单位为px。 详情 Page.onReachBottomdisableScrollBooleanfalse设置为 true 则页面整体不能上下滚动;只在页面配置中有效,无法在 app.json 中设置该项

6.3 sitemap 配置-了解即可

  1. 小程序根目录下的 sitemap.json 文件用于配置小程序及其页面是否允许被微信索引。

相关案例查看更多