微信小程序开发与应用 第一章 微信小程序的基本知识1

简介: 微信小程序开发与应用 第一章 微信小程序的基本知识1

前言


微信小程序,是小程序的一种,英文名Wechat Mini Program,是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用。全面开放申请后,主体类型为企业、政府、媒体、其他组织或个人的开发者,均可申请注册小程序。微信小程序、微信订阅号、微信服务号、微信企业号是并行的体系。

微信小程序是一种不用下载就能使用的应用,也是一项创新,经过将近两年的发展,已经构造了新的微信小程序开发环境和开发者生态。

我们通过微信开发者工具,我们能创建自己的小程序,当我们完成小程序开发者绑定、开发信息配置后,开发者即可下载开发者工具、参考开发文档进行小程序的开发和调试。提交审核和发布完成小程序开发后,提交代码至微信团队审核,审核通过后即可发布(公测期间不能发布)。


一、注册一个小程序账号


1、首先我们在微信公众号平台-小程序里面翻到最下面,这里我们点击前往注册即可,前往注册,输入绑定的邮箱以及密码等等。

1666889066152.jpg

2、完成注册后,重新进入微信公众平台,微信扫码或者使用账号登陆。


附网站链接:https://mp.weixin.qq.com/

1666889132739.jpg


3、在微信上提示登陆后,进入开发-开发管理中即可找到AppID,即小程序ID。

1666889143752.jpg

4、然后我们在微信公众平台寻找下载微信开发者工具,并选择下载稳定版。


附网站链接:

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

1666889163248.jpg


二、第一个微信小程序“Hello Wechat!”


(一)准备工作


1、打开微信开发者工具,提示用微信扫一扫登陆。

1666889190887.jpg

2、进入页面我们点击“+”,开始创建一个小程序。

1666889202396.jpg

3、此时会弹出小程序的项目名称以及目录,然后我们可以使用之前所创建的小程序ID或者使用测试号登陆,选择开发模式、后端服务以及语言后点击就绪。

1666889211313.jpg


(二)页面介绍


1、进入界面,我们看到左上方有四个矩形,分别是模拟器、编辑器、调试器以及可视化,前三个分别对应下面的手机页面、中间的编辑器以及下方的调试窗口。

1666889226850.jpg

2、另外我们要知道微信小程序页面是由四个文件组成的,即由.js、.json、.wxml、.wxss文件构成,其中

(1).js文件是页面逻辑文件,主要包含逻辑代码;

(2).json文件是页面配置文件,即每一个小程序页面都可以使用 .json 文件来对本页面的窗口表现进行配置;

(3).wxml文件是页面描述文件;

(4).wxss文件是样式表文件,用来渲染页面。

1666889285698.jpg


(三)代码编写及编译预览


1、我们点击index目录下的index.wxml,它会默认生成一些内容。

1666889300583.jpg

2、将无关紧要的删除后,我们开始编写一个微信小程序“Hello Wechat!”,输入view后回车,会自动产生一个< /view >,我们在view和< /view >之间输入Hello Wechat!,在点击上方的编译,即可看到左边模拟器显示我们刚刚输入的内容。

1666889313256.jpg

3、当然我们也可以通过编译旁边的预览,二维码预览或者自动预览即可在手机所登陆的微信号上展示。

1666889323321.jpg

1666889333173.jpg


结语


以上就是本次微信小程序开发的全部内容,感谢您的阅读和支持,若有表述或者代码中的不当之处,望指出!您的指出和建议能给作者带来很大的动力!!!


相关文章
|
2月前
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
550 7
|
2月前
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
668 1
|
27天前
|
存储 缓存 开发框架
提高微信小程序的应用速度
【10月更文挑战第21天】提高微信小程序的应用速度需要从多个方面入手,综合运用各种优化手段。通过不断地优化和改进,能够显著提升小程序的性能,为用户带来更流畅、更高效的使用体验。
47 3
|
2月前
|
JavaScript 小程序 开发者
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
uni-app开发实战:利用Vue混入(mixin)实现微信小程序全局分享功能,一键发送给朋友、分享到朋友圈、复制链接
375 0
|
2月前
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
249 3
|
2月前
|
小程序 API
微信小程序更新提醒uniapp
在小程序开发中,版本更新至关重要。本方案利用 `uni-app` 的 `uni.getUpdateManager()` API 在启动时检测版本更新,提示用户并提供立即更新选项,自动下载更新内容,并在更新完成后重启小程序以应用新版本。适用于微信小程序,确保用户始终使用最新版本。以下是实现步骤: ### 实现步骤 1. **创建更新方法**:在 `App.vue` 中创建 `updateApp` 方法用于检查小程序是否有新版本。 2. **测试**:添加编译模式并选择成功状态进行模拟测试。
52 0
微信小程序更新提醒uniapp
|
4月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
109 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
4月前
|
小程序 前端开发 JavaScript
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序
【避坑宝】是一款企业黑红名单吐槽小程序,旨在帮助打工人群体辨别企业优劣。该平台采用SpringBoot+MybatisPlus+uniapp+uview2等技术栈构建,具备丰富的注释与简洁的代码结构,非常适合实战练习与学习。通过小程序搜索“避坑宝”即可体验。
105 0
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序
|
4月前
|
存储 小程序 JavaScript
|
5月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的汉服交易小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的汉服交易小程序的详细设计和实现(源码+lw+部署文档+讲解等)
63 7
下一篇
无影云桌面