Basic Preparation for Mini Program Development
2024-04-21 01:55:02

小程序开发基础准备

学习技术不要光看视频、教材,一定要动手实践。只有实战,技术才会变得简单。小程序相比其他编程语言来说,可以让我们更快做出一些技术产品。

0x01 开始前的准备

小程序的开发有两样东西必不可少,一个是小程序开发的技术文档;还有一个就是小程序的开发者工具

开发者工具小程序开发者工具下载地址

大家可以根据自己电脑的操作系统来下载对应的稳定版安装包进行安装。就和我们写Word、PPT文档要用Office的软件一样,我们要在开发者工具上多多动手,技术才能掌握的更加真切。

技术文档官方小程序技术文档

技术文档大家先只需要花五分钟左右的时间了解大致的结构即可,先按照我们的教学步骤学完之后再来看也不迟。官方的小程序技术文档过于全面而且详细,对于初学者或者零基础的朋友来说,我们会引导大家如何循序渐进的学习文档里的技术知识。

多看技术文档多用开发工具也是我们学习其他编程语言或技术最为重要的两点,凡是脱离技术文档和开发工具看视频、看文章以及搜集再多的资料都是舍本求末的错误做法,而这也是很多初学者的一个通病。

值得注意的是小程序的开发功能更新非常频繁,很多网上的教程内容都比较过时,而只有技术文档才是同步最新的。无论你是初学者还是高手,技术文档都是我们技术开发的基础与落脚点,常读常新。

0x02 注册微信小程序

小程序的注册非常方便,打开小程序注册页面,按照要求填入个人的信息,验证邮箱和手机号,扫描二维码绑定你的微信号即可,3分钟左右的时间即可搞定。

注册页面:小程序注册页面

注册小程序时不能使用注册过微信公众号、微信开放平台的邮箱哦,也就是需要你使用一个其他邮箱才行。

当我们注册成功后,就可以自动登入到小程序的后台管理页面啦,如果你不小心关掉了后台页面,也可以点击小程序后台管理登录页进行登录。

后台管理页:小程序后台管理登录页

小程序和微信公众号的登录页都是同一个页面,他们会根据你的不同的注册邮箱来进行跳转。

进入到小程序的后台管理页后,点击左侧菜单的开发进入设置页,然后再点击开发设置,在开发者ID里就可以看到**AppID(小程序ID)**,这个待会我们有用。

注意小程序的ID(AppID)不是你注册的邮箱和用户名,你需要到后台查看才行哦~

0x03 新建一个模板小程序

安装完开发者工具之后,我们使用微信扫码登录开发者工具,然后使用开发者工具新建一个小程序的项目,

  • 项目名称:这个可以根据自己的需要任意填写,可以是中文;
  • 目录:大家需要先在电脑上新建一个空文件夹,然后选择这个空文件夹;
  • AppID:就是之前我们找到的**AppID(小程序ID)**(也可以点击右边的下拉框,下拉选择AppID)
  • 开发模式为小程序
  • 后端服务选择不使用云服务注意为了教学的需要,先选择不使用云服务
  • 语言为JavaScript

点击新建确认之后就能在开发者工具的模拟器里看到一个简单的Hello World模板小程序,在编辑器里看到这个小程序的源代码。

小任务: 分别点击开发者工具工具栏上的模拟器编辑器调试器,以及下面的手机下拉框、显示百分比,看看有什么效果。找到开发者工具的菜单栏,在项目菜单栏里找到查看所有项目,在设置菜单栏里找到外观设置,切换一下主题、调试器主题(深色、浅色)。

接下来,我们点击开发者工具的工具栏里的预览图标,就会弹出一个二维码,使用你的手机微信扫描这个二维码就能在微信里看到这个小程序啦。以后我们要自己开发一个小程序都可以按照上面的操作新建一个模板小程序,然后在这个的基础上修改开发

如果你没有使用微信登录开发者工具,以及你的微信不是该小程序的开发者是没法预览的哦。这个Hello World模板小程序非常简单,但是它的文件结构却是完整的。

0x04 开通云开发服务

点击微信开发者工具的“云开发”图标,在弹出框里点击“开通”,同意协议后,会弹出创建环境的对话框。这时会要求你输入环境名称环境ID,以及当前云开发的基础环境配额(基础配额免费,而且足够你使用哦)。

建议你环境名称可以使用 xly、环境ID自动生成即可,当你的云开发环境出现问题的时候,你可以提供你的环境ID,云开发团队会有专人为你解答。

按照对话框提示的要求填写完之后,点击创建,会初始化环境,环境初始化成功后会自动弹出云开发控制台,这样我们的云开发服务就开通啦。大家可以花两分钟左右的时间熟悉一下云开发控制台的界面。

Prev
2024-04-21 01:55:02
Next