文章目录
- 企业做项目流程
- 需求分析
- 技术选型
- 计划
- 初始化项目
- 数据库设计
- 登录/注册
- ⽤户管理(仅管理员可⻅)
- 初始化项目
- ⼀、前端初始化
- 1.下载nodejs
- 2.Ant Design Pro
- 相关问题
- 1.前端项目启动时报错、无法启动?
- 2.如何初始化前端项目?为什么初始化命令和鱼皮视频中的不同?为什么没有umi@3选项?
- 二、后端初始化
- 数据库
- 方法一(不推荐)
- 方法二
- 方法三(推荐)
- 流程
企业做项目流程
需求分析=>设计(概要设计,详细设计)=>技术选型 =>初始化/引入需要的技术=>
写demo=>写代码(实现业务逻辑)=>测试(单元测试)=>代码提交/代码评审=>部署=> 发布
需求分析
**1.登录/注册 **
**2.用户管理(仅管理员可见)对用户的的查询或修改 **
**3.用户校验(仅星球用户) **
技术选型
前端:三件套+React+组件库Ant Design+Umi+Ant Design Pro(现成的管理系统)
后端:
java
spring(依赖注入框架,帮助你管理Java对象,集成一些其他的内容)
springmvc(web框架,提供接口访问、restfu接口等能力)
mybatis(Java操作数据库的框架,持久层框架,对jdbc的封装)
mybatis-.plus(对mybatis的增强,不用写sql也能实现增删改查)
springboot(快速启动/快速集成项目。不用自己管理spring配置,不用自己整合各种框架)
junit 单元测试库
mysql
部署:服务器/容器(平台)
计划
初始化项目
1.前端初始化 ✔️
-
前端初始化
-
引入一些组件之类的
-
框架介绍/瘦身
2.后端初始化 ✔️
-
准备环境(MySql之类的)
-
引入框架
数据库设计
登录/注册
- 前端
- 后端
⽤户管理(仅管理员可⻅)
- 前端
- 后端
初始化项目
本项目Node.js请使用v16版本,JDK请使用8版本,Spring Boot使用2.x版本!
⼀、前端初始化
1.下载nodejs
2.Ant Design Pro
相关问题
1.前端项目启动时报错、无法启动?
大概率是本地环境、依赖版本和鱼皮的不一致,或者是文件权限问题,Node,js版本最好使用v16(鱼皮的是v16.20.0),如果不是的话建议去Node.js官方网站重新下载安装Node,或者使用nvm(Node.js版本管理工具)来切换多个不同的Node.js版本。
2.如何初始化前端项目?为什么初始化命令和鱼皮视频中的不同?为什么没有umi@3选项?
因为本项目使用的前端框架Ant Design Pro在持续更新,请以官方文档最新的初始化命令为主。
官方文档:https::/pro.ant.design/zh-CN/docs/getting-started
知道去看官方文档,你就能少走很多坑。
如果跟着视频做报错了,那么先去看最新官方文档上的命令和用法,或者切换文档版本为和视频一致。如果还有报错,那么就把错误信息贴到百度去查询。
如果你还想用umi@3和umi ui怎么办呢?
更新后的框架不能满足需求,那我们用更新前的不就好了???
执行命令安装老版本的脚手架:
npm i @ant-design/pro-cli@3.1.0 -g
然后使用pro-v查看版本号,保证是3.1.0,即可出现umi@3的选项:
选择框架版本时,一定要选V3!!!使用v4版本不支持umi ui悬浮按钮。
注意:像截图这里没有让你选择 umi3 还是 umi4 的,因为官方默认最新版本,就先按 ctrl+c 回退。
先卸载上面的版本npm uninstall -g @ant-design/pro-cli
选择这个方式安装指定版本npm install -g @ant-design/pro-cli@3.1.0
这样接着pro create myapp
就可以选择版本了,我们选 umi3
升降级nodejs的博客
有可能nodejs和你的版本不匹配,可能nodejs版本过高,要么降低版本,要么把 start 这一行改成这样
"start": "set NODE_OPTIONS=--openssl-legacy-provider && cross-env UMI_ENV=dev umi dev"
,
然后是 umi ui 的下载
yarn add @umijs/preset-ui -D
二、后端初始化
数据库
MySQL 5.7
方法一(不推荐)
去 GitHub 上面搜索 SpringBoot 模板,但从0开始做或者企业化做就最好不要
方法二
Spring官网的模板生成器
因为现在官网不支持java8,通过阿里云国服去间接创建Spring项目修改Server URL为https://start.aliyun.com
阿里云Spring模板生成器
方法三(推荐)
直接在 IDEA开发工具里生成
如果要引入java的包,可以去maven中心仓库寻找(http:/mvnrepository…com/)
直接在 IDEA开发工具里生成
流程
- 创建项目
- 点击右侧的 database 登录连接数据库
- 编写demo
MyBatis-Plus官方文档
DROP TABLE IF EXISTS `user`;CREATE TABLE `user`
(id BIGINT NOT NULL COMMENT '主键ID',name VARCHAR(30) NULL DEFAULT NULL COMMENT '姓名',age INT NULL DEFAULT NULL COMMENT '年龄',email VARCHAR(50) NULL DEFAULT NULL COMMENT '邮箱',PRIMARY KEY (id)
);DELETE FROM `user`;INSERT INTO `user` (id, name, age, email) VALUES (1, 'Jone', 18, 'test1@baomidou.com'),(2, 'Jack', 20, 'test2@baomidou.com'),(3, 'Tom', 28, 'test3@baomidou.com'),(4, 'Sandy', 21, 'test4@baomidou.com'),(5, 'Billie', 24, 'test5@baomidou.com');
执行demo
- 引入依赖
<dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>3.5.1</version>
</dependency>
- 配置文件 application.yml
原来是 application.properties,改为了 .yml
spring:application:name: user-centerdatasource:url: jdbc:mysql://localhost:3306/aniausername: rootpassword: 123456driver-class-name: com.mysql.cj.jdbc.Driver
server:port: 8080
这里要配置不然启动项目会因为 MyBatis 没配置而出错
- 创建 mapper 包
@SpringBootApplication
@MapperScan("com.hsu.usercenter.mapper")
public class UserCenterApplication {public static void main(String[] args) {SpringApplication.run(UserCenterApplication.class, args);}}
在类上添加 @MapperScan("com.hsu.usercenter.mapper")
- 创建 model 包
复制 User 到 model 包
@Data
@TableName("`user`")
public class User {private Long id;private String name;private Integer age;private String email;
}
复制 UserMapper 到 mapper 包
public interface UserMapper extends BaseMapper<User> {}
这里 BaseMapper 官方已经提供了很多方法了
- 编写测试类
@SpringBootTest
public class SampleTest {@Autowiredprivate UserMapper userMapper;@Testpublic void testSelect() {System.out.println(("----- selectAll method test ------"));List<User> userList = userMapper.selectList(null);Assert.isTrue(5 == userList.size(), "");userList.forEach(System.out::println);}}
记得导入对应的包
引入 Java 的包去 Maven 中心仓库
运行测试即可