这是一个简单的前后端分离项目,主要使用Vue.js + SpringBoot技术开发。
除了作为入门练习之外,我还希望该项目可以作为一些常见Web项目的脚手架,帮助您简化网站构建的过程。它被称为白色笔记本,因为它从 0 开始,并随着时间的推移逐渐提高。
前端仓库:https://github.com/realdonald1994/WhiteJotter_Vue
后端仓库:https://github.com/realdonald1994/WhiteJotter
欢迎加入白乔特!
作为展示页面,包括本项目开发的主要参考资料、近期更新以及Slogan
提供图书、电影信息展示功能
提供笔记、博文展示功能
包括仪表板、内容管理、用户及权限管理等。
个人介绍及相关链接
1.Vue.js
2.ElementUI
3.axios
4.Vuex
1.Spring引导
2.Spring数据+JPA
3.MySQL
4.四郎
1.Mysql
1.Centos7
2.Nginx
3.FastDFS
1.Junit
2.开玩笑
1.clone项目到本地
前端:
git clone https://github.com/realdonald1994/WhiteJotter_Vue
后端:
git clone https://github.com/realdonald1994/WhiteJotter
2.在mysql中创建数据库white_jotter
,运行项目,数据会自动注入。
Redis端口为6379(默认端口),密码为空。
3.数据库在后端项目的src main resources
目录下的application.properties
文件中配置,mysql版本为8.0.15。
4.在IntelliJ IDEA中运行后端项目。为了保证项目运行成功,可以右键pom.xml
,选择maven->reimport并重启项目
至此,服务器启动成功,同时运行前端项目,访问http: // localhost: 8080
,即可进入登录页面,默认账号为admin
,密码为123
如果要做二次开发,请继续看第五步和第六步。
5.进入前端项目根目录,在命令行中依次输入以下命令:
# Install dependencies
npm install
# Start the project at localhost: 8080
npm run dev
由于wj-front
项目中已经配置了端口转发,将数据转发到SpringBoot,所以项目启动后,在浏览器中输入http: // localhost: 8080
访问我们的前端项目,所有请求都将数据转发到SpringBoot通过端口转发(注意此时不要关闭SpringBoot项目)。
6.最后就可以使用WebStorm
等工具打开wj-front
项目并继续开发了。开发完成后,项目要上线的时候,仍然进入wj-front
目录,然后执行以下命令:
npm run build
命令执行成功后,会在wj-front目录下生成一个dist
文件夹,将文件夹中的assets
和index.html
两个文件复制到nginx即可。然后进入后端根目录,执行命令行:
mvn clean install
最后在新生成的target
目录下输入命令行java -jar xxx.jar
。启动后端服务器。
在nginx文件下输入命令行: start nginx
。启动前端服务器。
08-20 添加Redis
06-09 使用 Vue test utils 和 Jest 添加单元测试
06-04 使用gzip解决网页加载缓慢
06-02 项目部署在云服务器上,网站首次发布?
05-29 前后端分离项目
04-20 使用开源markdown编辑器实现文章展示和管理模块
...