手把手带你入门微信小程序开发(一)

2021-12-09 14:48:08 浏览数 (1)

微信小程序学习—准备工作

代码语言:txt复制
    - [一、前期工作准备](https://cloud.tencent.com/developer)
            - [(1)注册小程序的专属APP ID账号](https://cloud.tencent.com/developer)
            - [(2)开发者工具的下载及基本使用](https://cloud.tencent.com/developer)
    - [二、小程序结构介绍](https://cloud.tencent.com/developer)
        - [2.1 全局设置](https://cloud.tencent.com/developer)
            - [(1)project.config.json 的功能](https://cloud.tencent.com/developer)
            - [(2)app.wxss 的解释](https://cloud.tencent.com/developer)
            - [(3)app.json 的解释](https://cloud.tencent.com/developer)
            - [(4)app.js 的功能](https://cloud.tencent.com/developer)
        - [2.2 页面配置](https://cloud.tencent.com/developer)
            - [pages页面](https://cloud.tencent.com/developer)

关于微信小程序的介绍,我这里也不多说,官方说的很清楚了。我这里就简要的说一下我对微信小程序的印象把,微信小程序就是一个轻量级的应用,自从“ 跳一跳”这个游戏火了以后。小程序也逐渐火热了起来来,所以现在学习小程序,为自己的公众号建立一个专属的小程序,或者开发一款独一无二的游戏小程序呦!!!

一、前期工作准备

(1)注册小程序的专属APP ID账号

1、既然要开发一个小程序,这个小程序如果需要发布出去的话。就需要创建一个APP ID,在微信公众平台创建一个专属自己的小程序(一个账号只能申请一个小程序ID,也就是说,如果你准备发布小程,想再发另外一个,就得再重新用一个邮箱注册)

2、点击小程序,前往注册

填写好相关的信息(我这边已经注册过了,所以会出现红字)

3、注册好了之后,再回到之前的页面,进行登录,在划横线的地方填写你要完成的小程序的基本信息,准备工作就完成了

我解释的比较笼统,这里是官方的解释,非常完整!!!

(PS:这里有官方文档,是学习的最好的资源)

官方对小程序的定位与介绍

(2)开发者工具的下载及基本使用

工欲善其事必先利其器

官方的开发工具的介绍及使用

(1) 下载好,需要微信扫码登录,也就是你创建APP ID时会让你扫的一个二维码绑定,打开是这个样子

(2) 点击加号(新建一个项目)

1.项目名称:我们可以自己随意定义 2.目录:换到一个自己容易找得到的目录 3.初次开发:可以不用登录APP ID,申请测试号,就可以直接登进去了

(3)项目申请好后,这里会有一个基础的样例给我们看

文章编辑于

2019年4月1日23:38:36

这是今天的基础内容,下次就是各种上图中每种脚本语言的介绍

二、小程序结构介绍

有问题随时查阅官方文档!!!

2.1 全局设置
(1)project.config.json 的功能

在这里,你可以修改版本库,小程序的 APP Id之类的信息等等

(2)app.wxss 的解释

我们现在给背景换个颜色

(3)app.json 的解释

这里是配置整个项目配置信息用的,这个和上面的 pages 相对应

在app.json中,这里是属于全局配置项的,这里的信息可以对照官方文档来学习—全局配置

菜单栏:

tabBar

我下面的一排的菜单栏就是根据这个做出来的

(4)app.js 的功能
2.2 页面配置

详情查阅官方文档:微信小程序官方文档 —— 页面配置

pages页面

我这里有三个页面,每个页面都具有不同的功能,第一个index也就是最左边我们能看得到的内容,里面的四个文件对应这不同的功能,比如wxml 就是 html 改变了一些标签,wxss 是 css更改了标签,而且还都增加了一些其他的功能

三、小彩蛋

感觉没看够,这里有 8大练习项目等你:微信小程序之项目实战篇

手把手带你学习微信小程序文章整合:手把手带你学习微信小程序系列文章整合

0 人点赞