安装微信小程序开发者工具,创建小程序,了解项目目录结构

#创作灵感#

最近公司有一个微信小程序需要开发,老板让我学习前端,前端嘛,一般就是html+css+js。然后我就直接学习js了,但是感觉前端这些知识我知道也会用,就想直接上手写小程序。搜集了一些资料,然后下载微信开发者工具,打开后我真的无从下手,感觉那些代码熟悉又陌生,跟着一些博主写功能,可能给的代码不全吧,反正我没实现想要的功能,还无法解决报错问题。这篇文章主要是开发之前的一些基本认识,为后期开发做铺垫。

小程序账号 + 微信开发者工具 + 前端代码 + 后端数据 = 微信小程序

小程序前端开发主要使用WXML、WXSS以及JavaScript这三种语言和技术。(wxml类似于html,wxss类似于css,又不太同)

小程序开发文档:https://developers.weixin.qq.com/miniprogram/dev/framework/

1、访问网址,安装工具

微信开发者工具:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

2、安装后,扫码登录

3、创建小程序

点击"确定",

4、项目目录结构

微信小程序目录结构:https://developers.weixin.qq.com/miniprogram/dev/framework/structure.html

5、新建页面步骤

(1)新建文件夹

  1. 哪个page在最上面,默认显示哪页
  2. json要求严格语法,不能有多余的注释和逗号

(2)新建页面

右键"新建Page",

右边打开的app.json文件,目前显示的首页是index页面(第一个路径就是首页)

相关推荐
V+zmm101342 小时前
教育培训微信小程序ssm+论文源码调试讲解
java·数据库·微信小程序·小程序·毕业设计
樊南2 小时前
【esp32-uniapp小程序】uniapp小程序篇02——Hbuilder利用git连接远程仓库
git·小程序·gitee·uni-app·hbuilder·torisegit
寰宇软件3 小时前
PHP校园助手系统小程序
小程序·vue·php·uniapp
陈钇钇4 小时前
持续升级《在线写python》小程序的功能,文章页增加一键复制功能,并自动去掉html标签
python·小程序·html
计算机-秋大田4 小时前
基于SSM的家庭记账本小程序设计与实现(LW+源码+讲解)
java·前端·后端·微信小程序·小程序·课程设计
大叔_爱编程5 小时前
wx036基于springboot+vue+uniapp的校园快递平台小程序
vue.js·spring boot·小程序·uni-app·毕业设计·源码·课程设计
van叶~9 小时前
Linux探秘坊-------4.进度条小程序
linux·运维·小程序
大叔_爱编程13 小时前
wx030基于springboot+vue+uniapp的养老院系统小程序
vue.js·spring boot·小程序·uni-app·毕业设计·源码·课程设计
计算机学姐15 小时前
基于微信小程序的驾校预约小程序
java·vue.js·spring boot·后端·spring·微信小程序·小程序
互联网资讯19 小时前
详解共享WiFi小程序怎么弄!
大数据·运维·网络·人工智能·小程序·生活