微信小程序开发与应用 第一章 微信小程序的基本知识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


结语


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


相关文章
|
消息中间件 人工智能 Java
抖音微信爆款小游戏大全:免费休闲/竞技/益智/PHP+Java全筏开源开发
本文基于2025年最新行业数据,深入解析抖音/微信爆款小游戏的开发逻辑,重点讲解PHP+Java双引擎架构实战,涵盖技术选型、架构设计、性能优化与开源生态,提供完整开源工具链,助力开发者从理论到落地打造高留存、高并发的小游戏产品。
|
小程序 前端开发 Android开发
小程序微信分享功能如何开发?开放平台已绑定仍不能使用的问题?-优雅草卓伊凡
小程序微信分享功能如何开发?开放平台已绑定仍不能使用的问题?-优雅草卓伊凡
2851 29
小程序微信分享功能如何开发?开放平台已绑定仍不能使用的问题?-优雅草卓伊凡
|
小程序 JavaScript API
uni-halo + 微信小程序开发实录:我的第一个作品诞生记
这篇文章介绍了使用uni-halo框架进行微信小程序开发的过程,包括选择该框架的原因、开发目标以及项目配置和部署的步骤。
724 0
uni-halo + 微信小程序开发实录:我的第一个作品诞生记
|
小程序 Java 关系型数据库
weixin163基于微信小程序的校园二手交易平台系统设计与开发ssm(文档+源码)_kaic
本文介绍了一款基于微信小程序的校园二手物品交易平台的开发与实现。该平台采用Java语言开发服务端,使用MySQL数据库进行数据存储,前端以微信小程序为载体,支持管理员和学生两种角色操作。管理员可管理用户、商品分类及信息、交易记录等,而学生则能注册登录、发布购买商品、参与交流论坛等。系统设计注重交互性和安全性,通过SSM框架优化开发流程,确保高效稳定运行,满足用户便捷交易的需求,推动校园资源共享与循环利用。
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
613 1
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
小程序 前端开发 JavaScript
在线课堂+工具组件小程序uniapp移动端源码
在线课堂+工具组件小程序uniapp移动端源码
558 0
在线课堂+工具组件小程序uniapp移动端源码
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
5602 3
|
移动开发 小程序
thinkphp+uniapp开发的多端商城系统源码/H5/小程序/APP支持DIY模板直播分销
thinkphp+uniapp开发的多端商城系统源码/H5/小程序/APP支持DIY模板直播分销
1054 0
|
小程序 API
微信小程序更新提醒uniapp
在小程序开发中,版本更新至关重要。本方案利用 `uni-app` 的 `uni.getUpdateManager()` API 在启动时检测版本更新,提示用户并提供立即更新选项,自动下载更新内容,并在更新完成后重启小程序以应用新版本。适用于微信小程序,确保用户始终使用最新版本。以下是实现步骤: ### 实现步骤 1. **创建更新方法**:在 `App.vue` 中创建 `updateApp` 方法用于检查小程序是否有新版本。 2. **测试**:添加编译模式并选择成功状态进行模拟测试。
1099 0
微信小程序更新提醒uniapp
|
小程序 前端开发 JavaScript
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序
【避坑宝】是一款企业黑红名单吐槽小程序,旨在帮助打工人群体辨别企业优劣。该平台采用SpringBoot+MybatisPlus+uniapp+uview2等技术栈构建,具备丰富的注释与简洁的代码结构,非常适合实战练习与学习。通过小程序搜索“避坑宝”即可体验。
731 0
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序

热门文章

最新文章