微信小程序的开发步骤以及主要的过程详解
发表时间：2023-12-03 21:29:35
文章来源：炫佑科技
浏览次数：150
菏泽炫佑科技 菏泽炫佑小程序开发 菏泽炫佑app制作 炫佑科技
微信小程序的开发步骤以及主要的过程详解
【相关学习推荐：小程序学习教程】
目前微信小程序的开发步骤以及主要的过程详解，小程序行业已成为互联网营销中的热门黑马之一。 小程序行业依托各大流量平台，拥有天然的用户基础和得天独厚的资源优势。 以其方便快捷的操作和简单流行的模式，仅在短短一年内就出现了爆发式增长。 目前市场上开发一个小程序的成本在几千到几万不等。 以腾讯云为例，一款由腾讯官方团队设计并立即投入运营的小程序，售价为每年680到3680。 复杂的小程序设计先不说，先从*简单的开始说起。
小程序开发有两种方式，一种是定制开发，一种是第三方平台开发。 定制开发的价格比较高，从几万到几十万不等，开发周期长；
第三方平台的开发价格比较低，根据功能的不同，几千块就可以开发出来。 *重要的是开发周期短微信开发聊天小程序，一周左右即可投入运营。
一、微信小程序开发必备技术 1、HTML语言
HTML 是超文本标记语言的缩写。 HTML主要负责网页的骨架。 就像动物的骨骼一样，HTML语言是支撑网页布局的骨骼。
2.CSS
CSS 是层叠样式表的缩写。 它主要负责网页样式，网页内容如何分布，版块背景、颜色等外观问题都可以通过CSS来控制。
三，
JS简称JS，是一种动态脚本语言。 以前js只是一种用于网页交互的脚本语言。 随着v8引擎、React等前端框架的出现，前后端分离的趋势越来越明显。 Node、js等技术的开发也让js在服务器端爆发出了非凡的生命力。 ，成为当前*活跃的语言之一。
4. 服务器语言
如果你不是专业的后端开发，后端可能会很困难，学习曲线会很陡。 不过还是建议开发学习后端语言。 至少需要了解大概的原理框架，能够理解它的代码逻辑。 这样不仅可以实现前后端良好的配合，而且在小程序出现bug的时候也能够使用。 常用的服务器语言有很多，比如PHP、Java、ASP等技术。 建议初学者根据自己的具体需求选择学习。
5. 数据库语言
如果你开发小程序数据量不大，结构也不复杂，那么数据库语言就比较简单。 一般来说，通过学习一些常用命令和常见问题就可以处理。 常用的数据库有免费的MySQL、msSQL等数据库。 如果数据量很大，很容易导致小程序首屏出现白页。 这个时候就必须考虑优化。
注意：在开发软件时，差异是相似的。 每个软件都有自己的特点，语言标准规则也有些不同。 常见的开发工具有：微信开发工具、字节跳动开发工具、文本3。这里我们使用微信开发工具。
二、微信开发工具 1.下载安装
百度“微信公众平台”，选择小程序
在开发工具中选择对应版本下载
建议安装64位稳定版
2、新项目
启动页面填写项目名称、目录、AppID（选择测试号）
这是基本框架
工具自带的启动日志。 下面我们开始了解小程序开发的框架。
3. 方案框架
根目录下有两个文件夹
pages是用来存放页面文件的文件夹；
utils是用来存放公共js的文件夹；
小程序大致分为首页和分页两部分。 首页是登录后显示的**个页面。主页和分页分别占用一个文件夹，都包含在pages文件夹中。 显然，初始化的小程序只有两个页面（主页索引和日志页面日志）
索引中还包含首页界面设计所需的文件（index.js、index.json、index.wxss、index.wxml）
index.js是首页的逻辑文件，类似于js文档；
index.json是首页的配置文件，比如标题词、背景等；
index.wxss是首页的样式表文件，类似于CSS文件；
index.wxml是首页的结构文件，类似于HTML文档。
同样，日志文件logs与index基本类似（如果添加新页面，则需要在pages文件下添加新文件夹）
根目录下的app.js、app.json、app.wxss、..json、.json是小程序的全局设置。
app.js 是项目的入口文件，用于创建应用对象，在启动小程序时首先调用；
app.json是当前小程序的全局变量，包括小程序的页面路径、界面表现、底部标签等；
app.wxss是小程序的公共样式表。 开发可以直接在页面组件的class属性上使用app.wxss中声明的样式规则；
..json 是项目配置文件。 通俗地说，就是一开始开发项目时的个性化配置，其中会包括编辑器的颜色、上传代码时的自动压缩等一系列选项。
.json用于配置小程序及其页面是否允许被微信索引。 文件内容是一个 JSON 对象。 如果没有.json，则默认允许所有页面被索引；
创建项目后，开发工具自动将一些公共代码提取到一个单独的js（utils.js）文件中作为模块； 即utils文件夹用于存放自己封装的工具类函数，是一个共享的。
4.程序调试区
程序调试领域有几种常用的调试模式。
1.
是控制台，可以显示错误信息、打印变量信息等。
2.Wxml
Wxml相当于HTML+CSS。 左侧区域是HTML语言+CSS的一些标签属性，右侧可以轻松设置CSS属性
3.
显示当前项目的所有脚本文件。 微信小程序框架会编译这些脚本文件。
4.
用于显示网络相关信息。 这里没有网络请求。
5.
显示当前项目显示的具体数据，可以在这里编译，实时显示在页面上。
三、项目实战（附核心代码） 1、项目介绍
我使用微信开发工具制作*基本的小程序“太行精灵”（微信上直接搜索）。 其功能仅用于展示，不具有任何商业功能。
