SpringBoot+Vue开发记录(四)

news/2024/9/23 1:08:00/

说明: 本篇文章的主要内容是软件架构以及项目的前端Vue创建

一、软件架构

我道听途说的,听说这个东西很关键很重要什么的。
软件架构(software architecture)是一个系统的草图,是一系列相关的抽象模式,用于指导大型软件系统各个方面的设计。软件架构描述的对象是直接构成系统的抽象组件。在实现阶段,这些抽象组件被细化为实际的组件,比如具体某个类或者对象。
一般都是特别有经验的大佬才能画出正经的架构图,有了好的架构图,开发起来事半功倍。

不过软件架构多数是针对大项目来做的,当然,我们的刷题网站也会是一个大项目吧。
有了架构图后,我们就可以更好地分工,听说那些大厂招人也就是让招的人开发维护扩展某个模块中的某个功能
在这里插入图片描述
在这里插入图片描述

说来惭愧,我没有多少画架构图的经验的,现在也就是边学边看边设计设计,就简单地照猫画虎一下。
大概画成这样:
在这里插入图片描述

二、前端Vue创建

注意:你需要完成前置条件,即安装配置好vue

1. 打开vue ui

在这里插入图片描述

2. 创建项目

在这里插入图片描述

在这里插入图片描述
设置好项目路径后进行创建
在这里插入图片描述
确定好后继续:
在这里插入图片描述
我们用vue3框架
在这里插入图片描述
等它创建了,这个要等很久时间的
在这里插入图片描述
建好了:
在这里插入图片描述

3. 安装插件与依赖

安装这些插件
在这里插入图片描述
接下来安装依赖:
在这里插入图片描述

在这里插入图片描述
我们用的样式为element-plus,用这个样式只是为了方便,当然要是你html,js,css很腻害的话,自己写也是没有一点问题的。
在这里插入图片描述

怎么用这个样式呢?我们可以查看官方文档:https://element-plus.org/zh-CN/#/zh-CN。

三,运行前端Vue项目

我们可以在Vscode中打开项目

在这里插入图片描述
运行:
在这里插入图片描述
点击新建终端
在这里插入图片描述
在这里插入图片描述
输入:

npm run serve

在这里插入图片描述
ok了:
在这里插入图片描述
然后直接点击链接就行了:
在这里插入图片描述
在这里插入图片描述

四、结语

好了,我们的架构设计和前端Vue也就创建好了。
明天的内容大概是
数据库设计与创建和产品原型图的绘制


http://www.ppmy.cn/news/1434800.html

相关文章

【苍穹外卖】HttpClient-快速理解入门

目录 HttpClient-快速理解&入门1. 需求2. 如何使用3. 具体示例4. 大致优点5. 大致缺点 HttpClient-快速理解&入门 1. 需求 在平常访问服务器里面的资源的时候,我们通常是通过浏览器输入网址(或者在浏览器点击某个连接)这种方式&…

同旺科技 USB TO SPI / I2C适配器读写24LC128--读写

所需设备: 1、USB 转 SPI I2C 适配器;内附链接 2、24LC128芯片; 适应于同旺科技 USB TO SPI / I2C适配器专业版; 专业版配套软件更新; 直接读取HEX文件,自动完成文件解析; 支持芯片&#xf…

常见的加密方式都有哪些

加密方式有多种类型,包括对称加密、非对称加密和哈希函数。以下是它们的主要类型: 对称加密: 对称加密使用相同的密钥进行加密和解密。常见的对称加密算法包括:DES、3DES、AES、RC4 等。 非对称加密: 非对称加密使用一…

EPC在新能源光伏电站的优势和功能流程

EPC在新能源光伏电站的优势和功能流程 EPC 是指公司受业主委托,按照合同约定对工程建设项目的设计、采购、施工、试运行等实行全过程或若干阶段的承包。通常公司在总价合同条件下,对其所承包工程的质量、安全、费用和进度进行负责,在EPC模式…

基于Springboot的网课管理系统

基于SpringbootVue的网课管理系统的设计与实现 开发语言:Java数据库:MySQL技术:SpringbootMybatis工具:IDEA、Maven、Navicat 系统展示 用户登录 首页 课程表 论坛交流 学校公告 后端 学生管理 教师管理 班级管理 课程分类管理…

XiaodiSec day024 Learn Note 小迪安全学习笔记

XiaodiSec day024 Learn Note 小迪安全学习笔记 记录得比较凌乱,不尽详细 day24 sql injection 知识点 脚本代码与数据库前置只是 access 数据库注入 mysql 数据库注入 前置知识 开始 数据库类型不同,流程会不同 access 和 asp 目前使用量较少&a…

闲话 ASP.NET Core 数据校验(一):内置数据校验

前言 所谓输入的是垃圾,输出也必然是垃圾,有多少安全问题隐藏在请求的数据中,所以永远不能相信来自用户端的输入。 对请求数据的合法性进行校验,不仅有助于提升用户界面的友好性,而且有助于提高后台程序的安全性和稳…

华火电燃灶:重拾烹饪艺术的黄金法则,打造家庭美食的温馨记忆

记得在饭店给客户人炒菜的时候,炉灶下的每一道菜都透着诱人的香气。无论是炒肉还是炖汤,那股鲜香总让人回味无穷。然而,回到家,用上自家的燃气灶,发现同样的食材、同样的配方,味道却平淡无奇,仿…