SpringBoot3 + Vue3 学习 Day 1

学习视频

黑马程序员SpringBoot3+Vue3全套视频教程,springboot+vue企业级全栈开发从基础、实战到面试一套通关

基础

SpringBoot 概述

image-20240716104330969

快速启动

image-20240716105144038

① 创建Maven工程

​ 文件 -> new -> Module ->…

image-20240702145803965

② 导入spring-boot-starter-web 起步依赖

image-20240702145838003

image-20240716110150807

③ 编写Controller

image-20240702145901527

④ 提供启动类

image-20240702150014971

配置文件基本使用

① application.properties

image-20240702151822985

image-20240702151836653

② application.yml (更好)

image-20240702152134664

yml 配置信息的书写和获取

image-20240716151630116

image-20240716153552395

yml 配置信息书写与获取 1 -@ Value

类中使用 @Value 注解后(类中注解的名称和 yml 中的名称需一一对应),会自动去 yml 中获取配置并赋值

多个变量多个注解

image-20240716155030027

yml 配置信息书写与获取 2 - @ConfigurationProperties

一个zhu’j

image-20240716155428035

SpringBoot 整合Mybatis

image-20240717091115747

Bean 扫描

Spring Boot 工程默认扫描 启动类所在的包及其子包。如下图:启动类在 springbootmybatis 包里,而 UserController 类在itheima 包里,这样默认是扫描不到的。得加 ComponentScan 注解才能访问

image-20240718095541798

注册接口的开发

1、连接数据库并创建表

① 点击IDEA 右侧 database 数据图标,再点击 + 选择 Data Source -> MySQL 连接数据库

image-20240718153653852

② 填写数据库账号密码等

image-20240718154005338

③ 进入mysql 的操作窗口

image-20240718154217559

全选代码,并点击运行 ,生成三张表

image-20240718154419568

2、创建Spring Boot 工程

① 设置名称,位置,组等信息。Type选择maven,jdk 17,jave 17

image-20240718154632776

② 选择 web,MySQL,mybatis 依赖

image-20240718220057222

③ yml 配置链接 数据库

image-20240718220221640

3、注册接口 的开发

流程

controller 大管家,集中处理,分发任务:

叫狗腿子(userService),先看看用户存在不,存在则大管家报告Boss 说注册失败,账号存在;若不存在,则告诉狗腿子账号密码,叫狗腿子去注册一个,然后告诉Boss 注册成功

狗腿子(userService)接收命令。然后去人事部(User)找小二(userMapper)去查看用户或者注册,小二是真正操作者

① 创建实体类 并用 Lombok 自动生成各种方法

1、 lombok 小工具,使用时能自动生成实体类的 set,get,toString 等各种 方法。十分方便。用法:

① 导入 lombok 依赖,并 maven 一下

image-20240718161351389

② 在实体类(用户实体类,和操作返回结果实体类)上添加注解 @data (@data 是实现数据类的方法 get、set、equel、toString、Hash)

和 @NoArgsConstructor (生成无参构成方法)@AllArgsConstructor(有参构造方法)

image-20240718222958338

image-20240718222924213

② 定义大管家 Controller 类,并发号施令

image-20240718225517687

③ 定义手下 UserService 类

狗腿子是接口,接收到命令后,立马说:收到,我执行了。

image-20240718225630593

然后狗腿子部门开会,得出具体实现:我先把大管家告诉我的密码加密,然后叫具体的小二去执行

image-20240718230204358

怎么加密?

① 导入 MD5 的工具类

image-20240718230655825

② 在实现类中调用 getMD5String() 方法

String md5String = Md5Util.getMD5String(password);

④ 小二 UserMapper 登场,开始办事

image-20240718231237777

⑤ 开始测试

使用 postman 软件进行测试 PostMan中文文档

点击 Workspaces -》Create Workspace-》起名字-》创建 工作集 Collections

image-20240718232350635

点击send,可在下方看到 大管家告诉 Boss 的信息

4、注册账号 的参数校验

a、 手写 if - else

image-20240719083652054

b、使用 Spring Validation 参数校验框架

Spring Validation 通过使用预定义的注解,来完成参数校验

