Vue.js + Spring Boot 先后端分离项目实践(一):项目简介
Vue.js + Spring Boot 先后端分离项目实践(二):搭建 Vue.js 项目
Vue.js + Spring Boot 先后端分离项目实践(三):先后端结合测试(登陆页面开发)
Vue.js + Spring Boot 先后端分离项目实践(四):数据库的引入
Vue.js + Spring Boot 先后端分离项目实践(五):使用 Element 辅助前端开发
Vue.js + Spring Boot 先后端分离项目实践(六):前端路由与登陆拦截器前端
以前写了一些关于 Java EE 的文章,主要是理论性质的,目的是帮助你们快速了解 Java EE 的核心内容,早日进入 Java Web 开发的大坑。固然只有理论是不够的,开发是一门技术活,有不少细节须要在实践中理解,因此我决定作一个实践教程。vue
选用 Vue.js + Spring Boot 来开发这个项目,是由于这两种框架是当下最新、最热门的技术之一,也是实现所谓 先后端分离 的最佳选择之一。ios
网上相关教程不少,但要么只是作了一个 DEMO ,要么对许多关键问题一笔带过。个人目标是根据这个教程,能够把一个完整的项目还原出来,因此我会尽可能详细地描述开发的过程。固然,每一个人的理解方式不一样,可能有些细节没讲到位,欢迎你们在评论区提问,也能够经过邮箱 (Evan_Nightly@163.com) 联系我,我必定会认真解答。git
这个项目我把它命名为 “白卷”,由于它是从 0 开始逐渐开发的,而它的本质是一个 图书管理系统,系统里的内容也须要逐步添加,象征着知识的从无到有,从有到多。另外我还给它起了一个英文名字,叫 White Jotter(白色笔记本),纯粹是为了谐音。github
项目的基本结构以下图:
数据库
虽然说项目是先后端分离的,但毕竟主要开发人员只有我一人(薅了个学弟帮忙,但演变成了我边作边给他讲),因此只能在先后端之间不断穿梭。但在作教程的时候,我会尽可能模块化地去讲解。axios
其实要作一个这种教程还真不容易,几乎是要把项目再作一遍。。。后端
系统主要分为三大模块:首页(展现模块)、图书馆(核心功能模块)和笔记本(扩展功能模块),每一个模块对应多个具体功能。服务器
有一种说法是开发项目须要花费百分之八十的精力在分析设计上,剩下的百分之二十才是撸代码。这个数值准不许不知道,可是这种思想是正确的。我过去想作什么老是直接开干,作过许多无用功,但愿你们不要一门心思扑在代码上,多花些精力作项目的整体设计、需求分析这些,对我的的成长绝对有好处。框架
由于这是个小项目,我就不浪费太多篇幅了,只对应上面的 图书馆 模块,作一个简单的需求分析。
功能描述 | 优先级 |
---|---|
基本信息 | 高 |
补充信息 | 中 |
功能描述 | 优先级 |
---|---|
图书分类 | 高 |
图书上传 | 高 |
图书维护 | 高 |
功能描述 | 优先级 |
---|---|
图书检索 | 中 |
图书排序 | 低 |
功能描述 | 优先级 |
---|---|
阅读标注 | 低 |
该页面须要良好的图书展现功能,可以反映出图书的基本信息,并作到简洁、美观,与网站总体风格一致。
图书需展现的信息以下:
书名、做者、简介、封面等。
根据网站整体设计,图书的分类由用户自定义(可支持多级分类),并以标签做为辅助。
分类具备严格的层级关系,属于树状结构,而标签则相互独立。
用户可利用分类或标签进行图书的筛选。
用户能够上传本地电子书或实体书信息至服务器。
电子书须要的信息有:书名、做者、简介、封面、分类、标签、附件
实体书须要的信息有:书名、做者、简介、封面、分类、标签、存放位置
修改: 用户能够根据须要修改图书的信息。除了上传时的信息外,还能够输入额外的内容,如:评分、阅读状况、阅读笔记。(可增长自定义栏)
删除: 用户能够根据须要删除图书条目。
添加搜索栏,进行智能全文搜索。(包括对分类和标签的搜索)
根据名称、时间、评分等对图书排序。
阅读过程当中能够添加笔记并保存。
项目比较完整的技术栈以下。
1.Vue.js
2.ElementUI
3.axios
1.SpringBoot
2.SpringSecurity
3.MySQL
在开发过程当中还会不断用到一些细碎的技术,有必要的我会增添上去。
1.How2J.cn - Java 全栈学习网站
2.Vue.js - 渐进式 JavaScript 框架
3.Element - 网站快速成型工具
由于项目只能利用业余时间开发,因此时间跨度会稍微长一点,计划在 五月以前 基本完成核心内容模块以及相应的教程。
项目我会天天跟进,教程每一周写一到两篇,仍是有一些压力的,幸好我不用 996,感谢老板。
GitHub 地址:https://github.com/Antabot/White-Jotter
欢迎你们访问个人博客 Evan 的博客!