微信小程序详细教程，两小时零基础注册和使用小程序，并利用Ai引擎真正0代码开发小程序！！！(干货，建议收藏)

已于 2023-11-29 09:49:43 修改
阅读量3.3k 收藏 51
点赞数 31
文章标签： 小程序 微信小程序 人工智能 经验分享 学习
于 2023-11-28 16:53:08 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/FMgxth/article/details/134670041
版权

准备工作：

  • 一台电脑
  • 下载并安装微信开发者工具
  • 一个微信扫码登录

        随着科技的飞速发展和互联网的普及，微信作为一款社交媒体平台，已经渗透到我们日常生活的方方面面。无论是老年人还是年轻人，无论是城市还是农村，微信的用户群体已经覆盖了各个年龄段和各个社会阶层。它不仅仅是一个社交工具，更是一个综合性的生活服务平台，提供了支付、购物、娱乐、学习等多种服务。

       微信小程序作为微信平台的一个重要组成部分，也随着微信的普及而得到了广泛的关注和应用。小程序的开发和维护已经成为一个热门的技术领域，吸引了大量的开发者和企业的投入。通过微信小程序，用户可以方便地获取各种服务，而无需下载安装额外的应用。这种便捷性使得微信小程序在短时间内得到了迅速的推广和应用。

       随着微信小程序市场的不断扩大和完善，开发微信小程序已经不再仅仅是技术人员的专利。越来越多的企业和个人也开始投入到微信小程序的开发中，通过小程序提供各种创新的服务和功能。这不仅推动了微信生态系统的繁荣和发展，也为广大用户带来了更多元化、个性化的选择。

       微信以及微信小程序的普及和应用，已经改变了我们的生活方式。无论是衣食住行还是娱乐消遣，微信及其小程序都为我们提供了极大的便利和丰富的选择。未来随着技术的不断进步和社会需求的变化，微信小程序的开发和应用将会继续扩大和完善，为人们的生活带来更多的惊喜和便利。

      小程序的前端代码和web是极其相似的，wxml和html、wxss和css以及js，现在还经常将wxss读作css。如果你有一定的web开发基础，对开发小程序很有帮助，当然如果你是零基础，那么也有零基础开发小程序的办法。

一.如何注册小程序

第一步：登录微信公众平台，单击右上角的“立即注册”，开始注册。

微信公众平台 (qq.com)

第二步：在注册类型这里，选择注册“小程序”。

第三步：进入账号资料填写页面，填写绑定邮箱和密码，点击注册。

请填写未注册过公众平台、开放平台、企业号、未绑定个人号的邮箱。而且每个邮箱只能申请一个小程序。

第四步：激活邮箱，登录邮箱，查收激活邮件，点击激活链接。

第五步：填写主体信息，确认主体类型。完善主体信息和管理员信息。

第六步：认证

企业个人为主体的小程序只需要在表单中填写资料完成验证，就可以直接注册小程序。注意：个人小程序没有支付功能。

企业类型帐号可选择两种主体验证方式。

方式一：支付验证需要用公司的对公账户向腾讯公司打款来验证主体身份，打款信息在提交主体信息后可以查看到。请根据页面提示，向指定的收款帐号汇入指定金额。温馨提示：请在10天内完成汇款，否则将注册失败。

方式二：微信认证通过微信认证验证主体身份，需支付300元认证费。认证通过前，小程序部分功能暂无法使用。

第七步：填写管理员信息。

注意事项：主体信息一旦提交，则不可修改。

二.公众号注册小程序方式

还可以通过认证过的公众号直接使用公众号资质快速注册小程序。不用提交资料和交认证费用。

第一步：在微信公众号后台，点击“小程序管理”。

第二步：选择“快速注册并认证小程序”。然后借助公众号资质，绑定小程序管理员，即可完成小程序注册。

使用以上两种方式都可以完成小程序的注册，有认证公众号的适合第二种，没有的选择第一种。资料填写后等待审核，审核完成后小程序就可以使用了。

三.接下来是分享一个适合初学者的实战开发教程

登录 - 第二大学 - 大学生创业培训 - Powered By EduSoho

该教程免费，可以打开该教程参考一步步做，该教程是一个实际的小型项目，跟他做完基本就可以入门了。有信息的展示、发布等功能，可以显示到手机操作。

