# group-development-frontend

**Repository Path**: scholarIdler/group-development-frontend

## Basic Information

- **Project Name**: group-development-frontend
- **Description**: 一起开发的前端
- **Primary Language**: TypeScript
- **License**: MulanPSL-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-10-13
- **Last Updated**: 2022-11-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: 前端, 一起开发, React

## README

# 一起开发项目介绍 - 前端

> 一起开发项目 ： 帮助在在学习过程中，能找到志同道合一起做项目的伙伴，取长补短
>
> 前后端前栈项目 By [读书人-闲人](https://gitee.com/scholarIdler)
>
> 制作不易，请勿商用和二次售卖！！！

在线体验：[user.scholarlazy.cn](http://user.scholarlazy.cn/)

> 如果项目做的不好，或者中间有什么需要改进的，希望多多指点

前端代码仓库：[https://gitee.com/scholarIdler/group-development-frontend](https://gitee.com/scholarIdler/group-development-frontend)

后端代码仓库：[https://gitee.com/scholarIdler/group-development-backend](https://gitee.com/scholarIdler/group-development-backend)

<img src="https://xingqiu-tuchuang-1256524210.cos.ap-shanghai.myqcloud.com/9226/logo/20221110141042.png" alt="https://xingqiu-tuchuang-1256524210.cos.ap-shanghai.myqcloud.com/9226/logo/1668059639717.jpg" style="zoom: 67%;" />

## 项目背景

项目的创建起因是读书人-闲人为了解决自己在学习过程中因自己每次写项目时，都会因为一二个技术使用的不够熟练导致，自己不能把一个项目做的更好，所以打算写一个大家根据大家对应的技术栈加入队伍，顺便开源给大家一起来学习和完善。

试想一下：如果我还想写一个项目，因为前端的技术栈还不够熟练，就能去创建一个队伍，找一个前端熟练的一起写项目。

## 应用场景

无论试前端、后端、测试、数据开发等，相信等这个项目更加完善时，会对很多还学习阶段的同学们会有很大帮助！

主要应用场景如下：

1）通过 创建队伍，描述好需要的技术栈、项目介绍

<img src="https://xingqiu-tuchuang-1256524210.cos.ap-shanghai.myqcloud.com/9226/logo/20221110142518.png"  style="zoom: 50%;" />

2）申请加入别人的队伍 ，描述好自己的优势

<img src="https://xingqiu-tuchuang-1256524210.cos.ap-shanghai.myqcloud.com/9226/logo/20221110141042.png" style="zoom: 50%;" />

3）申请加入队伍

<img src="https://xingqiu-tuchuang-1256524210.cos.ap-shanghai.myqcloud.com/9226/logo/20221110143135.png" style="zoom: 50%;" />

4）查看自己的队伍信息

<img src="https://xingqiu-tuchuang-1256524210.cos.ap-shanghai.myqcloud.com/9226/logo/20221110143345.png" style="zoom: 50%;" />

## 值得学习

项目本身算是完善（分为用户前台、队伍前台和管理后台）、达到上下标准、架构设计清晰、目录结构规范。

前端使用 umi + react + ant design、后端使用 Springboot + mybatis + redis + Durid 等，也用到了一些设计模式和项目优化设计，还有很多功能可以研发，现在这个项目是初始期，完全能够给入门得同学们学习。

> 也请各位大佬多多指点 🤝

## 功能大全

#### 用户前台

- 登录 注册
- 队伍
  - 申请创建队伍
  - 申请加入队伍
  - 查看自己加入得队伍
  - 退出队伍
  - 踢出队伍中的人员
  - 查看队伍人员信息等

#### 管理后台

- 用户管理
- 队伍管理
- 搜索词管理

## 技术栈

#### 前端

主要技术：

- React 18
- Umi 4.x
- Ant Design 4.x 组件库
- Ant Design Pro Components 高级组件
- TypeScript 类型控制
- Eslint 代码规范控制
- Prettier 美化代码

#### 后端

主要技术：

- Spring Boot 2.7.x
- MyBatis Plus 3.5.x
- MySQL 8.x
- Spring AOP
- Redis
- redisson 3.17.6

依赖库：

- Druid：连接池 数据监听
- Gson：Json 解析
- Apache Commons Lang3：工具库
- Knife4j：接口文档生成
- Apache commons-collections4：集合,List, Set 等工具类
- Lombok ： 注解式代码生成
- log4j ： 控制日志信息输送
- commons-beanutils ： Apache 提供的一个用于操作 JAVA bean 的工具包

## 快速启动

#### 后端

1. 运行 sql 目录下的 create_table.sql 建表
2. 修改 application.yml 中的数据库、redis 地址为自己的
3. 安装完 Maven 依赖后，直接运行即可

#### 前端

安装依赖：

```
npm run install
```

运行：

```
npm run dev
```

打包：

```
npm run build
```

### 共享服务

包括词库、表信息、字段信息共享，其实就是对这些实体的增删改查 web 服务，不多说了。