【小程序】注册安装及创建小程序---入门级别必读

简介: 【小程序】注册安装及创建小程序---入门级别必读

一,小程序入门

1.1 什么是小程序?

  1. 2017年度百度百科十大热词之一
  2. 微信小程序(wei xin xiao cheng xu),简称小程序,英文名Mini Program,是一种不需要下载安装即可使用的应用( 张小龙对其的定义是无需安装,用完即走,实际上是需要安装的,只不过小程序的体积特别小, 下载速度很快,用户感觉不到下载的过程 )
  3. 限制:同一个分包中的页面享有共同的预下载大小限额 2M,限额会在工具中打包时校验
  4. 2017年1月9日0点,万众瞩目的微信第一批小程序正式低调上线

1.2 小程序可以干什么?

  1. 同App进行互补,提供同app类似的功能,比app操作更加简洁的轻应用
  2. 通过扫一扫或者在微信搜索即可下载
  3. 用户使用频率不高,但又不得不用的功能软件,目前看来小程序是首选
  4. 连接线上线下
  5. 开发门槛低, 成本低

二,安装小程序

2.1 申请帐号

官网下载微信小程序====》》微信公众平台

进入小程序注册页 根据指引填写信息和提交相应的资料,就可以拥有自己的小程序帐号

注意:在注册微信小程序的时候,该微信要绑定银行卡....会有提示的

在这个小程序管理平台,你可以管理你的小程序的权限,查看数据报表,发布小程序等操作。

 

登录 小程序后台 ,我们可以在菜单 “开发”-“开发管理” 看到小程序的 AppID 了 。

小程序的 AppID 相当于小程序平台的一个身份证,后续你会在很多地方要用到 AppID (注意这里要区别于服务号或订阅号的 AppID)

有了小程序帐号之后,我们需要一个工具来开发小程序

2.1 安装开发工具

前往 开发者工具下载页面 ,根据自己的操作系统下载对应的安装包进行安装,有关开发者工具更详细的介绍可以查看 《开发者工具介绍》

根据自己的需求下载相对应的版本,下载完毕之后,在下载目录下双击启动

启动之后并是安装,在安装期间自定义一个非中文文件夹,将小程序安装到此文件夹中

安装完毕之后,桌面会出现一个小图标(看下图)

双击打开,左上角会出现一个二维码,用刚刚注册的微信小程序的账户扫描登陆,要不然后续会出现问题

三、创建第一个微信小程序

扫描登陆进来以后,点击左边的大加号即可创建小程序项目

选择该小程序项目的存储路径,将注册的小程序ApplD复制过来粘贴即可。后面的选择根据自己的需求来即可

这里微信小程序开发之所以成本低,还有一个原因是它把模板都给我们提供了,我们只需要提供数据即可完成一个零基础的手机端电商项目

至此,我们的第一个微信小程序就做好了!!

四、微信小程序目录结构

pages目录:这个目录下放的其实就是一个个的微信端的页面了其中的index文件夹、logs文件夹其实都是单独的页面

再以index文件夹举例说——下属4个不同后缀文件:

(1)js:就是页面内的js文件,页面中的变量、监听事件全都在这里;

(2)json:页面的配置文件,其实就类似后端的配置文件,就看成 properties或者xml就好

(3)wxml:页面的结构文件,查看可以发现就是各种标签组成的结构块;

(4)wxss:页面的样式文件,看着里面都是选择器

2、utils目录:这里面存的都是一些公用的js,就当作web后端项目的工具类就好啦,提供公共方法减少冗余和维护难度的;

3、app.js文件:整个微信小程序相关的全局js,这里有监听整个小程序的生命周期函数和全局变量;

4、app.json文件:是对整个小程序的静态全局配置,我们可以在这个文件中配置小程序是由哪些页面组成(路由),配置小程序的窗口背景色、配置导航条样式,配置默认标题,可以配置整个项目的样式,超时时间,加载的插件等等;(注意该文件不可添加任何注释);

5、app.wxss文件:整个小程序的样式文件,我个人认为这个文件就是设置整个项目的css文件。针对每个页面的css文件的内容不同,加载到对应页面的css样式时,当前页面的wxss文件会覆盖app.wxss文件(估计跟普通的css样式的覆盖规则类似)。

6、project.config.json文件: 这个其实是每个开发者工具生成的项目都有的,但和项目内容实际没有特别大关联,主要是记录相关工具的配置的,在工具上做的任何配置都会写入到这个文件,当重新安装工具或者换电脑工作时,只要载入同一个项目的代码包,开发者工具就自动会帮你恢复到当时你开发项目时的个性化配置,其中会包括编辑器的颜色、代码上传时自动压缩等等一系列选项。

7、sitemap.json文件: 这个可以配置是否允许被微信索引,具体看微信官方文档-sitemap 配置

目录
相关文章
|
2月前
|
存储 JSON 小程序
微信小程序入门之新建并认识小程序结构
微信小程序入门之新建并认识小程序结构
53 1
|
3月前
|
JSON 小程序 前端开发
创建一个属于自己的小程序(注册开发账号)
介绍如何创建微信小程序账号,包括注册流程、下载安装微信开发者工具、创建项目以及项目结构介绍。
创建一个属于自己的小程序(注册开发账号)
|
2月前
|
XML 小程序 JavaScript
小程序入门之项目配置说明和数据绑定
小程序入门之项目配置说明和数据绑定
41 1
|
3月前
|
小程序 JavaScript 前端开发
微信小程序安装和使用 Vant Weapp 组件库
本文介绍了如何在微信小程序中安装和使用Vant Weapp组件库,包括通过npm安装、构建npm、修改配置文件以及在小程序中使用Vant Weapp提供的组件。
微信小程序安装和使用 Vant Weapp 组件库
|
4月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
109 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
2月前
|
小程序
微信小程序的注册流程
微信小程序的注册流程
80 0
|
2月前
|
小程序 前端开发 JavaScript
小程序入门之认识view和text组件
小程序入门之认识view和text组件
81 0
|
4月前
|
小程序 Serverless 开发工具
小程序开发问题之在小程序中安装并初始化小程序Serverless客户端SDK如何解决
小程序开发问题之在小程序中安装并初始化小程序Serverless客户端SDK如何解决
|
4月前
|
小程序 开发者
第一个微信小程序的初始化过程、小程序微信开发平台的下载、如何注册一个微信小程序的账号
这篇文章介绍了微信小程序的初始化过程,包括如何注册微信小程序账号、下载微信小程序开发者平台,并指导了新建小程序的详细步骤。
第一个微信小程序的初始化过程、小程序微信开发平台的下载、如何注册一个微信小程序的账号
|
5月前
|
JSON 小程序 JavaScript
【微信小程序-原生开发】实用教程13 - 新用户注册审核(含页面的下拉刷新)
【微信小程序-原生开发】实用教程13 - 新用户注册审核(含页面的下拉刷新)
61 0