# 项目运行

## 一、数据库模块

### （一）环境要求

- Navicat Premium 15
- MySQL V14.4

### （二）建立数据库

- 使用Navicat建立数据库，库名course-select，使用UTF-8编码

  <img src="https://gendml.oss-cn-hangzhou.aliyuncs.com/picgo/image-20220611215229074.png" alt="image-20220611215229074" style="zoom:80%;" />

- 直接运行course-select.sql文件，刷新，即可以看到数据库表

  ![image-20220611221555240](https://gendml.oss-cn-hangzhou.aliyuncs.com/picgo/image-20220611221555240.png)

  <img src="https://gendml.oss-cn-hangzhou.aliyuncs.com/picgo/image-20220611221645529.png" alt="image-20220611221645529" style="zoom:80%;" />

## 二、后端模块

### （一）环境要求

- IntelliJ IDEA 2021.2.1
- jdk1.8
- Tomcat 8.5.6
- maven  3.2.2

### （二）进入项目，安装依赖

- 使用IDEA打开文件夹StudentCourseSystem

- 进入maven管理工具，执行install，等待maven安装项目所需依赖包

  <img src="https://gendml.oss-cn-hangzhou.aliyuncs.com/picgo/image-20220611212001313.png" alt="image-20220611212001313" style="zoom:80%;" />

### （三）配置数据库和服务器

- 配置tomcat服务器，端口要求必须是9000，并且运行URL无后缀，可参考本人的配置

  <img src="https://gendml.oss-cn-hangzhou.aliyuncs.com/picgo/image-20220611212229411.png" alt="image-20220611212229411" style="zoom:80%;" />

  <img src="https://gendml.oss-cn-hangzhou.aliyuncs.com/picgo/image-20220611212336397.png" alt="image-20220611212336397" style="zoom:80%;" />

### （三）启动服务器

- 启动Tomcat，启动后会自动跳转到http://localhost:9000/，因为这里没有相关静态文件，只是编写了接口，所以会报404，属于出正常现象

- 如果日志出现Artifact is deployed successfully，表示该项目已经成功在服务器运行

<img src="https://gendml.oss-cn-hangzhou.aliyuncs.com/picgo/image-20220611212649788.png" alt="image-20220611212649788" style="zoom:80%;" />

## 三、前端模块

### （一）环境要求

- Node.js v14.16.0
- vue/cli 5.0.4

### （二）安装Node和相关依赖

- 进入Vue项目文件夹StudentCourseVue，执行下列语句

- 安装完成后会出现node_modules，里面存放着vue项目需要的各种依赖

![image-20220611210125581](https://gendml.oss-cn-hangzhou.aliyuncs.com/picgo/image-20220611210125581.png)

### （三）项目启动

- 执行下列语句运行项目，如果端口冲突在当前目录下的vue.config.js配置新的端口

  ```
  npm run serve
  ```

  <img src="https://gendml.oss-cn-hangzhou.aliyuncs.com/picgo/image-20220611210312564.png" alt="image-20220611210312564" style="zoom:80%;" />

### （四）其他操作

- 编译构建项目

```
npm run build
```

- 项目测试

```
npm run test
```

- 检查和修复文件

```
npm run lint
```

