前言

这几天公司做了一些调整,暂停了移动端,以小程序为主

所以转战一段时间微信小程序开发,这几天会总结一些关于小程序的知识…

项目搭建

1.开发工具

微信配备了自己的小程序开发工具

下载地址:
https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

安装成功后会创建项目需要APPID, 这需要我们去申请小程序开发账号, 申请网址:
https://mp.weixin.qq.com/wxopen/waregister?action=step1

申请成功后在 设置–>开发–>开发设置 可以找到APPID

然后直接创建就好了

2.小程序代码结构

我们创建完项目,在项目外层有四种非常重要的文件:

  • .json 后缀的 JSON 配置文件
  • .wxml 后缀的 WXML 模板文件
  • .wxss 后缀的 WXSS 样式文件
  • .js 后缀的 JS 脚本逻辑文件

下面具体说一下:

(1).app.json
app.json 是当前小程序的全局配置,包括了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等。

(2).wxml模板
从事过网页编程的人知道,网页编程采用的是 HTML + CSS + JS 这样的组合,其中 HTML 是用来描述当前这个页面的结构,CSS 用来描述页面的样子,JS 通常是用来处理这个页面和用户的交互。

(3).wxss
WXSS 具有 CSS 大部分的特性,小程序在 WXSS 也做了一些扩充和修改。

这些全局的配置, 我们在app.json文件中—>pages中添加具体的页面路径

(3).js
负责逻辑交互,一个服务仅仅只有界面展示是不够的,还需要和用户做交互:响应用户的点击、获取用户的位置等等。在小程序里边,我们就通过编写 JS 脚本文件来处理用户的操作。


输入完成后直接保存(ctrl+s),会自动生成对应的路径文件夹与基础的json,wxss等文件

3.运行

(1).直接保存(ctrl+s)就可以运行,左侧就会有对应的预览
(2). 可以点击菜单中的真机调试, 可以扫码真机调试与自动真机调试

今天就讲到这里,希望对大家有所帮助…

大家可以关注我的微信公众号:「秦子帅」一个有质量、有态度的公众号!

小程序入门(1)-项目环境搭建相关推荐

  1. 小程序开发特辑—小程序申请及开发环境搭建

      互联网巨头们都热衷于搭建平台,希望能够打造自己的生态,依靠生态公司开发各种各样的应用来满足用户的需求.这其中涉及到两个比较大的问题:一方面巨头的腿需要足够粗,这样生态公司才愿意花时间和精力在这些平 ...

  2. 微信小程序基础之开发环境搭建

    初心-杨瑞超个人博客诚邀您加入qq群(IT-程序猿-技术交流群):757345416 概述 开发小程序的第一步,你需要拥有一个小程序帐号,通过这个帐号你就可以管理你的小程序.跟随这个教程,开始你的小程 ...

  3. 微信小程序团队开发项目环境准备以及版本管理工具的基本使用

    团队开发之开发环境准备以及版本管理 序言 一.导入项目 二.初始化版本管理工具 三.工具的使用 示例环境:win10 + 码云 序言 在微信小程序团队开发项目中,如何使用版本管理工具呢?以下内容可以解 ...

  4. 微信小程序电商实战—环境搭建篇

    本篇文章已同步发布于个人博客 https://qiucode.cn/article/90 可体验 秋码淘好货 微信小程序哦! 1.开发工具下载 可到微信公众号-小程序 下载 https://mp.we ...

  5. 小程序入门学习17--springboot环境配置01

    别问,问就是电脑重装了 啥都没了 [NEXT公开课]微信小程序+SpringBoot 开发新闻资讯应用 1 环境配置 mysql下载与安装 Install/Remove of the Service ...

  6. 小程序入门学习18--springboot环境配置02

    springboot官方中文文档 1 pom.xml配置,第一次配置完成需要下载许多文件 <project xmlns="http://maven.apache.org/POM/4.0 ...

  7. 微信小程序腾讯云环境搭建

    一.需要有微信公众号 这一步不多说了,百度搜索微信公众号注册. 二.申请小程序账号 (下面选自https://mp.weixin.qq.com/debug/wxadoc/dev/quickstart/ ...

  8. 前端学习(2813):小程序开发前的环境搭建

  9. 小程序开发.mpvue.项目构建与运行

    小程序开发.mpvue.项目构建与运行 本文介绍 mpvue 框架的特点以及相关生态,包括在 mpvue 中使用 typescript 和 css 预处理器的相关方法.最后介绍一个最基本 mpvue ...

  10. 【零基础微信小程序入门开发一】小程序介绍及环境搭建

    什么是小程序? 微信小程序,小程序的一种,英文名Wechat Mini Program,是一种不需要下载安装即可使用的应用,它实现了应用"触手可及"的梦想,用户扫一扫或搜一下即可打 ...

最新文章

  1. mysql使用命令提示符创建库表
  2. 易语言---时间操作
  3. 成功解决TypeError: ‘tuple‘ object is not callable
  4. 2017年09月23日普级组 数列
  5. 用铁丝做“电路板”,这波操作你不得不服!
  6. C语言运行时数据结构
  7. 贴纸效果_(新)AE插件:时尚印刷贴纸效果动画帽子眼镜胡须嘴唇图标社交标题库(3001)...
  8. notepad++行首行尾添加字符
  9. 苹果商店近期审核的问题
  10. 远程连接ubuntu中mysql的数据库
  11. mysql 当前时间的一周后_mysql查询当前时间,一天内,一周,一个月内的sql语句...
  12. 计算机一级题库百度云0,全国计算机等级考试一级题库完整.pdf
  13. matlab信源编码,常见无失真信源编码算法及Matlab实现比较(27页)-原创力文档
  14. GD32F103单片机内部FLASH按半字读写驱动
  15. 微信H5开发问题集锦
  16. css radial-gradient绘制渐变背景
  17. dubbo源码分析第七篇一服务暴露第三小节一远程暴露内核剖析
  18. 【转】欧盟物联网研究战略路线图(1)
  19. 企业标志设计主题要素
  20. iOS - CAEmitterlayer粒子发射器

热门文章

  1. mocha + chai
  2. 完美世界CEO萧泓:年轻化战略大有可为
  3. android手机图标 足球球星,C罗梅西最抢眼 足球巨星们都用什么手机
  4. Cython使用及pycharm
  5. C语言算法题:一只小蜜蜂...
  6. android摇一摇跳转界面,android摇一摇随机变图片
  7. 宝塔同时安装苹果cms海洋cms_海洋cms新手入门安装配置教程
  8. 基于java springboot android 安卓记账本源码(毕设)
  9. 走,上高架,看看Momenta“飞轮式L4”的“微操”技巧
  10. 有一定基础的JAVA学习笔记_02(面向对象)