如果你已经懂一些前端编程（前端开发使用的语言基本是HTML5 + CSS + JavaScript）知识，那么可以在上述教程代码的基础上，可以自己参照官方文档开发其他项目也是足够的

安装微信开发者工具——创建小程序项目——开发！

微信小程序开发文档

打开微信开发者工具，新建一个项目，选用测试号自动填充appid，选择js-基础模板

接着把这三个文件里面的代码内容都清空一下

接下来，就是到写代码的环节了，我们让Ai来帮我们写。Ai引擎特别多，这里用百度的文心一言Ai引擎

因为不用爬出去，大家都省事

先让Ai简单写一个显示当前的时间的代码：

动图封面

Ai生成的代码

以下是一个显示当前时间的微信小程序的页面，采用了高端大气的设计风格：

<view class="container">  
  <text class="time">{{currentTime}}</text>  
</view>

在上面的代码中，我们使用了 view 组件来包裹文本，以形成一个容器。文本使用了 text 组件来显示当前时间。通过使用双花括号 {{}} 语法，我们可以将数据绑定到页面上。在这个例子中，我们将 currentTime 绑定到文本中，以显示当前时间。

接下来，我们需要在对应的 JavaScript 文件中定义 currentTime 数据。可以使用 Date 对象来获取当前时间，并将其转换为字符串格式。以下是一个示例：

Page({  
  data: {  
    currentTime: ''  
  },  
  onLoad: function () {  
    var currentTime = new Date().toLocaleString();  
    this.setData({  
      currentTime: currentTime  
    });  
  }  
})
在上面的代码中，我们首先定义了一个空的 currentTime 数据。然后，在 onLoad 方法中，我们获取当前时间并将其转换为本地字符串格式。最后，我们使用 setData 方法将 currentTime 数据更新为获取到的当前时间。

最后，我们可以为页面添加一些样式来提升整体视觉效果。以下是一个示例样式：

.container {  
  font-size: 36px;  
  font-weight: bold;  
  text-align: center;  
  padding: 20px;  
  background-color: #000000;  
  color: #ffffff;  
}
在上面的样式中，我们为容器设置了较大的字体、粗体、居中对齐的样式，并添加了黑色背景和白色文本颜色。可以根据个人喜好和设计风格进行调整。

可以看到，Ai已经帮我们把js逻辑，css样式，界面这些都写好了。

我们只需要复制这些代码到微信开发者工具对应的文件上，就能真实的看效果了

可以看到左边的预览区，已经显示出当前的时间了

看到这里，是不是觉得很简单呢！！！

发挥你的想象力，动手操作一下吧


四.小程序的一些资源分享

UI组件

开发框架

实用库

开发工具

服务端

其他

Demo

 部分素材资源来自网络，如有侵权请联系我 

 后续会持续分享一下经验，欢迎点赞收藏和关注。

