我们为什么要学习小程序,在这个各个行业都进入互联网的时代,我们需要将我们的产品推广出去,而微信作为国内流量巨头,使用微信小程序无疑是借东风,拼多多就是一个很好的例子。
我会用最简单的描述,用玩游戏的心态,带领想学习小程序的新人,又或者想了解小程序开发流程的人群,快速熟悉微信小程序。
当然如果你熟悉html,css,JavaScript会更好,当然不会也没关系
工欲善其事必先利其器,如果你想要玩王者荣耀,我们首先就得下载王者荣耀这个app,同样想要学习微信小程序,我们首先需要下载一个IDE(IDE就是用来开发程序的工具)。而微信专门为开发者设计了一个IDE,它叫做微信开发者工具。那么在我们开始游戏之前,我们先来熟悉一下这个工具吧。
知道了什么是IDE,我们就需要去下载到自己的电脑上。当然,这个开发工具和王者荣耀一样,支持多平台。macos与windows都支持。
下面是进入下载页面的一个界面图
如上面所说,开发的话建议大家选择稳定版。好了我们用Windows系统举例,我们选择Windows64(现在基本很少有人使用32位的电脑了吧)进行下载。
点击下载以后我们得到一个.exe
的安装文件,我们双击安装
双击之后进入一个安装向导,这里我们直接点击下一步,进行安装。
安装成功以后,我们的桌面就出现了这个微信开发者工具这个程序啦。接着我们双击打开
下面这张图是我们第一次打开应用的界面。这个只能使用微信扫码登陆。
在王者荣耀里,我们使用微信登陆成功以后,系统会让我们进行大区选择。如上图这个蓝色框部分,针对于我们开发的不同程序,我们也是需要进行选择的。黄色区域区域是对本地项目进行删除和批量删除的一个功能。
微信小程序工具除了可以开发微信小程序以外,他还可以开发 微信小游戏,公众号,以及分享代码片段。
当然作为微信小程序的开发,目前主要给大家介绍微信小程序。我们选好菜单小程序(游戏大区)以后。我们看右边红色区域的加号,我们点击以后可以新建一个本地微信小程序(创建了一个游戏房间),或者导入一个本地微信小程序。
如上图,我们进入游戏房间的配置。
项目名称: 这个就不说了吧 目录:这个就是在本地一个地方存储自己的项目,为了方便,我们直接存在桌面。AppID:这个我们点击输入框下面哪个,使用测试号。Appid它类似于一个身份证,我们上架的每一个小程序都会有一个唯一的AppId,这个我们后面讲到小程序的上架的时候会在具体讲。 开发模式: 这里当然选择小程序。 后端服务:我们选择不使用云服务。云服务 语言选择:JavaScript
注意在写程序的时候,我们的文件夹命名都需要使用英文字母。
完成以后我们选择新建,游戏排队时间,稍微等待一下。
上图所示,我们已经进入正式进入到小程序的开发界面了。界面大致分为菜单栏,模拟器,编辑器,调试器。
一个好的应用程序,应该兼容绝大部分用户。
微信小程序主要还是移动端上呈现给用户,但是市面上的手机各种各样。仅仅针对于苹果用户人群都有好几种。当然还有魅族,华为,小米等安卓用户。所以在开发的时候,我们需要切换手机分辨率对程序的兼容性进行预览并调试。
下图中红色区域是针对于当前手机机型进行选择,在红色框右边它还支持当前网络的模拟(wifi,2g,3g,4g),手机深色主题与浅色主题的切换。而下面蓝色区域是当前代码编写页面的路径。
编辑器即是我们写代码的地方啦,在后面的章节我们会详细介绍。
下图为调试器区域,当我们编写程序,如果有代码错误的时候,微信开发者工具会给我们一个对应错误的提示。它更有利于我们找到程序错误。
刚才介绍了模拟器,编辑器,调试器。这3个功能区都可以独立成为一个窗口。而下图这3个按钮即可以对它们进行切换。不过个人还是喜欢合并着一起。在有的时候,比如使用2个显示屏的时候,一个显示屏写代码,看界面,一个显示屏看报错信息也是挺棒的。
熟悉一个游戏界面需要一定的时间,当然这样一个开发者工具的话,也是需要我们多多使用。其他的操作我们会在后面用到的时候进行讲解,当然如果你等不及的话,也可以去尝试一下。如下我们先通过手机微信扫码,预览一下我们新创建的微信小程序。
注意:因为目前我们的小程序还没有发布,这只是一个开发版,所以我的这个二维码目前只能我自己扫描。
到这里恭喜你,已经成功升级到LV2。
下一期我将会给大家讲解一下我们创建的小程序,它究竟包含了哪些内容。下一期BOSS:微信小程序修炼之路LV2—项目文件介绍
----技术创作101训练营
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。