『Java』基于 Spring Boot 的个人博客系统搭建—— Day01

本文记录了使用SpringBoot框架从零开始搭建个人博客系统ZeroBlog的过程,包括环境配置、静态文件引入及测试等内容。

在这里插入图片描述

永远相信美好的事情即将发生


前言


欸,朋友们好啊,我是国家一级写Bug运动员Am0xil。

掐指一算,从最开始有搭建自己的博客系统这个想法开始,差不多也一年了。想了一年,拖了一年,啥也没干。这两天一寻思,不行啊,马上就2021年了,这再拖下去云服务器都快过期了。不能再这样下去了,是时候做出点什么了。

于是决定从今天开始 Zero Blog 系统的搭建,不要为什么要给自己的系统起这么个名字,可乐人(零度可乐),可乐魂。系统初步决定采用 Spring Boot 框架,暂时不做前后端分离,技术栈这边的话再根据后期开发的情况适当添加,加油,打工人。


在这里插入图片描述

准备工作


JDK:1.8
Maven:3.5.4
GIT:2.20.1
MySQL:8.0.22

以上是本地开发环境中一些软件的版本,这里建议大家不用使用最新版的,特别是 MavenGIT ,总觉得在使用过程中最新版的老是有奇奇怪怪的Bug,别问我为什么知道


在这里插入图片描述

开始挖坑


首页预览

在这里插入图片描述
这是搭建好之后首页的一个效果,前端页面以及静态文件来自于 JQuery插件库 提供的一套开源免费模板,对 CSS,JS 以及部分 HTML 进行了本地修改,喜欢的同学也可以自行研究

接下来我们就要一步一步开始搭建

Spring Boot搭建

  1. 首先打开我们的 IDEA ,创建一个Maven项目,这里我使用的是2019的版本

    在这里插入图片描述

  2. 选择 Spring Initializr,这是 Spring官方提供的一款能够快速初始化Spring Boot项目的工具,然后点击右下角的 Next


    在这里插入图片描述

  3. 这里需要稍微等一会(主要取决你网速的快慢),然后我们如图所示填入项目的信息,然后点击右下角的 Next


    在这里插入图片描述

  4. 这里我们可以提前勾选上后面会用到的一些组件,当然不勾选也行,后期我们可以自行在 pom.xml 中手动添加。这里我们还需要注意一下有些组件的名称在 Spring Boot各个版本的名称可能不是完全一致的,这里建议大家和我的版本(2.4.1)保持一致


    在这里插入图片描述

  5. 然后我们选择项目的本地存储路径,点击 Finish ,如果有弹窗说选择的路径不存在,点击 OK 创建即可


    在这里插入图片描述

  6. 如图所示,是我们成功创建后项目的一个项目基础架构,到这我们就完成了一个简单的 Spring Boot 项目的搭建


    在这里插入图片描述

环境配置

1. Maven配置

这里我们主要是对setting.xml中本地仓库路径以及中央仓库的地址进行配置,建议使用阿里云中央仓库,这方面的教程网上的教程也很多,我们就不过多的讲解

修改好setting.xml文件后,我们需要在 IDEA 中进行修改,首先使用 Ctrl+Alt+S 快捷键进入设置选项,然后如图所示,依次选择


在这里插入图片描述

然后点击右下角的 Import ,稍等片刻(还是取决于你的网速),我们便完成了 Maven 的配置


在这里插入图片描述


2. Application.yml配置
首先我们先将 Application.properties 文件通过rename操作修改为 Application.yml ,其实两种格式都是可是使用的,但我总觉得 yml 的层级显示会更加明显一些


在这里插入图片描述


然后在 Application.yml 中添加相关配置信息,这里就简单以 ServerMySQL 为例

# 服务器端口配置
server:
  port: 8088

# 数据库连接
spring:
  datasource:
    url: jdbc:mysql://127.0.0.1:3306/blog?useUnicode=true&characterEncoding=utf-8&useSSL=true&serverTimezone=UTC # 注意修改为本地的数据库名称
    driver-class-name: com.mysql.cj.jdbc.Driver # 如果MySQL版本比较老,请使用 com.mysql.jdbc.Driver
    username: root
    password: 本地安装MySQL时设置的密码

静态文件添加

现在我们需要将我们的JS,HTML等静态文件进行导入,导入后的效果如图(需要相关静态文件的可以在我的 GitHub仓库 中下载,也可以到 JQuery插件库 自行下载修改)


在这里插入图片描述

测试


首先我们启动一下本地项目的 Tomcat


在这里插入图片描述


若出现以下结果,则证明 Tomcat 启动成功,否则就需要根据报错信息进行修改


