0530-3433334

网站建设 APP开发 小程序

知识

分享你我感悟

您当前位置>首页 >> 知识 >> 小程序

微信小程序的开发是什么样的呢?

发表时间:2023-09-20 13:45:53

文章来源:炫佑科技

浏览次数:121

菏泽炫佑科技 菏泽炫佑小程序开发 菏泽炫佑app制作 炫佑科技

微信小程序的开发是什么样的呢?

同学们大家好,我是小艺。 今天我们来学习微信小程序框架。

微信小程序本质上是一个基于网络技术的应用程序。 和我们平时接触到的前端网页非常相似。 相似之处在于它们使用的开发语言、代码结构和代码运行机制。 但它们也有一些区别。 从*直观的角度来看,网站页面运行在浏览器中,微信小程序运行在微信中。 另外,微信小程序可以与微信紧密结合,使得一些功能的开发更加便捷。 比如获取用户的身份,因为微信账号实际上已经识别了用户的身份,所以只需要检索微信信息就可以轻松知道用户是谁。 此外,还包括手机位置信息、手机存储的使用情况等,借助微信平台微信小程序开发详解,小程序可以实现接近原生APP的操作体验。

我们想要学习微信小程序的开发,首先要了解一般的前端开发是什么样的。

前端开发一般采用HTML+CSS+JS的组合,使用三种开发语言。 那么它们有什么用呢?

假设制作一个网站或者小程序是建造一座房子,那么html就建造了房子的骨架。 通过html我们可以给房子设置一些墙壁、柱子、门窗。 我们将这些称为组件,顾名思义,它们是房子的构建块。 所以在实际的前端中,这些柱子、门窗就是构成一个页面的基本元素,比如图片、链接、输入框、按钮等。 有了这些,就有了页面的框架。

CSS用来装饰和美化房间,就像给墙壁涂上不同的颜色和确定门窗的位置一样,让一切看起来都很顺眼。 在实际的前端中微信小程序的开发是什么样的呢?,就是给每个页面元素添加样式,包括大小、颜色、位置、形状等,通过css,我们的页面就有了漂亮的视觉效果。

js的作用是让门窗移动,给组件添加需要的动态效果,比如响应鼠标点击、动态改变显示数据等功能。

通过html+css+js三部分的配合,*终形成一个完整的前端。 小程序也是如此。 在小程序中,html变成了wxml,css变成了wxss。 这是因为小程序和普通前端在一些语法和用法上存在一些差异,但是它们各自负责的工作以及它们之间的关系没有改变,大家可以举一反三来理解。

同时,微信小程序的框架分为两层,即视图层和逻辑层。 框架的视图层由WXML和WXSS编写,通过组件展示,负责小程序的外观; 逻辑层也称为js,由WXML和WXSS编写。 编写并负责小程序的行为。 因此,我们编写的代码主要分为三个部分:视图层、逻辑层以及它们之间的连接和交互。 这个连接具体就是视图层和逻辑层之间的交互。 逻辑层处理数据并发送给视图层,同时接收视图层的事件反馈。 视图层将逻辑层的数据显示到界面,并将视图层的事件发送到逻辑层。

微信开发小程序开发_微信小程序开发详解_vx小程序开发

我们看一下小程序的项目目录。 在云开发创建的项目中,小程序的前后端代码在一个目录下,即小程序根目录下有四个部分,都是针对云开发环境的。 对于后端代码,竖线后面是云环境的名称,比如这里的test。 这部分代码主要是后端程序员写的,是前端代码。 前端需要编写的代码就放在这个文件夹中。

另外,还会有一个文件和一个开发工具配置文件。 这两个文件是开发工具自动创建并填写的,不需要我们关注。 有兴趣的同学可以自行探索。 下面我们主要关注文件夹。

在一个小程序的前端代码中,即该文件夹下,有四种类型的文件,分别是:.json、.wxml、.wxss、.js。

另外,你还可以在小程序中添加一些图片文件来美化页面,但这不是必须的。 一般来说,我们使用的图片主要是.png和.jpg格式。

小程序前端放置在文件夹中,包括一个描述整个程序的应用程序和多个描述各自页面的页面。 描述整个事情的三个文件以app开头,分别是项目的全局js(全局数据和动作)、json(全局配置)和wxss(全局样式)。 这三个文件一定要放在根目录下,也就是文件夹下。 *外层。

pages文件夹用于存放小程序的页面代码。 该文件夹下可以有任意数量的文件夹。 每个文件夹代表一个页面。 文件夹名称就是页面名称。 该文件夹下是整个页面。 代码使用我们刚才提到的四种类型的文件来描述这个页面,并且这四个文件的名称必须与页面名称相同。

另外,该文件夹下可能还有一个utils文件夹,其中放置的js文件用于存放公共js代码,方便不同页面调用。 它不是云开发环境中自动为我们创建的,我们的项目也不需要使用它,所以在右侧的目录中找不到它。

为了统一管理图片,我们经常会在目录中手动添加文件夹。

*后,配置文件用于配置小程序及其页面是否允许被微信索引。

炫佑科技专注互联网开发小程序开发-app开发-软件开发-网站制作等

相关案例查看更多