序言：为吃透一个Java开发增删改查而写的项目
一、需求分析
需求：1、具体点的增删改查： 一个表（用户表：用户id（自增主键）、用户编号、用户名称、QQ、手机号、出生日期、排序），，前端界面完成该表的增删改查
2、前后端分离的模式，前端可以尝试用 vue + Element UI 来做
分析：通过一个页面展现增删改所有功能
1、navicat 建库，建表
2、后端用Java的springboot微服务搭框架
3、前端用element-admin-template前端框架，页面用vue实现
二、建数据库
1、库名：db_crud 表名：t_user 软件工具：navicat
三、后端编码
语言：Java 软件工具：Idea（Jdk1.8、maven）
1、搭建SpringBoot项目
2、pom环境
3、application.yml配置文件
4、建实体类entity、统一返回类R和REnum
5、controller层（注意跨域问题）
UserController和LoginController
5.1、带条件的分页查询
返回值： Map
参数：@PathVariable Integer pageNum, @PathVariable Integer pageSize,HttpServletRequest request
5.2、新增
返回值：User
参数：@RequestBody User user
5.3、单个删除
返回值：Booleam
参数：@PathVariable Integer id
5.4、批量删除
返回值 void
参数：@RequestBody List<Integer> ids
5.5、修改之回显
返回值: User
参数：@PathVariable Integer id
5.6、修改之更新
返回值：User
参数：@RequestBody User user
6、service层
6.1、新增
6.2、单个删除
6.3、批量删除
6.4、根据id回显
6.5、更新
6.6、带条件查询
7、dao层
7.1、新增
7.2、单个删除
7.3、批量删除
7.4、根据id回显
7.5、更新
7.6、带条件查询
8、mapper层
8.1、新增sql语句
8.2、单个删除sql语句
8.3、批量删除sql语句
8.4、根据id回显sql语句
8.5、更新sql语句
8.6、带条件查询sql语句
9、启动类
9.1、CrudApplication
10、配置类
10.1、MybatisConfig(Springboot整合mybatis配置)
10.2、 PaginationConfig（分页配置）
四、前端编码
软件工具: VsCode
1、前端框架采用vue-element-admin的基础模板vue-element-template
1.1、src下route中的index.js模板文件，会定位到页面
1.2、src下views下list.vue展示功能页面
1.2.1、页面采用vue技术
vue页面包括<template></template> <script></script>
页面中的组件可以在element-ui中拷贝
1.3、src下api的Js文件，通过js绑定后端的controller层实现数据库的数据调用
1.4、回到页面中，调用js中定义的方法，完成前端展示数据和数据库数据调用
2、修改env.development文件API的地址，和后端端口号一致，完成前后端数据整合
五、项目部署
1、后端部署
1.1、pom.xml文件中加maven插件
1.2、通过maven打包文件package打包工具打包，target文件下会生成一个Jar文件
1.3、通过cmd命令运行java -jar 文件名，即可完成部署
2、前端部署
2.1、env.production文件API地址改成和后端微服务地址
2.2、main.js文件中26到29行默认文件注释掉
2.3、VsCode终端执行 npm run build:prod命令，项目中会生成一个dist文件
2.4、在nginx的配置文件中新增sever配置，写入dist文件和端口等配置，运行nginxj即可完成部署
标签：文件,vue,流程,crud,开发,前端,sql,id,页面 From： https://www.cnblogs.com/mulans/p/17316166.html