打造前后端分离的Spring Boot + Vue博客系统

需积分: 5 0 下载量 165 浏览量 更新于2024-10-26 收藏 13.22MB ZIP 举报
资源摘要信息:"基于 Spring Boot + Vue的前后端分离博客系统" 知识点详细说明: 1. 技术栈介绍 - Spring Boot: 是一种基于 Java 的开源框架,用于简化 Spring 应用的初始搭建以及开发过程。它使用了特定的方式来配置 Spring,使得开发者能够以最少的配置快速启动和运行 Spring 应用。 - Vue.js: 是一个构建用户界面的渐进式JavaScript框架。Vue 被设计为可以自底向上增量开发,它的核心库只关注视图层,易于上手,同时,通过与现代化的工具链以及各种支持库相结合,Vue.js 也可以驱动复杂的单页应用。 2. 后台开发 - vue-admin-template: 该模板是 Vue 面板的后台基础模板。通过使用 vue-cli 脚手架进行创建和配置,可以快速生成后台管理模板。 - my-vue-admin-template: 是对 vue-admin-template 的二次修改版本,本次项目基于此模板进行开发。 - UI 框架 Element UI: 是一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库。该组件库在本次项目中用于后台 UI 的开发。 3. 前台开发 - Semantic UI: 一个优雅的主题框架和用户界面构建工具,它使用人类可读的语言来定义样式,例如:“按钮”、“内容”等。它也支持 Vue.js,但因为完成度不高,本次项目主要用于前台界面开发的样式布局。 - Element UI: 除了 Semantic UI,项目还使用了 Element UI 来补充开发中的一些组件需求,如小组件等。 4. 文章排版 - typo.css: 一个 CSS 文件,用于定义文章的排版样式。项目中基于 typo.css 进行了修改来实现文章的展示样式。 5. 开发环境搭建 - 数据库配置: 需要创建 MySQL 数据库,并执行.sql脚本来初始化表数据。这是为了搭建开发环境和存储博客系统的数据。 - 配置文件: 修改 /blog-api/src/main/resources/目录下的 application-dev.properties 文件,这通常包含应用开发阶段的配置参数,如数据库连接、服务器端口等。 - Redis 安装与启动: Redis 是一个开源的使用内存存储数据并以此提高数据读取速度的NoSQL数据库。项目中需要安装 Redis 并启动,因为它可能被用作缓存或其他用途。 - 前端依赖安装: 在 blog-cms 和 blog-view 目录下使用 npm install 命令安装项目依赖,确保前端开发环境配置正确。 6. 项目结构 - .gitignore: 文件用于指定不希望被 Git 仓库跟踪的文件和文件夹,如node_modules、构建目录等。 - README.md: 通常包含项目的介绍、安装指南、快速开始、API文档等信息。 - deploy.sh: 是一个部署脚本,用于自动化部署项目的流程。 - 目录结构: 包括 blog-cms(后台管理)、pic(图片资源)、blog-view(前台展示)和 blog-api(后端 API 接口)等。 7. 系统特点 - 前后端分离: 该博客系统采用了前后端分离的架构,前端使用 Vue.js 构建用户界面,后端使用 Spring Boot 提供 RESTful API。这种分离使得前后端能够独立开发和部署,加快开发速度,提高系统的可维护性和扩展性。 总结来说,这个项目通过利用 Spring Boot 和 Vue.js 技术栈,以及对相关技术组件的整合使用,构建了一个前后端分离的博客系统。项目中的关键点包括后台的 UI 开发、前台 UI 设计、文章排版样式、开发环境配置、项目结构和自动化部署。对开发人员而言,这些知识点不仅涵盖了整个项目的开发流程,还体现了现代Web应用开发中常用的工具和框架。