技术选型
主要框架
核心框架 Springboot
安全框架 Apache Shiro
持久层框架 Mybatis + mybatis-plus
页面模板 Freemarker
缓存框架 Redis
数据库 mysql
消息队列 RabbitMq
分布式搜索 Elasticsearch
双工通讯协议:websocket
网络通讯框架:t-io
工具集合:hutool
安装 RabbitMq,Elasticsearch
安装RabbitMq
安装环境
系统:win10 64位专业版
erlang:otp_win64_24.0
rabbitMQ:rabbitmq-server-3.8.19
安装rabbitMQ需要依赖erlang语言环境,所以需要我们下载erlang的环境安装程序。
下载安装包
rabbitMQ安装程序下载路径:https://www.rabbitmq.com/install-windows-manual.html


安装配置 erlang
对于安装路径没有特殊要求的话,就一路next直至安装成功即可,默认安装路径为:C:\Program Files\erl-23.0。
接下来配置环境变量,常规操作,新建系统变量-键入变量名ERLANG_HOME,键入变量值:erlang安装路径。如下图:

然后添加系统path路径中,添加 : %ERLANG_HOME%\bin

然后打开cmd,输入erl,看到我们的erlang版本号,就说明安装成功了

安装配置 rabbitMQ
双击我们刚才下载的rabbitmq-server-3.8.19程序,next,install即可,此处需要注意,如果要自定义安装路径的话,路径中最好不要存在中文,会出现错误。
安装完成之后,需要我们激活rabbitmq_management
打开cmd,进到sbin目录下,运行命令
rabbitmq-plugins enable rabbitmq_management

验证
上面的命令执行成功之后,我们就可以通过http://localhost:15672来访问web端的管理界面
初始可以通过用户名:guest 密码guest来登录

这就说明我们安装成功了。
net start RabbitMQ #启动
net stop RabbitMQ #停止
rabbitmqctl status #查看状态
安装Elasticsearch
下载地址
https://www.elastic.co/cn/elasticsearch/ 官网


下载完成后

目录结构
bin :启动文件
config 配置文件
log4j2 :日志文件
jvm.options java 虚拟机相关的配置
elasticsearch.yml elasticsearch 的配置文件
lib 相关jar 包
logs 日志
modules 功能模块
plugins 插件 ik
在bin 里点击启动即可


安装head 插件
在 github 下载 https://github.com/mobz/elasticsearch-head/
简单的前端页面
安装 cnpm install


**此时还不能链接上我们的 es **

连接不上解决一下跨域的问题
在ElasticSearch.yml 加上这两句话
http.cors.enabled: true
http.cors.allow-origin: “*”
此时就可以连接上来了

