微信小程序详细教程,两小时零基础注册和使用小程序,并利用Ai引擎真正0代码开发小程序!!!(干货,建议收藏)_微信小程序框架教程-程序员宅基地

技术标签: 经验分享  学习  微信小程序  人工智能  小程序  

准备工作:

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

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

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

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

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

      小程序的前端代码和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

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

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

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/FMgxth/article/details/134670041

智能推荐

千字文-程序员宅基地

文章浏览阅读643次。简介参考“做教练”之硬笔书法, 掌握了基本笔画、偏旁部首后,可以较全面的临写一些古碑帖了。由南朝梁周兴嗣撰写的《千字文》,是一篇使用时间最长、影响最大、流传最广的儿童启蒙读物。它行文流畅、辞藻华丽、内容丰富、气势磅礴。在《千字文》的流传过程中,历代著名书法名家家如智永、怀素、褚遂良、欧阳询、宋徽宗、米芾、赵孟頫、文徵明、王福庵、邓石如等,把《千字文》作为范书写成字帖。他们的作品流传..._五体千字文为什么六种

Axure 9 实战案例,动态面板的应用 2,APP发布界面的键盘交互_axure9 动态面板添加文字-程序员宅基地

文章浏览阅读1.8k次。本次课程我们继续来学习一下,动态面板的应用。前一篇我们讲到了导航栏的背景设计,通过学习如何实现导航栏背景的100%宽度,相信大家已经掌握了一些动态面板的妙用;本篇我们在动态面板的基础上,增加一些其他交互,难度开始提高了哦。那么本篇我们就来讲解一下,如何在APP发布界面实现开关键盘?我们先来看一下完成效果图:大家可以看到,当折叠键盘时,文本域变高、添加位置向下移;当展开键盘时,文本域复原、添加位置复位。下面来给大家讲解一下实现的步骤。..._axure9 动态面板添加文字

HDU 3746 Cyclic Nacklace-程序员宅基地

文章浏览阅读45次。题意:给你几组字符串,每组添加多少个字符能够构成循环.题解:最小循环节,注意讨论的三种情况,题上刚好给了这三种情况(要是不给我这弱鸡又考虑不全了) 1 #include <iostream> 2 #include <cstring> 3 #include <string> 4 #include <algorithm&g...

深度学习基础--正则化与norm--L2归一化、L2正则化、L2范数的区别_norm_l2-程序员宅基地

文章浏览阅读2.9k次。L2归一化、L2正则化、L2范数的区别  1)归一化是将数据变到一定的区间内,故是x除以||x||_2。  2)正则化是在优化时所使用的概念,称为正则化方法,而不是指某种具体的数据运算,概念比归一化要高一层。  3)L2范数指的是公式意义上的||x||_2。..._norm_l2

【杂七杂八】excel中根据RTL信号位宽生成拼接取位_rtl语法 位宽拼接-程序员宅基地

文章浏览阅读398次。前言作为一个不务正业的芯片前端,总会遇到掉奇奇怪怪的需求,就比如题目这个啊,我写完之后就觉得非常的拗口。那么具体的需要是啥呢?就是比如说有了下面这个excel表:信号名 width sig0 3 sig1 10 sig2 14 sig3 20 sig4 8 要直接做一列生成前面几个信号在整体信号中的取位信息,简单来说就是这样:信号名 width local sig0 3 [2:0] sig1 10_rtl语法 位宽拼接

go WaitGroup的坑-程序员宅基地

文章浏览阅读2.3k次。go WaitGroup的使用请参考笔者的另外一篇博客go WaitGroup的使用示例这里重点讲一下WaitGroup的注意点,以免被坑示例代码如下:package mainimport ( "log" "sync")func main() { wg := sync.WaitGroup{} for i := 0; i < 5; i++ { wg.Add(..._waitgroup的坑

随便推点

五种IO模型-程序员宅基地

文章浏览阅读5.9k次,点赞10次,收藏10次。IO,即input/output,IO模型即输入输出模型,而比较常见且听说的便是磁盘IO,网络IO.按照冯诺依曼结构的来看,假设我们把运算器、控制器、存储器三个设备看做一个整体(假设称为中转),那么输入设备、输出设备,和中转就构成一个中转IO,也就是说IO是以某一个核心为的,而涉及计算机核心与其他核心之间的过程我们就成为一个IO._io模型

未来工厂大脑:图扑组态软件在智能制造中的应用-程序员宅基地

文章浏览阅读615次,点赞12次,收藏11次。图扑 HT 先进的组态界面非常适用于实时监控系统的界面呈现,多年来已广泛应用于电信网络拓扑和设备管理,以及工业生产、城市园区、轨道交通、电力能源、仓储物流、化工冶金等工业自动化(HMI/SCADA/MMI)领域,业务涵盖数据展示、态势感知、科学决策等全生命周期监控。图扑的大屏组态、UI 组态、工业组态、三维组态为打造精细化监控策略提供了支持,融合数字建模、数字孪生、仿真模拟、智能物流等技术,轻松构建低代码、零代码物联网 IoT 平台,辅助传统工厂向智能工厂转型。

Java核心技术·卷I(原书第12版)_java核心技术第十二版pdf-程序员宅基地

文章浏览阅读1w次。他是《Java核心技术》两卷本的作者,也是《重要的,第二版》(Addison-Wesley,2018)的Core Java SE 9和《重要的,第二版》(Addison-Wesley,2017)的作者。读者应在充分理解Java语言和Java类库的基础上,灵活应用Java提供的高级特性,包括面向对象编程、反射和代理、接口和内部类、异常处理、泛型编程、集合框架、事件监听器模型、图形用户界面设计和并发。☉第四章介绍了面向对象的两大基石——封装的重要概念,以及Java语言实现封装的机制——类和方法;_java核心技术第十二版pdf

【Gradle】Gradle配置全局阿里云镜像仓库_android studio gradle全局使用阿里云镜像 详细步骤-程序员宅基地

文章浏览阅读2.5k次。一、参考资料Gradle配置阿里云仓库_梁海江的博客-程序员宅基地Gradle的配置操作以及配置阿里云镜像和整合本地Maven仓库 - 简书_android studio gradle全局使用阿里云镜像 详细步骤

Maven手动导入jar包到自己仓库_maven手动导入jar包到仓库-程序员宅基地

文章浏览阅读1k次。1、保证settings.xml文件中的 localRepository 是自己需要引入的仓库。_maven手动导入jar包到仓库

(一)数据科学_聚类 样本外-程序员宅基地

文章浏览阅读419次。数据科学技术1 数据科学概念2 数理统计技术2.1 描述性统计分析2.2 统计推断与统计建模1 数据科学概念数据科学是一个发现、解释数据中的模式并用于解决问题的过程。数据科学可以从数据中获取知识,为行动提出建议的方法、技术和流程,以完成商业或工业上的目标。下图所示流程为数据科学的工作范式。反过来即为建模步骤。数据学是数据科学的基础。数据学研究数据本身,研究数据的各种类型、状态、属性及变化规律;数据科学是为科学研究的数据方法。2 数理统计技术2.1 描述性统计分析2.2 统计推断与统计建模_聚类 样本外