vue和springboot的文章管理系统的设计与开发【字数：9225】
摘 要在计算机还未普及前，管理文章这些工作都是用纸笔记录下来进行操作，非常占用时间和空间。如今有了计算机，我们可以通过它作为工具来帮助管理员更高效的管理文章,提高管理者的工作效率。 本项目为了实现一套便捷、高效、快速的文章管理系统，在前端使用了Vue、ECMAScript 6、HTML5等技术并使用Visual Studio Code进行开发，在后台使用了Spring Boot的技术并在Eclipse上进行开发。将系统角色分为四种，以方便不同的用户管理文章。本系统与传统的文章管理系统相比，采用前后端分离的技术，使系统运行速度更快，开发效率更高。前端使用Vue来作为框架，采用虚拟Dom节点渲染的技术，提高页面渲染速度。后端使用到的Spring Boot技术极大的简化了配置的过程，方便后端开发者直接进行开发。
目录
1.绪论 1
1.1研究背景和目的 1
1.2现状与趋势 1
2.开发工具及相关技术 2
2.1开发工具 2
2.2相关技术 2
3.系统可行性及需求分析 4
3.1系统可行性分析 4
3.1.1技术可行性分析 4
3.1.2经济可行性分析 4
3.1.3管理可行性分析 4
3.2系统需求分析 4
3.2.1用户需求 4
3.2.2系统需求 5
3.2.3重要用例设计 6
4系统总体设计 8
4.1功能模块设计图 8
4.2系统模块结构设计 8
4.3数据库的详细设计 10
5.模块展示和系统主要功能的实现 13
5.1登录 13
5.2文章 14
5.2.1文章列表 14
5.2.2预览文章 14
5.2.3新增文章 15
5.2.4审核文章 16
5.2.5草稿列表 16
5.3二级、一级分类 17
5.3.1分类列表 17
5.3.2新增分类 19
5.4用户 19
5.4.1用户管理 19
*好棒文|www.hbsrm.com +Q: ^351916072#
/> 5.4.2登出和修改密码 20
6.系统测试 22
6.1 系统测试的目的和意义 22
6.2 系统测试的过程及结果 22
结语 25
参考文献 26
致谢 27
1.绪论
1.1研究背景和目的
科技的快速发展给我们的生活带来了巨大的变化，计算机被使用到了我们生活中的各个角落。与此同时，许多工作也可以通过使用计算机提高了工作效率，网站在编辑管理文章时，文章太多，逐一打开进行管理十分不方便。因此，我编写这个文章管理系统以便于方便更多的文章管理人员，方便他们挑选，编辑，发布文章，提高工作效率。
1.2现状与趋势
科技的快速发展使得手机和电脑走进了我们大家的生活，越来越多的人开始使用手机电脑来阅读小说，文章。“知识碎片化”这个词也应运而生，越来越多的人不是拿着书去获取知识，而是通过刷微博，刷网页，浏览app，打开微信公众号等方式来获取知识。那我们在网络上看到的那些文章是从哪里来的呢？这些文章不是随便在网上拉取的，其实我们在网络上所看到的很多文章其实都是由网站编辑筛选出来的，因为每天都会有很多人去编写文章，给网站投稿，但是并不是所有的文章都能展现在平台上，有的文章可能时效性太差，有的文章可能缺乏真实性，有的文章与网站主题不相关，有的文章写的很好但是有的地方可能需要进行修改。这就需要网站编辑去筛选编辑。但是在以前，网站编辑需要一篇一篇文章的去修改，保存，当文章数量非常庞大时，很容易造成文章混乱，已经查看过的文章和没有查看过的文章，需要修改的文章和不需要修改的文章等等混在一起，十分不利于网站编辑的工作，降低了他们的工作效率。但是现在我们拥有了计算机技术，可以通过数据库，将文章保存在里面，同时制作一个文章管理系统，将文章进行分类，让文章操作起来更加直观，这样就大大方便了广大网站编辑。 2.开发工具及相关技术
2.1开发工具
2.1.1 Visual Studio Code
Visual Studio Code简称VSCode[1]，它不仅免费而且功能强大，对前端的很多语言支持都很好比如javascript、css 、sass、es6等，它也自带很多功能，比如快捷键进行代码格式化和智能提示自动补全、提供插件等，同时他可以进行方便的Git管理，解决git代码冲突[2]，方便的查看修改对比。
2.1.2 Vue devtools
Vue devtools是google的一个插件，被称为vue调试神器，可以查看项目中使用到的组件，组件之前传递的值。
2.1.3 Vue cli
Vue cli是vue的一个脚手架[3]，在下载安装后，使用它就可以帮我们构建一些项目模板。
2.1.4 Webpack
Webpack是一个模块打包器，它可以自动找到浏览器不能直接运行的拓展语言[4]，将其打包并解析为浏览器可以运行的语言以供浏览器使用。
2.1.5 Element组件库
Element组件库是封装好很多组件的一个组件库[5]，里面有许多常用的组件和元素，引入组件库之后就可以使用。
2.1.6 Eclipse
Eclipse是一款开发工具，它是使用Java语言进行开发的[6]，大部分情况下用于Java的开发。
2.2相关技术
2.2.1 ECMAScript 6 简介
ECMAScript 6 也被称为“ES6”，ES6 具有非常多的新的功能[7]，这令JavaScript 更加强大。
2.2.2 Less简介
Less 包含一套自定义的语法及一个解析器，它在css的基础上扩充了一些规则[8]，添加了一些知识点例如变量、混合、函数等，让css更好维护。Less在最终都会通过编译器，编译成为对应的css文件以方便在浏览器上运行。
2.2.3 Vue简介
Vue 是一套用于构建用户界面的渐进式框架[9]。Vue具有有功能强大的路由机制并且可以使用多种方式实现过渡效果[10]。
目录
1.绪论 1
1.1研究背景和目的 1
1.2现状与趋势 1
2.开发工具及相关技术 2
2.1开发工具 2
2.2相关技术 2
3.系统可行性及需求分析 4
3.1系统可行性分析 4
3.1.1技术可行性分析 4
3.1.2经济可行性分析 4
3.1.3管理可行性分析 4
3.2系统需求分析 4
3.2.1用户需求 4
3.2.2系统需求 5
3.2.3重要用例设计 6
4系统总体设计 8
4.1功能模块设计图 8
4.2系统模块结构设计 8
4.3数据库的详细设计 10
5.模块展示和系统主要功能的实现 13
5.1登录 13
5.2文章 14
5.2.1文章列表 14
5.2.2预览文章 14
5.2.3新增文章 15
5.2.4审核文章 16
5.2.5草稿列表 16
5.3二级、一级分类 17
5.3.1分类列表 17
5.3.2新增分类 19
5.4用户 19
5.4.1用户管理 19
*好棒文|www.hbsrm.com +Q: ^351916072#
/> 5.4.2登出和修改密码 20
6.系统测试 22
6.1 系统测试的目的和意义 22
6.2 系统测试的过程及结果 22
结语 25
参考文献 26
致谢 27
1.绪论
1.1研究背景和目的
科技的快速发展给我们的生活带来了巨大的变化，计算机被使用到了我们生活中的各个角落。与此同时，许多工作也可以通过使用计算机提高了工作效率，网站在编辑管理文章时，文章太多，逐一打开进行管理十分不方便。因此，我编写这个文章管理系统以便于方便更多的文章管理人员，方便他们挑选，编辑，发布文章，提高工作效率。
1.2现状与趋势
科技的快速发展使得手机和电脑走进了我们大家的生活，越来越多的人开始使用手机电脑来阅读小说，文章。“知识碎片化”这个词也应运而生，越来越多的人不是拿着书去获取知识，而是通过刷微博，刷网页，浏览app，打开微信公众号等方式来获取知识。那我们在网络上看到的那些文章是从哪里来的呢？这些文章不是随便在网上拉取的，其实我们在网络上所看到的很多文章其实都是由网站编辑筛选出来的，因为每天都会有很多人去编写文章，给网站投稿，但是并不是所有的文章都能展现在平台上，有的文章可能时效性太差，有的文章可能缺乏真实性，有的文章与网站主题不相关，有的文章写的很好但是有的地方可能需要进行修改。这就需要网站编辑去筛选编辑。但是在以前，网站编辑需要一篇一篇文章的去修改，保存，当文章数量非常庞大时，很容易造成文章混乱，已经查看过的文章和没有查看过的文章，需要修改的文章和不需要修改的文章等等混在一起，十分不利于网站编辑的工作，降低了他们的工作效率。但是现在我们拥有了计算机技术，可以通过数据库，将文章保存在里面，同时制作一个文章管理系统，将文章进行分类，让文章操作起来更加直观，这样就大大方便了广大网站编辑。 2.开发工具及相关技术
2.1开发工具
2.1.1 Visual Studio Code
Visual Studio Code简称VSCode[1]，它不仅免费而且功能强大，对前端的很多语言支持都很好比如javascript、css 、sass、es6等，它也自带很多功能，比如快捷键进行代码格式化和智能提示自动补全、提供插件等，同时他可以进行方便的Git管理，解决git代码冲突[2]，方便的查看修改对比。
2.1.2 Vue devtools
Vue devtools是google的一个插件，被称为vue调试神器，可以查看项目中使用到的组件，组件之前传递的值。
2.1.3 Vue cli
Vue cli是vue的一个脚手架[3]，在下载安装后，使用它就可以帮我们构建一些项目模板。
2.1.4 Webpack
Webpack是一个模块打包器，它可以自动找到浏览器不能直接运行的拓展语言[4]，将其打包并解析为浏览器可以运行的语言以供浏览器使用。
2.1.5 Element组件库
Element组件库是封装好很多组件的一个组件库[5]，里面有许多常用的组件和元素，引入组件库之后就可以使用。
2.1.6 Eclipse
Eclipse是一款开发工具，它是使用Java语言进行开发的[6]，大部分情况下用于Java的开发。
2.2相关技术
2.2.1 ECMAScript 6 简介
ECMAScript 6 也被称为“ES6”，ES6 具有非常多的新的功能[7]，这令JavaScript 更加强大。
2.2.2 Less简介
Less 包含一套自定义的语法及一个解析器，它在css的基础上扩充了一些规则[8]，添加了一些知识点例如变量、混合、函数等，让css更好维护。Less在最终都会通过编译器，编译成为对应的css文件以方便在浏览器上运行。
2.2.3 Vue简介
Vue 是一套用于构建用户界面的渐进式框架[9]。Vue具有有功能强大的路由机制并且可以使用多种方式实现过渡效果[10]。
版权保护: 本文由 hbsrm.com编辑，转载请保留链接: www.hbsrm.com/jsj/jsjkxyjs/606.html