在这里插入图片描述


然后我们打开浏览器,输入 http://localhost:8088/,回车


在这里插入图片描述


在这里插入图片描述


在这里插入图片描述


随着页面的一顿加载,项目变得索然无味


在这里插入图片描述

总结


搭建的过程其实还是挺简单的,也没啥好讲的,有几个小坑注意一下就好了

  1. 一定不要用最新版的Maven,一定不要用最新版的Maven,一定不要用最新版的Maven
  2. HTML中引用 JS 以及 CSS 文件时一定要注意路径问题,多用用 Chrome 的 F12
  3. 一定不要用最新版的Maven,一定不要用最新版的Maven,一定不要用最新版的Maven(重要的事情说6遍)
核心功能 文章/图片/视频发布、喜欢、统计阅读次数。 文章标签tag功能、支持按tag分类 文章支持ueditor/markdown编辑器切换(后台配置) 评论功能,支持回复,支持表情。 第三方(微博、QQ)登录。 lucene实现的站内搜索。 响应式布局 支持用户订阅 先看效果图 SpringBoot开发非常美观的java博客系统(包含后台管理功能) SpringBoot开发非常美观的java博客系统(包含后台管理功能) SpringBoot开发非常美观的java博客系统(包含后台管理功能) http://localhost:8080/admin/group/list SpringBoot开发非常美观的java博客系统(包含后台管理功能) SpringBoot开发非常美观的java博客系统(包含后台管理功能)SpringBoot开发非常美观的java博客系统(包含后台管理功能) 技术选型: JDK8 数据库MySQL 主框架 (Spring-bootSpring-data-jpa) 安全权限 Shiro 搜索工具 Lucene 缓存 Ehcache 视图模板 Freemarker 其它 Jsoup、fastjson jQuery、Seajs Bootstrap 前端框架 UEditor/Markdown编辑器 font-Awesome 字体/图标 准备工作(sql文件在项目里面) 安装 Jdk8 安装 Maven 准备 IDE (如果你不看源码,可以忽略下面的步骤,直接通过Maven编译war包:mvn clean package -DskipTests) IDE 需要配置的东西 编码方式设为UTF-8 配置Maven 设置Jdk8 关于这些配置,网上有一大把的资料,所以此处不再重复。 获取代码导入到IDE 下载代码 导入到IDE的时候请选择以Maven的方式导入 项目配置参考 系统配置手册 配置完毕 启动项目,在控制台看到Mblog加载完毕的信息后,表示启动成功 打开浏览器输入:http//localhost/mblog/ (此处仅是示例,具体具体端口因人而异),访问成功即部署完毕 后台管理的地址是 /admin, 如果你是管理员账号点导航栏的头像会看到"后台管理" 启动成功后,你应该去后台的系统配置里配置你的网站信息等。 常见问题总结 进入系统后, 菜单加载不出来, 那应该是你没有导 db_init.sql 点标签显示乱码, 请设置Tomcat的 URIEncoding 为 UTF-8 项目截图 SpringBoot开发非常美观的java博客系统(包含后台管理功能) 转自:https://gitee.com/mtons/mblog SpringBoot开发非常美观的java博客系统(包含后台管理功能) 注意: 一、java main方式运行mblog-web下的BootApplication.java时抛出异常的解决方案 Unable to start EmbeddedWebApplicationContext due to missing EmbeddedServletContainerFactory bean. SpringBoot开发非常美观的java博客系统(包含后台管理功能) 注释掉后下面图片的这段后,记得maven要重新reimport SpringBoot开发非常美观的java博客系统(包含后台管理功能) SpringBoot开发非常美观的java博客系统(包含后台管理功能) 否则maven依赖不生效还是会抛出以上的异常 二、第三方登录点击后无响应,那是因为第三方开放平台回调的url失效导致,需要你去对应的第三方开放平台注册app后获取对应的oauth帐号 SpringBoot开发非常美观的java博客系统(包含后台管理功能) 三、idea以maven项目导入该项目后,发现没有maven的依赖包时,需要对每个maven module进行clear和install,并且注意maven的依赖顺序 SpringBoot开发非常美观的java博客系统(包含后台管理功能) SpringBoot开发非常美观的java博客系统(包含后台管理功能) 四、访问地址是http://localhost:8080 登录时,帐号,密码只要自己找个密码,然后md5下在更新到db中即可登录成功。 比如:zuidaima 111111,md5后密码是 3931MUEQD1939MQMLM4AISPVNE,md5的javaSpringBoot开发非常美观的java博客系统(包含后台管理功能) SpringBoot开发非常美观的java博客系统(包含后台管理功能)
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

3价Fe离子

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值