创建Springboot 项目
这个操作比较简单
pom.xml
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.1.2.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.example</groupId>
<artifactId>Springboot-blog</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>Springboot-blog</name>
<description>Demo project for Spring Boot</description>
<properties>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-redis</artifactId><!--netty-->
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-devtools</artifactId>
<scope>runtime</scope>
<optional>true</optional>
</dependency>
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<optional>true</optional>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
<exclusions>
<exclusion>
<groupId>org.junit.vintage</groupId>
<artifactId>junit-vintage-engine</artifactId>
</exclusion>
</exclusions>
</dependency>
<!--mp-->
<dependency>
<groupId>com.baomidou</groupId>
<artifactId>mybatis-plus-boot-starter</artifactId>
<version>3.2.0</version>
</dependency>
<!--代码生成器-->
<dependency>
<groupId>com.baomidou</groupId>
<artifactId>mybatis-plus-generator</artifactId>
<version>3.2.0</version>
</dependency>
<!-- sql分析器 -->
<dependency>
<groupId>p6spy</groupId>
<artifactId>p6spy</artifactId>
<version>3.8.6</version>
</dependency>
<!-- commons-lang3 -->
<dependency>
<groupId>org.apache.commons</groupId>
<artifactId>commons-lang3</artifactId>
<version>3.9</version>
</dependency>
<dependency>
<groupId>cn.hutool</groupId>
<artifactId>hutool-all</artifactId>
<version>4.1.17</version>
</dependency>
<!--验证码-->
<dependency>
<groupId>com.github.axet</groupId>
<artifactId>kaptcha</artifactId>
<version>0.0.9</version>
</dependency>
<!--shiro权限框架-->
<dependency>
<groupId>org.apache.shiro</groupId>
<artifactId>shiro-spring</artifactId>
<version>1.4.0</version>
</dependency>
<dependency>
<groupId>net.mingsoft</groupId>
<artifactId>shiro-freemarker-tags</artifactId>
<version>0.1</version>
</dependency>
<!--websocket-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
<!-- es 6.4.3版本 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-elasticsearch</artifactId><!--netty-->
<version>2.1.1.RELEASE</version>
</dependency>
<!--整合rabbitmq-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-amqp</artifactId>
</dependency>
<dependency>
<groupId>org.modelmapper</groupId>
<artifactId>modelmapper</artifactId>
<version>1.1.0</version>
</dependency>
<!-- tio -->
<dependency>
<groupId>org.t-io</groupId>
<artifactId>tio-websocket-server</artifactId>
<version>3.2.5.v20190101-RELEASE</version>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
前端的框架用的是 layui 的 fly-3.0
我放在了 资源里面 可以下载到https://download.csdn.net/download/m0_46937429/20398937?spm=1001.2014.3001.5503

大概框架是这个样子.下载在我的资源里面
拆分首页 以及填充
先把 下载好的 fly 3.0 的首页引入到 templates
controller 层
package com.example.springbootblog.Controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class IndexController {
@RequestMapping ({
"","/","index"})
public String index () {
return "index";
}
}


此时访问 http://localhost:8080/

我们可以把 头信息抽离出来 再用 freemarker 引入就可以了


然后在 index.ftl 里面引入就可以了

同样的道理把 导航的部分跟 尾部抽离出来就可以了
中间部分处理

可以先把右边的部分抽离出来

这个 right.ftl 里面就是 那个 md 4 的 同样的道理 把 左侧的可以 抽离出来
这个时候还不太够完善,有好多的地方可以在所有的地方会用到
**新建一个 layout.ftl **

用这个标签 暂时把 index.ftl 里面的东西 复制到 下面这个标签 里面
但是不能全部复制过来 比如 这几个 就不是公共的。就是首页自己的。可能别的页面就没有的
<#macro layout title>
</macro>

怎么引用我们写的layout.ftl 页面呢?
<#include "./inc/layout.ftl"/>
<#-- 导入 layout 的标签 -->
<@layout "首页" >
<#include "./inc/hrader-panel.ftl"/>
<div class="layui-container">
<div class="layui-row layui-col-space15">
<#include "./inc/left.ftl"/>
<#include "./inc/right.ftl"/>
</div>
</div>
</@layout>
运行访问 ,其实就是拼图 套娃。哈哈哈哈

还可以访问,证明我们的抽离没有问题
添加 页面


把这两个页面复制过来
先写Controller 测试一下能不能用
@Controller
public class PostController {
// 指定值接收 数字类型
@GetMapping("/category/{id:\\d*}")
public String category(@PathVariable(name = "id") Long id) {
return "post/category";
}
@GetMapping("/detail/{id:\\d*}")
public String detail(@PathVariable(name = "id") Long id) {
return "post/detail";
}
}
效果