小董技术派
关注
  • 31
    点赞
  • 踩
  • 51
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ChatGPT智能AI机器人微信小程序源码-带部署教程
05-10
最近ChatGPT智能AI聊天突然爆火了 ChatGPT 是 OpenAI 开发的一款专门从事对话的人工智能聊天机器人原型。 聊天机器人是一种大型语言模型，采用监督学习和强化学习技术。 ChatGPT 于 2022 年 11 月推出，尽管其回答事实的准确性受到批评，但因其详细和清晰的回复而受到关注。 ChatGPT 使用监督学习和强化学习在 GPT-3.5 之上进行了微调和升级。 ChatGPT的相关模型是OpenAI与微软合作在其 Azure 超级计算基础设施上进行训练的。 ChatGPT 的训练数据包括手册页、互联网现象和编程语言的知识，例如公告板系统和 Python 编程语言。 今天就给大家带来一款小程序版本的程序 包含前后端安装比较简单的其实 PS:api需要用户自行注册获取哈
AI智能识别微信小程序源码
12-27
AI智能识别微信小程序源码带流量主功能。基于腾讯云ocr识别接口做的识别工具(自动识别图片、证件、车牌、身份证等)。 AI智能识别微信小程序源码带流量主功能。基于腾讯云ocr识别接口做的识别工具(自动识别图片、证件、车牌、身份证等)。 AI智能识别微信小程序源码带流量主功能。基于腾讯云ocr识别接口做的识别工具(自动识别图片、证件、车牌、身份证等)。 AI智能识别微信小程序源码带流量主功能。基于腾讯云ocr识别接口做的识别工具(自动识别图片、证件、车牌、身份证等)。 AI智能识别微信小程序源码带流量主功能。基于腾讯云ocr识别接口做的识别工具(自动识别图片、证件、车牌、身份证等)。 AI智能识别微信小程序源码带流量主功能。基于腾讯云ocr识别接口做的识别工具(自动识别图片、证件、车牌、身份证等)。 AI智能识别微信小程序源码带流量主功能。基于腾讯云ocr识别接口做的识别工具(自动识别图片、证件、车牌、身份证等)。 AI智能识别微信小程序源码带流量主功能。基于腾讯云ocr识别接口做的识别工具(自动识别图片、证件、车牌、身份证等)。 AI智能识别微信小程序源码带流量主功能。基于腾讯云ocr
微信小程序开发教程
最新发布
枫林残忆
06-13 1139
尚硅谷微信小程序开发教程，2024最新版微信小程序项目实战！ 一、小程序基础 1. 初始小程序 微信小程序是一种运行在微信内部的 轻量级 应用程序。 使用小程序时 不需要下载，用户 扫一扫 或 搜一下 即可打开应用，它也体现了 “用完即走” 的理念，用户不用关心太多应用的问题，它实现了应用“触手可及”的梦想，应用无处不在，随时可用，但又 无需安装卸载。 使用 App 过程：王者荣耀 → 应用商店 → 下载 + 安装 → 5 v 5 → 卸载… 使用小程序过程：羊了个羊 → 扫、搜 → 直接使用 → 关掉…
微信小程序开发（超详细保姆式教程）
热门推荐
m0_64875238的博客
11-10 34万+
微信小程序开发（超详细保姆式教程）
微信小程序开发【从0到1~入门篇】
m0_63300795的博客
12-10 3万+
1.1 什么是小程序？1.2 小程序可以干什么？同App进行互补，提供同app类似的功能，比app操作更加简洁的轻应用通过扫一扫或者在微信搜索即可下载用户使用频率不高，但又不得不用的功能软件，目前看来小程序是首选连接线上线下。
微信小程序入门教程
DZQ1223的博客
07-02 1657
要学习制作微信小程序，首先要先了解微信公众平台和微信开放文档！微信公众平台：微信公众平台是我们进行小程序注册、小程序管理、小程序发布等操作平台，相当于我们小程序的一个控制平台。在这里面我们还可以看到我们小程序的运营情况，例如：插件更新情况、用户访问情况等。一些需要权限的功能我们也是在这个平台进行申请的，例如：微信支付、微信搜一搜等等。微信开放文档：微信开放平台就是我们的一个开发文档。里面包含小程序制作指南、框架、组件、API等，是我们开发过程中很好的帮助文档。
AI人工智能小程序系统开发
mykj1551的博客
03-13 1286
人工智能 AI绘画 AI智能自动回复
微信小程序入门教程 --（保姆级）
叶子的博客
11-14 7311
小程序入门保姆级教程
微信小程序点餐系统微信小程序开发期末大作业+源代码+文档说明+详细注释，简单部署
04-22
微信小程序 云开发 本项目是微信开发者工具里“云开发快速启动模板”后，在此基础上开发 目的是为了学习微信小程序·云开发，达到一个人完成微信小程序前后端。 涉及到微信小程序前后台接口思想，如果你熟悉后台，...
智能AI-图片-视频自动生成微信小程序源码（带前端和后端以及安装教程）.rar
04-10
智能AI-图片-视频自动生成ChatGPT3.5版本微信小程序源码 模块包含：智能AI、免费专区、优惠专区以及我的中心四大模块 主要功能： 1）AI对话 2）英文翻译 3）智能绘图 4）智能图片生成 5）全网视频去水印：支持...
微信小程序中身份证信息识别源代码
05-21
微信小程序中身份证信息识别源代码微信小程序中身份证信息识别源代码微信小程序中身份证信息识别源代码微信小程序中身份证信息识别源代码微信小程序中身份证信息识别源代码微信小程序中身份证信息识别源代码微信小...
五分钟小程序快速接入AI对话能力
m0_74037076的博客
07-03 2735
五分钟在小程序中快速接入AI能力。
【微信小程序开发】开发框架与工具的使用详解
陈橘又青的博客
08-03 2万+
小程序开发框架是一套用于快速构建小程序的开发框架，提供了丰富的组件和API，使得开发者能够快速搭建小程序，并实现丰富的功能。微信小程序开发框架：官方提供的小程序开发框架，使用JavaScript语言进行开发，可运行在微信客户端上；支付宝小程序开发框架：支付宝提供的小程序开发框架，使用JavaScript语言进行开发，可运行在支付宝客户端上；百度智能小程序开发框架：百度提供的小程序开发框架，使用JavaScript语言进行开发，可运行在百度客户端上；字节跳动小程序开发框架。
【小程序教程】零基础微信小程序开发及实例详解
shenchengyv的博客
10-12 7799
利用微信开发者工具制作了一个最基础的小程序“演示的示例”，主要介绍了微信小程序的开发步骤以及主要的过程详解，希望对大家有帮助。
【Web实战】零基础微信小程序逆向（非常详细）从零基础入门到精通，看完这一篇就够了
Python_0011的博客
11-29 5660
作为中国特有的一种程序形态，小程序在我们的日常生活中已经无处不在。腾讯、百度、阿里巴巴、字节跳动、京东等各家互联网大厂都有各自的生态平台，当然，也有快应用这种行业联盟型的生态平台。小程序开发者在开发环节中必须基于以下原则：互不信任原则，不要信任用户提交的数据，包括第三方系统提供的数据，必要的数据校验必须放在后台校验。最小权限原则，代码、模块等只拥有可以完成任务的最小权限，不赋予不必要的权限。禁止明文保存用户敏感数据。
【微信小程序开发零基础入门】——微信小程序入门
Belle_Daisy的博客
03-20 3089
微信小程序学习--初学者入门（超详细）
最全教程：微信小程序开发入门详解
05-09 3万+
笔者由于工作需要，曾经参加过一个微信小程序同 SAP 系统集成的项目，因此从零开始学习了微信小程序的开发知识。这里通过系列文章把自己所学分享出来，希望对相关学习者有所帮助。 步骤1：微信小程序的申请和开发环境的搭建 本步骤主要是微信小程序的注册和开发环境的搭建。 首先我们要在​​微信官方网站​​申请一个属于自己的微信小程序： 点击按钮 ​​前往注册​​。注意我们需要使用一个没有注册过微信小程序或者微信公众号的邮箱。我用的是网易邮箱。注册之后，邮箱会收到一封激活邮件。 激活之后，就可.
AI软件有哪些？知道这10款就够够的了！
l1m0_的博客
08-11 8072
在数字化时代，人工智能（AI）的崛起为各个领域带来了革命性的变革。越来越多的AI软件免费下载涌现，为我们的工作、创造和生活带来了新的可能性。而其中许多软件提供了免费下载，为个人和团队提供了强大的工具，彻底解放了生产力。l1m0_今天就为大家分享非常实用的10款！1.Pixso AI作为国内知名产品设计一体化协作平台，AI软件免费Pixso AI集成白板、原型、设计、交付、管理等功能，覆盖产品设计全流程。
如何开发微信小程序，后端，前端，小程序端，如何部署到腾讯云托管
GY的的专栏
05-24 9198
我们可以使用微信小程序提供的组件和API来构建小程序的界面和功能。在这一步中，我们需要将前端、后端和小程序端代码打包成一个可执行的文件，并将其上传到腾讯云托管。开发微信小程序是一项非常有趣的任务，它涉及到前端、后端和小程序端的开发。小程序端开发是微信小程序开发的第三步。在这一步中，我们需要使用微信小程序提供的API来调用后端接口，并将数据展示在小程序界面上。1. 尽量使用微信小程序提供的组件和API，以确保小程序的兼容性和稳定性。3. 遵循微信小程序的安全规范，以确保小程序的数据安全和用户隐私。
微信小程序开发流程图
12-14
抱歉，根据提供的引用内容，无法为您提供微信小程序开发流程图。但是，我可以为您提供微信小程序开发的一般流程和步骤： 1. 注册微信小程序账号并登录微信公众平台。 2. 创建小程序并填写相关信息，例如小程序名称、AppID等。 3. 下载并安装微信开发者工具。 4. 在微信开发者工具中创建小程序项目。 5. 编写小程序的前端代码，包括wxml、wxss和js文件。 6. 编写小程序的后端代码，包括服务器端代码和数据库设计等。 7. 调试和测试小程序，确保其正常运行。 8. 提交小程序审核，并等待审核结果。 9. 发布小程序并进行推广。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值