image-20240719091125650

① 添加 validation 依赖

image-20240719084429707

② 注解

image-20240719085718399

这样注册失败,只会抛异常。而不会放回Result 对象,生成系统能识别 的json 信息。所以得处理异常

image-20240719090733559

③ 参数校验失败异常处理

生成 exception 包 和全局异常处理类

image-20240719090815619

这样注册失败后,返回的信息就易懂了

image-20240719090923758

  • 42
    点赞
  • 26
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: Spring Boot是一种用于构建Java应用程序的开发框架,而Vue.js是一个用于构建用户界面的JavaScript框架。Spring BootVue.js的结合使用可以实现前后端分离的项目开发,其中包括实战pdf的生成和展示功能。 首先,我们可以使用Spring Boot来搭建后端接口服务。通过使用Spring Boot的Web模块,我们可以很方便地创建RESTful API,用于接收前端请求并处理数据。在这个项目中,我们可以设计一个用于生成pdf的API,在接收到相关请求时,利用Java的pdf生成库(如iText)来生成pdf文档,并将生成的pdf保存到服务器或返回给前端。 接下来,我们需要利用Vue.js来创建前端界面,并与后端的API进行交互。我们可以使用Vue.js的组件化和路由功能,创建多个页面来展示pdf文档。对于pdf的展示,可以使用Vue.js的插件或引入第三方pdf阅读器库(如pdf.js),来实现在前端浏览器中展示pdf文档的功能。 在前端界面中,我们可以设计一个上传pdf的功能,用户可以选择本地的pdf文件进行上传,并通过调用后端的API来将pdf保存到服务器,然后在页面中展示出来。 除了生成和展示pdf文档的功能之外,我们还可以通过Spring BootVue.js的结合来实现其他的功能,比如用户登录、权限控制、pdf搜索和标注等等。通过使用Spring BootVue.js这样的前后端分离的开发方式,我们可以更好地实现项目的模块化、可扩展性和易维护性。 总结来说,通过结合使用Spring BootVue.js,我们可以实现一个具有pdf生成和展示功能的项目。使用Spring Boot来搭建后端接口服务,并利用Java的pdf生成库来生成pdf文档;使用Vue.js来创建前端界面,并通过调用后端的API来展示和处理pdf文档。这样的开发方式可以更好地满足项目的需求,同时提高开发效率和用户体验。 ### 回答2: Spring Boot 是一个 Java 开发框架,用于简化和加速 Spring 应用程序的开发Vue 是一个流行的 JavaScript 框架,用于构建用户界面。Spring BootVue 可以一起使用,实现全栈开发。 PDF 是一种常见的文件格式,用于在不同平台上展示、共享和打印文档。在一个实践项目中使用 Spring Boot 3 和 Vue 3 来处理 PDF 文件是可行的。 首先,可以使用 Spring Boot 来创建一个 RESTful API,用于处理 PDF 文件的上传、下载和其他操作。Spring Boot 提供了丰富的库和功能,可以轻松处理文件上传和下载的逻辑。 然后,可以使用 Vue 3 来构建一个用户界面,用于展示 PDF 文件的列表和操作。Vue 3 提供了许多强大的工具和组件,可以方便地处理用户界面的交互和数据传输。 在实际项目中,可以使用 Spring Boot 来处理用户上传的 PDF 文件,并将其保存到服务器上的指定位置。同时,可以使用 Vue 3 构建一个界面,展示已上传的 PDF 文件列表,并提供下载和删除等功能。 为了实现这个功能,可以使用 Spring Boot 的文件上传功能来处理用户上传的 PDF 文件,并将其保存到指定的目录。然后,可以使用 Vue 3 的组件和路由来构建一个用户界面,用于展示和操作已上传的 PDF 文件。 总结来说,Spring Boot 3 和 Vue 3 可以一起使用,实现一个实战项目,用于处理 PDF 文件的上传、下载和其他操作。使用 Spring Boot 来处理文件上传和下载的逻辑,使用 Vue 3 来构建用户界面,展示和操作已上传的 PDF 文件。这样可以实现一个功能完善的 PDF 文件处理项目。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值