是没有问题的。但是不能用 Controller 形式 跳转。我们应该用 页面的形式 。接下来修改页面用模板进行跳转
category 页面
<#include "../inc/layout.ftl"/>
<#-- 导入 layout 的标签 -->
<@layout "博客分类" >
<#include "../inc/hrader-panel.ftl"/>
<div class="layui-container">
<div class="layui-row layui-col-space15">
<div class="layui-col-md8">
<div class="fly-panel" style="margin-bottom: 0;">
<div class="fly-panel-title fly-filter">
<a href="" class="layui-this">综合</a>
<span class="fly-mid"></span>
<a href="">未结</a>
<span class="fly-mid"></span>
<a href="">已结</a>
<span class="fly-mid"></span>
<a href="">精华</a>
<span class="fly-filter-right layui-hide-xs">
<a href="" class="layui-this">按最新</a>
<span class="fly-mid"></span>
<a href="">按热议</a>
</span>
</div>
<ul class="fly-list">
<li>
<a href="user/home.html" class="fly-avatar">
<img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" alt="贤心">
</a>
<h2>
<a class="layui-badge">分享</a>
<a href="detail.html">基于 layui 的极简社区页面模版</a>
</h2>
<div class="fly-list-info">
<a href="user/home.html" link>
<cite>贤心</cite>
<!--
<i class="iconfont icon-renzheng" title="认证信息:XXX"></i>
<i class="layui-badge fly-badge-vip">VIP3</i>
-->
</a>
<span>刚刚</span>
<span class="fly-list-kiss layui-hide-xs" title="悬赏飞吻"><i class="iconfont icon-kiss"></i> 60</span>
<!--<span class="layui-badge fly-badge-accept layui-hide-xs">已结</span>-->
<span class="fly-list-nums">
<i class="iconfont icon-pinglun1" title="回答"></i> 66
</span>
</div>
<div class="fly-list-badge">
<span class="layui-badge layui-bg-black">置顶</span>
<!--<span class="layui-badge layui-bg-red">精帖</span>-->
</div>
</li>
<li>
<a href="user/home.html" class="fly-avatar">
<img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" alt="贤心">
</a>
<h2>
<a class="layui-badge">动态</a>
<a href="detail.html">基于 layui 的极简社区页面模版</a>
</h2>
<div class="fly-list-info">
<a href="user/home.html" link>
<cite>贤心</cite>
<!--<i class="iconfont icon-renzheng" title="认证信息:XXX"></i>-->
<i class="layui-badge fly-badge-vip">VIP3</i>
</a>
<span>刚刚</span>
<span class="fly-list-kiss layui-hide-xs" title="悬赏飞吻"><i class="iconfont icon-kiss"></i> 60</span>
<span class="layui-badge fly-badge-accept layui-hide-xs">已结</span>
<span class="fly-list-nums">
<i class="iconfont icon-pinglun1" title="回答"></i> 66
</span>
</div>
<div class="fly-list-badge">
<span class="layui-badge layui-bg-red">精帖</span>
</div>
</li>
<li>
<a href="user/home.html" class="fly-avatar">
<img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" alt="贤心">
</a>
<h2>
<a class="layui-badge">动态</a>
<a href="detail.html">基于 layui 的极简社区页面模版</a>
</h2>
<div class="fly-list-info">
<a href="user/home.html" link>
<cite>贤心</cite>
<!--
<i class="iconfont icon-renzheng" title="认证信息:XXX"></i>
<i class="layui-badge fly-badge-vip">VIP3</i>
-->
</a>
<span>刚刚</span>
<span class="fly-list-kiss layui-hide-xs" title="悬赏飞吻"><i class="iconfont icon-kiss"></i> 60</span>
<!--<span class="layui-badge fly-badge-accept layui-hide-xs">已结</span>-->
<span class="fly-list-nums">
<i class="iconfont icon-pinglun1" title="回答"></i> 66
</span>
</div>
<div class="fly-list-badge">
<!--<span class="layui-badge layui-bg-red">精帖</span>-->
</div>
</li>
<li>
<a href="user/home.html" class="fly-avatar">
<img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" alt="贤心">
</a>
<h2>
<a class="layui-badge">动态</a>
<a href="detail.html">基于 layui 的极简社区页面模版</a>
</h2>
<div class="fly-list-info">
<a href="user/home.html" link>
<cite>贤心</cite>
<!--
<i class="iconfont icon-renzheng" title="认证信息:XXX"></i>
<i class="layui-badge fly-badge-vip">VIP3</i>
-->
</a>
<span>刚刚</span>
<span class="fly-list-kiss layui-hide-xs" title="悬赏飞吻"><i class="iconfont icon-kiss"></i> 60</span>
<!--<span class="layui-badge fly-badge-accept layui-hide-xs">已结</span>-->
<span class="fly-list-nums">
<i class="iconfont icon-pinglun1" title="回答"></i> 66
</span>
</div>
<div class="fly-list-badge">
<!--<span class="layui-badge layui-bg-red">精帖</span>-->
</div>
</li>
<li>
<a href="user/home.html" class="fly-avatar">
<img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" alt="贤心">
</a>
<h2>
<a class="layui-badge">动态</a>
<a href="detail.html">基于 layui 的极简社区页面模版</a>
</h2>
<div class="fly-list-info">
<a href="user/home.html" link>
<cite>贤心</cite>
<!--
<i class="iconfont icon-renzheng" title="认证信息:XXX"></i>
<i class="layui-badge fly-badge-vip">VIP3</i>
-->
</a>
<span>刚刚</span>
<span class="fly-list-kiss layui-hide-xs" title="悬赏飞吻"><i class="iconfont icon-kiss"></i> 60</span>
<!--<span class="layui-badge fly-badge-accept layui-hide-xs">已结</span>-->
<span class="fly-list-nums">
<i class="iconfont icon-pinglun1" title="回答"></i> 66
</span>
</div>
<div class="fly-list-badge">
<!--<span class="layui-badge layui-bg-red">精帖</span>-->
</div>
</li>
<li>
<a href="user/home.html" class="fly-avatar">
<img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" alt="贤心">
</a>
<h2>
<a class="layui-badge">动态</a>
<a href="detail.html">基于 layui 的极简社区页面模版</a>
</h2>
<div class="fly-list-info">
<a href="user/home.html" link>
<cite>贤心</cite>
<!--
<i class="iconfont icon-renzheng" title="认证信息:XXX"></i>
<i class="layui-badge fly-badge-vip">VIP3</i>
-->
</a>
<span>刚刚</span>
<span class="fly-list-kiss layui-hide-xs" title="悬赏飞吻"><i class="iconfont icon-kiss"></i> 60</span>
<!--<span class="layui-badge fly-badge-accept layui-hide-xs">已结</span>-->
<span class="fly-list-nums">
<i class="iconfont icon-pinglun1" title="回答"></i> 66
</span>
</div>
<div class="fly-list-badge">
<!--<span class="layui-badge layui-bg-red">精帖</span>-->
</div>
</li>
<li>
<a href="user/home.html" class="fly-avatar">
<img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" alt="贤心">
</a>
<h2>
<a class="layui-badge">动态</a>
<a href="detail.html">基于 layui 的极简社区页面模版</a>
</h2>
<div class="fly-list-info">
<a href="user/home.html" link>
<cite>贤心</cite>
<!--
<i class="iconfont icon-renzheng" title="认证信息:XXX"></i>
<i class="layui-badge fly-badge-vip">VIP3</i>
-->
</a>
<span>刚刚</span>
<span class="fly-list-kiss layui-hide-xs" title="悬赏飞吻"><i class="iconfont icon-kiss"></i> 60</span>
<!--<span class="layui-badge fly-badge-accept layui-hide-xs">已结</span>-->
<span class="fly-list-nums">
<i class="iconfont icon-pinglun1" title="回答"></i> 66
</span>
</div>
<div class="fly-list-badge">
<!--<span class="layui-badge layui-bg-red">精帖</span>-->
</div>
</li>
<li>
<a href="user/home.html" class="fly-avatar">
<img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" alt="贤心">
</a>
<h2>
<a class="layui-badge">动态</a>
<a href="detail.html">基于 layui 的极简社区页面模版</a>
</h2>
<div class="fly-list-info">
<a href="user/home.html" link>
<cite>贤心</cite>
<!--
<i class="iconfont icon-renzheng" title="认证信息:XXX"></i>
<i class="layui-badge fly-badge-vip">VIP3</i>
-->
</a>
<span>刚刚</span>
<span class="fly-list-kiss layui-hide-xs" title="悬赏飞吻"><i class="iconfont icon-kiss"></i> 60</span>
<!--<span class="layui-badge fly-badge-accept layui-hide-xs">已结</span>-->
<span class="fly-list-nums">
<i class="iconfont icon-pinglun1" title="回答"></i> 66
</span>
</div>
<div class="fly-list-badge">
<!--<span class="layui-badge layui-bg-red">精帖</span>-->
</div>
</li>
</ul>
<!-- <div class="fly-none">没有相关数据</div> -->
<div style="text-align: center">
<div class="laypage-main"><span class="laypage-curr">1</span><a href="/jie/page/2/">2</a><a href="/jie/page/3/">3</a><a href="/jie/page/4/">4</a><a href="/jie/page/5/">5</a><span>…</span><a href="/jie/page/148/" class="laypage-last" title="尾页">尾页</a><a href="/jie/page/2/" class="laypage-next">下一页</a></div>
</div>
</div>
</div>
<#include "../inc/right.ftl">
</div>
</div>
</@layout>
同理把detail.ftl 页面修改一下
<#include "../inc/layout.ftl"/>
<#-- 导入 layout 的标签 -->
<@layout "博客分类" >
<#include "../inc/hrader-panel.ftl"/>
<div class="layui-container">
<div class="layui-row layui-col-space15">
<div class="layui-col-md8 content detail">
<div class="fly-panel detail-box">
<h1>Fly Template v3.0,基于 layui 的极简社区页面模版</h1>
<div class="fly-detail-info">
<!-- <span class="layui-badge">审核中</span> -->
<span class="layui-badge layui-bg-green fly-detail-column">动态</span>
<span class="layui-badge" style="background-color: #999;">未结</span>
<!-- <span class="layui-badge" style="background-color: #5FB878;">已结</span> -->
<span class="layui-badge layui-bg-black">置顶</span>
<span class="layui-badge layui-bg-red">精帖</span>
<div class="fly-admin-box" data-id="123">
<span class="layui-btn layui-btn-xs jie-admin" type="del">删除</span>
<span class="layui-btn layui-btn-xs jie-admin" type="set" field="stick" rank="1">置顶</span>
<!-- <span class="layui-btn layui-btn-xs jie-admin" type="set" field="stick" rank="0" style="background-color:#ccc;">取消置顶</span> -->
<span class="layui-btn layui-btn-xs jie-admin" type="set" field="status" rank="1">加精</span>
<!-- <span class="layui-btn layui-btn-xs jie-admin" type="set" field="status" rank="0" style="background-color:#ccc;">取消加精</span> -->
</div>
<span class="fly-list-nums">
<a href="#comment"><i class="iconfont" title="回答"></i> 66</a>
<i class="iconfont" title="人气"></i> 99999
</span>
</div>
<div class="detail-about">
<a class="fly-avatar" href="../user/home.html">
<img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" alt="贤心">
</a>
<div class="fly-detail-user">
<a href="../user/home.html" class="fly-link">
<cite>贤心</cite>
<i class="iconfont icon-renzheng" title="认证信息:{
{ rows.user.approve }}"></i>
<i class="layui-badge fly-badge-vip">VIP3</i>
</a>
<span>2017-11-30</span>
</div>
<div class="detail-hits" id="LAY_jieAdmin" data-id="123">
<span style="padding-right: 10px; color: #FF7200">悬赏:60飞吻</span>
<span class="layui-btn layui-btn-xs jie-admin" type="edit"><a href="add.html">编辑此贴</a></span>
</div>
</div>
<div class="detail-body photos">
<p>
该模版由 layui官方社区(<a href="http://fly.layui.com/" target="_blank">fly.layui.com</a>)倾情提供,只为表明我们对 layui 执着的信念、以及对未来持续加强的承诺。该模版基于 layui 搭建而成,可作为极简通用型社区的页面支撑。
</p>
<p></

最低0.47元/天 解锁文章
8567

被折叠的 条评论
为什么被折叠?



