本文适合刚学习完 Java 语言基础的人群,跟着本文可了解和运行项目,本示例是在 Windows 操作系统下演示。
本文作者:HelloGitHub-秦人
大家好!这里是 HelloGitHub 推出的《讲解开源项目》[1]系列,今天给大家带来一款基于 Java 语言的人力资源管理开源项目——微人事
微人事是一个前后端分离的人力资源管理系统,项目采用 SpringBoot + Vue 架构。该系统是管理员对员工信息的一些列的操作。首先管理员需要登入系统,可对员工信息进行增删查改操作,也可以对员工进行奖罚,工资等信息的增删查改。然后实现对部门员工信息的统计和修改。所有的操作都在系统中有日志记录。
微人事的项目地址:https://github.com/lenve/vhr
想要快速搭建一套微人事管理系统,那就跟着本文的步骤。你只需要花 10 分钟,就能拥有一个属于自己的微人事管理系统,并且可以对前后端分离的项目有一个完成的概念和感觉。下面是搭建完成的效果图:
微人事这个项目采用:
后端项目采用 MVC 模式,使用现在流行的 SpringBoot 框架。SpringBoot 是基于 SpringMVC 衍生出来的框架。宗旨是较少配置,让开发者快速上手做项目。
目录说明:
前端项目采用 MVVM 架构,就是 MVC 架构中多了一个 ViewMode。它是 Model 和 Controller 之间的一座桥梁。
目录说明:
1.确保本地已安装 Java8 开发环境;
2.确保本地以安装 maven 工具;
3.确保本地以安装 Node.js;
3.2 下载项目
git clone https://github.com/lenve/vhr.git
数据库脚本存放的路径在:hrserver\src\main\resources\vhr.sql,我本地使用的可视化工具 Navcat。新建一个名称为 vhr 的数据库。
导入 vhr.sql 文件数据到 mysql 数据库。
3.3.2 修改后台项目的环境配置文件
修改后台项目的环境配置文件 hrserver\src\main\resources\application.properties
# MySQL 配置
spring.datasource.type=com.alibaba.druid.pool.DruidDataSource
spring.datasource.url=jdbc:mysql://IP:3306/vhr?useUnicode=true&characterEncoding=UTF-8
spring.datasource.username=root
spring.datasource.password=root
a.导入后端项目到 IDEA 开发工具
b.运行后端项目
打开后台项目的入口类 HrserverApplication.java
c.项目启动成功如下图
2.运行前端项目
a.导入前端项目到 VSCode 开发工具
b.运行前端项目
c.在 VSCode 左侧导航栏,NPM SCRIPTS中直接运行 dev。
d.Ctrl+shift+Y 呼出控制台,在控制台终端依次执行如下命令:
# 安装依赖
npm install
# 在 localhost:8080 启动项目
npm run dev
3.项目运行成功如下图
Win + R 打开 Wndows 命令行窗口
1.运行后端项目
a.切换目录到 vhr\hrserver\ 下
b.打包后台项目
mvn clean package
c.命令行运行微人事后台项目
切换目录到 hrserver\target\,执行如下命令可启动项目
java -jar hrserver-0.0.1-SNAPSHOT.jar
d.项目运行成功成功入下图
2.运行前端项目
a.切换目录到 vhr\vuehr\ 下
b.在命令行依次执行如下命令
# 安装依赖
npm install
# 在 localhost:8080 启动项目
npm run dev
c.项目运行成功成功入下图
教程至此,你应该对前后端分离的项目有了一些简单的认识。并且你也已经在本地将项目跑起来了。所谓前后端分离,其实你也可以搞定的!项目涉及的技术比较多,你可以选择感兴趣的技术去学习。后面怎么玩就看你自己了:部署到服务器正式上线、定制自己专属的功能、给项目贡献代码等,都是可以的。
本教程是针对有一定 Java 编程基础,但又不知道如果运行本项目的小伙伴。如果你是老手欢迎直接阅读项目的说明文档,获取更多更详细的资料。
[1]
《讲解开源项目》: https://github.com/HelloGitHub-Team/Article
[2]
SpringBoot wiki: https://www.jianshu.com/p/350972a3a258
[3]
Spring Security wiki: https://blog.51cto.com/favccxx/1606179
[4]
MyBatis wiki: http://www.mybatis.org/mybatis-3/zh/index.html
[5]
MVVM框架 wiki: https://zhuanlan.zhihu.com/p/59467370