微信小程序开发(一):环境搭建和第一个小程序创建
0 概览:
简介:微信小程序是微信里面的app,16年推出
竞品: 支付宝小程序 ,钉钉,美团,头条,抖音qq小程序
优点:1,在微信里面自由分享,2,不用下载app, 3,能快速的开发,使用微信的api接口
小程序开发和普通网页开发的区别:
1、运行环境不同
网页运行在浏览器环境中; 小程序运行在微信环境中
2、API 不同
由于运行环境的不同,所以小程序中, 无法调用 DOM 和 BOM 的 API
但是,小程序中可以调用微信环境提供的各种 API,例如: 地理定位 、扫码 、支付
3、开发模式不同
网页的开发模式:浏览器 + 代码编辑器
小程序有自己的一套标准开发模式: 申请小程序开发账号 、安装小程序开发者工具 、创建和配置小程序项目
小程序的开发,需要经过申请小程序帐号、安装小程序开发者工具、配置项目等过程方可完成。
1 申请帐号
百度搜索“微信公众号平台” https://mp.weixin.qq.com ,然后扫码登录注册一个微信公众平台账号,账号分类有服务号、订阅号、小程序,我们选择“小程序”。
进入“小程序注册页” https://mp.weixin.qq.com/wxopen/waregister?action=step1 根据指引填写信息和提交相应的资料,就可以拥有自己的小程序帐号, 获取微信小程序开发工具和AppID。
在这个小程序管理平台,我们可以在菜单 “开发”-“开发管理”-“开发设置” 看到小程序的 AppID 了 。 小程序的 AppID 相当于小程序平台的一个身份证,后续你会在很多地方要用到 AppID (注意这里要区别于服务号或订阅号的 AppID)。
有了小程序帐号之后,我们需要一个工具来开发小程序。
2 安装开发工具
前往 开发者工具下载页面 ,https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html ,
根据自己的操作系统下载对应的安装包进行安装,有关开发者工具更详细的介绍可以查看 《开发者工具介绍》 。 https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html
打开小程序开发者工具,用微信扫码登录开发者工具,就可以开发微信小程序啦。
学习使用 微信开发者工具 :
可以在 微信官方文档-小程序 ,学习小程序开发工具的使用、了解各种API接口等
https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html
3 创建项目
3.1 登录页
在登录页,可以使用微信扫码登录开发者工具,开发者工具将使用这个微信帐号的信息进行小程序的开发和调试。
3.2 新建项目
当符合以下条件时,可以在本地创建一个小程序项目
需要一个小程序的 AppID;如没有 AppID,可以选择申请使用测试号。
登录的微信号需要是该 AppID 的开发者;
需要选择一个空目录,或者选择的非空目录下存在 app.json 或者 project.config.json。当选择空目录时,可以选择是否在该目录下生成一个简单的项目。
条件满足后,就可以新建项目。
新建小程序项目,选择代码存放的硬盘路径,填入刚刚申请到的小程序的 AppID,给你的项目起一个好听的名字,勾选 "不使用云服务" (注意: 你要选择一个空的目录才可以创建项目),点击新建,你就得到了你的第一个小程序了,点击顶部菜单编译就可以在微信开发者工具中预览你的第一个小程序。
3.3 导入项目
如果你已经有微信小程序,可以直接导入项目。点击顶部菜单“项目--导入项目”,可以导入已经存在的项目。
接下来我们来预览一下这个小程序的效果。
3.4 编译预览
点击工具上的编译按钮,可以在工具的左侧模拟器界面看到这个小程序的表现,也可以点击预览按钮,通过微信的扫一扫在手机上体验你的小程序。
至此,我们已经学会利用微信开发者工具 新建和导入小程序项目,可以进入小程序开发啦!
参考链接:
小程序管理平台 https://mp.weixin.qq.com/wxamp/home/guide?lang=zh_CN&token=561177314
小程序管理平台-小程序注册页 https://mp.weixin.qq.com/wxopen/waregister?action=step1
小程序管理平台-“开发”-“开发管理”-“开发设置” 看到小程序的 AppID: https://mp.weixin.qq.com/wxamp/devprofile/get_profile?token=1789212155&lang=zh_CN
微信公众平台 https://mp.weixin.qq.com/
微信官方文档-小程序-开发者工具下载页面 https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
微信小程序开发(一):环境搭建和第一个小程序创建相关推荐
- 小程序开发及环境搭建及发布
一.小程序开发及环境搭建 1.下载Hbuild X https://www.dcloud.io/hbuilderx.html 2.下载腾讯开发工具 https://q.qq.com/wiki/tool ...
- 01.微信小程序开发之环境搭建
在开发之前你要有微信开发者工具,下载地址:https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html 这里我要假设大家有已经拿到了 ...
- 微信公众号开发(JAVA)-环境搭建与开发接入
使用JAVA开发微信公众平台(一)--环境搭建与开发接入 一. 初始微信公众平台 微信公众平台,即我们平时所说的"公众号",曾用名"官方平台"."媒体 ...
- 1、微信公众号开发之环境搭建
一.微信开发环境搭建 1.申请一个测试的公众号. 2.用来调式代码的开发环境. 1.1注册测试公众号(为什么要注册测试公众号:因为接口多,适合学习和研究.) 测试公众号的注册地址为:http://mp ...
- 微信公众号开发本地环境搭建
我又来了,这次毕业设计要做微信公众号开发. 了解了一下,一般用PHP语言进行开发.在Windows 平台上一般采取Windows+Apache+MySQL+PHP. 配置起来比较麻烦,采取傻瓜式一键安 ...
- Spring开发环境搭建和第一个示例程序
前言 虽然之前用过Spring,但是今天试着去搭建依然遇到了困难,而且上网找教程,很多写的是在web里使用Spring MVC的示例,官方文档里的getting start一开始就讲原理去了(可能打开 ...
- 《微信公众平台与小程序开发——从零搭建整套系统》——第1章,第1.2节微信公众平台...
本节书摘来自异步社区<微信公众平台与小程序开发--从零搭建整套系统>一书中的第1章,第1.2节微信公众平台,作者 张剑明,更多章节内容可以访问云栖社区"异步社区"公众号 ...
- auto.js id为参数滑动_【Autojs教程】02Autojs PC端开发调试环境搭建
[Autojs教程]02-Autojs PC端开发调试环境搭建 写在前面 本篇教程算是保姆级教程了,希望以此能吸引更多感兴趣的同学学习Autojs,也希望大家能因此碰撞出更多的奇思妙想 关注微信公众号 ...
- VScode/PyCharm+Anaconda+pyQt5的Python工程协同开发(环境搭建及项目配置)
1.背景 之前对python的应用一直停留在写个main函数,写段逻辑,完成一个目的的阶段,不知道读者的学习路线是如何的? 至于python环境的搭建,个人实际上经历了以下几个阶段: ①早期接触时,从 ...
最新文章
- 利用MAC OS X 自带的磁盘工具提取光盘镜像ISO文件
- 51Nod - 2142身份证号排序
- oclick vue 传参 函数_详解Vue计算属性和侦听属性
- 关于“xxx”object is not callable的异常(转)
- mysql 生成 javabean_从MySQL快速生成JavaBean
- iOS开发里面的4个层次
- centos6.2安装jdk7
- Django 缓存、序列化、信号
- Security+ 学习笔记35 配置管理
- [GDAL]3.影像金字塔构建
- 区块链供应链金融应用场景解决方案
- 房屋建筑结构安全自动在线监测系统解决方案
- 网管常用工具GHOST图解说明(转)
- linux 编辑文件出现E45readonly option is set (add! to .....)
- Windows 键盘按键 测试
- 把EXCEL表格导入到MYSQL中_将EXCEL表格中的数据导入mysql数据库表中(两种方法)...
- 打印机服务无法启动的解决办法
- 2022年终总结——从打工到创业的转折
- 子网掩码和prefixlength
- ADO数据库连接中的Persist Security Info参数的作用
热门文章
- substance designer 使用iray渲染置换效果
- STM32CubeMX实战教程(一)——软件入门
- 导弹工厂到摩托车间:制造业如何应用大数据
- 网络直播多人PK计数器,计数工具下载
- 鸡蛋煎的好不好?Mask R-CNN帮你一键识别
- .pro文件生成.sln_VB.NET解决方案和项目文件“ sln”和“ vbproj”
- emplace_back
- http://www.cnblogs.com/hoojo/archive/2011/06/08/2075201.html
- opencv图像显示函数
- Quark-Renderer-----第九篇