微信小程序介绍及创建过程

微信小程序介绍及创建过程

    • 1、微信小程序介绍
      • 1.1.什么是微信小程序 ?
      • 1.2. 微信小程序的历史
    • 2、环境准备
      • 2.1.注册账号
      • 2.2.获取APPID
      • 2.3.开发工具
    • 3、第一个微信小程序
      • 3.1.打开微信开发者工具
      • 3.2.新建小程序项目
      • 3.3.填写项目信息
      • 3.4.成功
    • 4、微信开发者工具介绍
    • 5、小程序结构目录
      • 5.1.小程序文件结构和传统的web对比
      • 5.2.基本项目目录
    • 6、说明

1、微信小程序介绍

微信小程序,简称 小程序,英文名 Mini Program,是一种不需要下载安装即可使用的应用,它实现了应用"触手可及"的梦想,⽤户扫⼀扫或搜⼀下即可打开应⽤。

1.1.什么是微信小程序 ?

1.微信有海量用户,而且粘性很高,在微信里开发产品更容易触达用户;

  • 推广App或公众号的成本太高;
  • 开放适配成本低;
  • 容易小规模试错,然后快速迭代;
  • 跨平台。

1.2. 微信小程序的历史

  • 2016年1⽉11⽇,微信之⽗张⼩⻰时隔多年的公开亮相,解读了微信的四⼤价值观。张⼩⻰指出, 越来越多产品通过公众号来做,因为这⾥开发、获取⽤⼾和传播成本更低。拆分出来的服务号并没 有提供更好的服务,所以微信内部正在研究新的形态,叫 「微信⼩程序」 需要注意的是,之前是叫 做 应⽤号
  • 2016年9⽉21⽇,微信⼩程序正式开启内测。在微信⽣态下,触⼿可及、⽤完即⾛的微信⼩程序引 起⼴泛关注。腾讯云正式上线微信⼩程序解决⽅案,提供⼩程序在云端服务器的技术⽅案。
  • 2017年1⽉9⽇,微信推出的“⼩程序”正式上线。“⼩程序”是⼀种⽆需安装,即可使⽤的⼿ 机“应⽤”。不需要像往常⼀样下载App,⽤⼾在微信中“⽤完即⾛”。

2、环境准备

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

2.1.注册账号

建议使用全新的邮箱,没有注册过其他小程序或者公众号的。访问注册⻚⾯,耐⼼完成注册即可。

2.2.获取APPID

由于后期调⽤微信⼩程序的接⼝等功能,需要索取开发者的⼩程序中的 APPID ,所以在注册成功后, 可登录,然后获取APPID。登录,成功后可看到如下界⾯ 然后复制你的APPID,悄悄的保存起来,不要给别⼈看到。
微信小程序介绍及创建过程_第1张图片
微信小程序介绍及创建过程_第2张图片

2.3.开发工具

下载地址
微信⼩程序⾃带开发者⼯具,集 开发 预览 调试 发布 于⼀⾝的 完整环境。 但是由于编码的体验不算好,因此 建议使⽤ vs code + 微信小程序编辑工具 来实现编码。vs code 负责敲代码,微信编辑工具 负责预览。

3、第一个微信小程序

3.1.打开微信开发者工具

注意 第一次登陆的时候需要扫码登陆
微信小程序介绍及创建过程_第3张图片

3.2.新建小程序项目

微信小程序介绍及创建过程_第4张图片

3.3.填写项目信息

微信小程序介绍及创建过程_第5张图片

3.4.成功

微信小程序介绍及创建过程_第6张图片

4、微信开发者工具介绍

详细信息可以查看官网
微信小程序介绍及创建过程_第7张图片

5、小程序结构目录

小程序框架的⽬标是通过尽可能简单、⾼效的⽅式让开发者可以在微信中开发具有原⽣ APP 体验的服务。
⼩程序框架提供了⾃⼰的视图层描述语⾔ WXML 和 WXSS ,以及 JavaScript ,并在视图层与逻 辑层间提供了数据传输和事件系统,让开发者能够专注于数据与逻辑。

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

结构 传统web 微信小程序
结构 HTML WXML
样式 CSS WXSS
逻辑 JavaScript JavaScript
配置 JSON

通过以上对比得出,传统web是三层结构。而微信小程序是四层结构,多了一层page.json

5.2.基本项目目录

微信小程序介绍及创建过程_第8张图片

6、说明

文章内容为视频零基础玩转微信小程序【黑马程序员】零基础玩转微信小程序。

你可能感兴趣的:(微信小程序,前端)