Home

Awesome

蘑菇博客

<p align=center> <a href="http://www.moguit.cn"> <img src="./doc/images/gitee/favicon2.ico" alt="蘑菇博客" style="width:200px;height:200px"> </a> </p> <p align=center> 蘑菇博客,一个基于微服务架构的前后端分离博客系统 </p> <p align="center"> <a target="_blank" href="https://gitee.com/moxi159753/mogu_blog_v2"> <img src="https://img.shields.io/hexpm/l/plug.svg" ></img> <img src="https://img.shields.io/badge/JDK-1.8+-green.svg" ></img> <img src="https://img.shields.io/badge/springboot-2.2.2.RELEASE-green" ></img> <img src="https://img.shields.io/badge/SpringCloud-Hoxton.RELEASE-brightgreen" ></img><img src="https://img.shields.io/badge/vue-2.5.17-green" ></img> <img src="https://img.shields.io/badge/swagger-3.0.0-brightgreen" ></img> <img src="https://img.shields.io/badge/mybatis--plus-3.1.2-green" ></img> <img src="https://gitee.com/moxi159753/mogu_blog_v2/badge/star.svg?theme=dark" ></img> <img src="https://gitee.com/moxi159753/mogu_blog_v2/badge/fork.svg?theme=dark" ></img> </a></p>

项目介绍 | 站点演示 | 项目特点 | 技术架构 | 项目目录 | 项目文档 | 快速开始 | 视频教程| 项目截图 | 更新记录 | 笔记仓库

前言

陌溪 是一个从三本院校一路摸滚翻爬上来的程序员。目前就职于字节跳动的Data商业化广告部门,是字节跳动全线产品的商业变现研发团队。这两天创建了一个 微信公众号【陌溪教你学编程,未来将会在公众号上持续性的输出很多原创小知识以及学习资源,欢迎各位小伙伴关注我,和我一起共同学习,同时我也希望各位小伙伴能够给蘑菇博客项目多多 Star 支持,您的点赞就是我维护的动力!

<p align=center> <img src="./doc/images/qq/公众号2.jpg" width="500" /> </p>

项目已有较详细的 项目搭建文档 ,同时包括了 WindowsLinux 以及 Docker 环境下蘑菇博客的搭建。在使用过程中遇到问题时,首先认真阅读项目搭建文档 ,同时 FAQ文档 还收集了小伙伴咨询的问题,可以提前阅读~

【提问前】可以先 百度 或者 Google 进行解决,有的问题通过搜索引擎很快就能得到解决

【提问前】可以首先看看 issue 或者 FAQ文档,可能你的问题别人也遇到过

【提问前】可以提前阅读 如何向开源社区提问题

【提问】推荐使用 Gitee issue 进行提问,因为issue解决后能够保留解决记录,帮助其它小伙伴避坑。其次可以使用 蘑菇社区<a href="##关注&交流">QQ群 </a> 或者 <a href="##前言">微信群 </a> 进行提问。群里提问注意提问的时间,把遇到问题的详细过程都描述清楚,最好配上图文信息,这样能有利于更高效的解决问题。

字节内推

目前字节跳动拥有大量岗位需求,欢迎点击下方内推链接【内推码: WYU3X8M】选择合适的岗位投递。小伙伴们使用内推链接投递后,可以通过 公众号 联系我跟进面试进度。

提前批投递:点我传送 ,社会招聘:点我传送

项目介绍

蘑菇博客( MoguBlog ),一个基于微服务架构的前后端分离博客系统Web 端使用 Vue + ElementUi , 移动端使用 uniappColorUI。后端使用 SpringCloud + SpringBoot + Mybatis-plus进行开发,使用 Jwt + SpringSecurity 做登录验证和权限校验,使用 ElasticSearchSolr 作为全文检索服务,使用 Github Actions完成博客的持续集成,使用 ElasticStack 收集博客日志,文件支持上传本地七牛云Minio.

运行配置

蘑菇博客使用了一些监控的 SpringCloud 组件,但是并不一定都需要部署,必须启动的服务包含

nacosnginxrabbitmqredismysqlmogu-gatewaymogu-smsmogu-picturemogu-web, mogu-admin

其它的服务都可以不启动,也不影正常使用,可以根据自身服务器配置来启动

最低配置:1核2G 【需开启虚拟内存】【容易宕机】

推荐配置:2核4G 【狂欢特惠】【博主目前配置】

最近,腾讯云和阿里云的优惠力度非常大,如果有需求的小伙伴,可以了解一下~

【阿里云】云服务器狂欢特惠,2核2G5M 轻量级应用服务器 60 元/年 点我传送

【腾讯云】云产品限时秒杀,爆款 2核4G8M 云服务器,首年 74元/年、222/3年博主强烈推荐点我传送

站点演示

首先特别感谢群里小伙伴 @泪梦红尘 对蘑菇博客提供服务器支持。所以就刚好以此用来做蘑菇博客的演示站点,同时我也在搭建的时候,顺便录制了一套视频:20分钟部署一个微服务架构的博客系统 ,感兴趣的小伙伴可以参考视频一起完成部署~

【演示前端】:http://demoweb.moguit.cn/

【演示后端】:http://demoadmin.moguit.cn/

【演示账号】:点击获取

【小程序】蘑菇博客的移动端版本,可以扫码体验。参考 蘑菇博客小程序部署 文档,以及Bilibili上 20分钟部署博客小程序视频 完成小程序的搭建。

<img src="./doc/images/uniapp/wxCode.jpg" width="200" />

后期维护

项目后台目前有 Eureka 版本和 Nacos 版本,其中 Eureka 版本使用的是 SpringCloud 一些组件,Nacos 版本使用的是 SpringCloudAlibaba 的一些组件,例如 NacosSentinel

蘑菇博客Go版本

mogu_blog_go 是根据蘑菇博客改编的一个 Golang 简化版分支,实现了蘑菇博客后台原有的大部分基础功能,同时前端代码和数据库基本没有变化,因此可以直接使用蘑菇博客原有的前端页面。

mogu_blog_go 目前采用的技术有:beegogormmysqlredisnginx。相比于蘑菇博客微服务版,Golang版蘑菇能够做到 1C2G 的服务器轻松运行,再也不怕网站第二天起来就宕机了~。

参考蘑菇博客Golang版安装指南,快速在 Windows 平台搭建蘑菇博客Go版开发环境

项目中初始用户和密码

项目特点

项目文档

文档地址:http://moxi159753.gitee.io/mogu_blog_doc

备用文档地址:http://doc.moguit.cn

项目地址

目前项目托管在 GiteeGithub 平台上中,欢迎大家 StarFork 支持~

项目目录

技术选型

系统架构图

image text

蘑菇博客系统架构图,使用 Processon 在线绘制

后端技术

技术说明官网
SpringBootMVC框架 https://spring.io/projects/spring-boot
SpringCloud微服务框架https://spring.io/projects/spring-cloud/
SpringSecurity认证和授权框架https://spring.io/projects/spring-security
MyBatis-PlusORM框架https://mp.baomidou.com/
Swagger-UI文档生产工具 https://github.com/swagger-api/swagger-ui
Kibana分析和可视化平台https://www.elastic.co/cn/kibana
Elasticsearch搜索引擎 https://github.com/elastic/elasticsearch
Beats轻量型数据采集器https://www.elastic.co/cn/beats/
Logstash用于接收Beats的数据并处理https://www.elastic.co/cn/logstash
Solr搜索引擎http://lucene.apache.org/solr/
RabbitMQ消息队列 https://www.rabbitmq.com/
Redis分布式缓存https://redis.io/
Docker容器化部署 https://www.docker.com
Druid数据库连接池 https://github.com/alibaba/druid
七牛云七牛云 - 对象储存https://developer.qiniu.com/sdk#official-sdk
JWTJWT登录支持https://github.com/jwtk/jjwt
SLF4J日志框架http://www.slf4j.org/
Lombok简化对象封装工具 https://github.com/rzwitserloot/lombok
NginxHTTP和反向代理web服务器http://nginx.org/
JustAuth第三方登录的工具https://github.com/justauth/JustAuth
HutoolJava工具包类库https://hutool.cn/docs/#/
阿里大于短信发送平台https://doc.alidayu.com/doc2/index.htm
Github Actions自动化部署https://help.github.com/en/actions
Zipkin链路追踪https://github.com/openzipkin/zipkin
Flexmark-javaMarkdown转换Htmlhttps://github.com/vsch/flexmark-java
Ip2region离线IP地址定位库https://github.com/lionsoul2014/ip2region
Minio本地对象存储服务https://min.io/
Docker ComposeDocker容器编排https://docs.docker.com/compose/
PortainerDocker可视化管理https://github.com/portainer/portainer

前端技术

技术说明官网
Vue.js前端框架https://vuejs.org/
Vue-router路由框架https://router.vuejs.org/
Vuex全局状态管理框架https://vuex.vuejs.org/
Nuxt.js创建服务端渲染 (SSR) 应用https://zh.nuxtjs.org/
Element前端ui框架 https://element.eleme.io
Axios前端HTTP框架 https://github.com/axios/axios
Echarts图表框架www.echartsjs.com
CKEditor富文本编辑器https://ckeditor.com/
Highlight.js代码语法高亮插件https://github.com/highlightjs/highlight.js
VditorMarkdown编辑器https://github.com/Vanessa219/vditor
vue-cropper图片裁剪组件https://github.com/xyxiao001/vue-cropper
vue-image-crop-uploadvue图片剪裁上传组件https://github.com/dai-siki/vue-image-crop-upload
vue-emoji-commentVue Emoji表情评论组件https://github.com/pppercyWang/vue-emoji-comment
clipboard.js现代化的拷贝文字http://www.clipboardjs.cn/
js-beautify美化JavaScript代码https://github.com/beautify-web/js-beautify
FileSaver.js保存文件在客户端https://github.com/eligrey/FileSaver.js
SortableJS功能强大的JavaScript 拖拽库http://www.sortablejs.com/
vue-side-catalog目录导航栏https://github.com/yaowei9363/vue-side-catalog
uniapp移动端跨平台语言https://uniapp.dcloud.io/
colorUi专注视觉的小程序组件库https://github.com/weilanwl/ColorUI
showdown用Javascript编写的Markdown 到Html转换器https://github.com/showdownjs/showdown
turndown用JavaScript编写的HTML到Markdown转换器https://github.com/domchristie/turndown

快速开始

【推荐】一条命令部署蘑菇博客

参考 如何使用一条命令完成蘑菇博客部署, 在云服务器上执行下面命令,完成一键部署蘑菇博客

wget http://oss.moguit.cn/script/moguInit.sh && chmod +x moguInit.sh && sh moguInit.sh

Bilibili一键部署视频:20分钟部署一个微服务架构的博客系统

[推荐] Windows+VMware一键搭建蘑菇博客本地开发环境

参考 Windows+VMware一键搭建蘑菇博客本地开发环境,快速在 Windows 平台搭建蘑菇博客开发环境,将中间件安装在 VMware 中。

Windows环境下搭建蘑菇博客

参考 window环境下配置蘑菇博客环境,能够在 Windows下搭建蘑菇博客的开发环境,同时将所有组件安装在Windows 环境中

[推荐] DockerCompose一键部署蘑菇博客(Nacos版)

参考 DockerCompose一键部署蘑菇博客(Nacos版) ,在 Linux 服务器中,一键完成蘑菇博客项目的部署

Docker搭建蘑菇博客

参考 使用Docker快速搭建蘑菇博客(Eureka分支),快速在Linux服务器中搭建好博客运行环境,通过发布 Jar 包的方式完成部署

参考 使用Docker快速搭建蘑菇博客(Nacos分支),快速在Linux服务器中搭建好博客运行环境,通过发布 Jar 包的方式完成部署

蘑菇博客部署到云服务器

推荐】参考IDEA发布蘑菇博客Docker镜像到云服务器(适用于DockerCompose部署),在你修改Nacos分支博客源码后,将重新制作镜像部署到云服务器,然后通过DockerCompose进行启动。

参考蘑菇博客如何部署到阿里云服务器(Eureka分支),在你修改Eureka分支博客源码后将项目打包部署到云服务器

参考蘑菇博客如何部署到阿里云服务器(Nacos分支),在你修改Nacos分支博客源码后将项目打包部署到云服务器

使用Github Actions完成蘑菇博客持续集成

参考 使用Github Action完成蘑菇博客持续集成 ,在你提交一个 push 请求后,通过 Github Actions 能够完成蘑菇博客自动化 编译、打包、部署等操作。

切换搜索模式

参考蘑菇博客切换搜索模式,完成蘑菇博客的搜索引擎切换,目前支持 SolrElasticSearchSQL 的方式

配置七牛云对象存储

参考蘑菇博客切换七牛云存储,配置文件的七牛云对象存储,及本地文件存储

使用Zipkin搭建蘑菇博客链路追踪

参考使用Zipkin搭建蘑菇博客链路追踪,通过聚合各业务系统调用延迟数据,达到链路调用监控跟踪,快速定位其中延迟高的服务

使用Nacos搭建蘑菇博客服务注册和配置中心

参考蘑菇博客Nacos部署指南,搭建蘑菇博客的服务注册和配置中心

使用Sentinel搭建蘑菇博客流量控制

参考蘑菇博客Sentinel安装指南Sentinel 被称为分布式系统的流量防卫兵,相当于Hystrix

蘑菇博客QQ小程序发布

参考蘑菇博客QQ小程序发布指南,完成蘑菇博客 uniapp 移动端的启动和发布

【推荐】蘑菇博客微信小程序发布

参考蘑菇博客微信小程序部署指南,完成蘑菇博客 uniapp 移动端的启动和发布

蘑菇博客扩展新的功能和页面

参考蘑菇博客如何扩展新的功能和页面,在蘑菇博客现有架构基础上,开发自己需要的页面。

使用ELK搭建蘑菇博客日志收集

参考搭建蘑菇博客日志收集,使用 Docker 快速搭建 ELK 环境用于蘑菇博客日志收集

搭建网站免费CDN加速访问

参考 网站打开花了20秒,我决定自建蘑菇CDN ,免费搭建自己的CDN加速

环境搭建

开发工具

工具说明官网
IDEAJava开发IDEhttps://www.jetbrains.com/idea/download
WebStorm前端开发IDEhttps://www.jetbrains.com/webstorm/
RedisDesktopRedis可视化工具 https://redisdesktop.com/download
SwitchHosts本地Host管理https://oldj.github.io/SwitchHosts/
X-shellLinux远程连接工具https://xshell.en.softonic.com/
X-ftpLinux文件传输工具https://www.netsarang.com/zh/all-downloads/
SQLyog数据库连接工具https://sqlyog.en.softonic.com/
ScreenToGifGif录制工具 https://www.screentogif.com/

开发环境

工具版本号下载
JDK1.8https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
Maven3.3.0+http://maven.apache.org/
Elasticsearch6.3.0https://www.elastic.co/downloads
Solr7.0http://lucene.apache.org/solr/
MySQL5.6https://www.mysql.com/
Erlang20.3https://www.erlang.org/
RabbitMQ3.7.4http://www.rabbitmq.com/download.html
Nginx1.10http://nginx.org/en/download.html
Redis3.3.0https://redis.io/download
Zipkin2.12.5https://search.maven.org/remote_content?g=io.zipkin.java&a=zipkin-server&v=LATEST&c=exec
Nacos1.3.2https://github.com/alibaba/nacos/releases
Sentinel1.7.2https://github.com/alibaba/Sentinel/releases

致谢

蘑菇博客起初参考了很多开源项目解决方案开源不易,感谢分享

关注&交流

为了方便小伙伴们沟通交流,我创建了QQ群 (加群备注蘑菇博客) 和 微信群(备注:加群),目前项目还存在很多不足之处,欢迎各位老哥进群进行技术交流,为了防止广告进入,希望加群的时候能添加备注,谢谢~

微信群【备注:加群】QQ群(备注:蘑菇博客)【群满】QQ群(备注:蘑菇博客)【推荐】
<img src="./doc/images/qq/coder_moxi.png" width="200" /><img src="./doc/images/qq/qqGroup2.png" width="200" /><img src="./doc/images/qq/qqGroup3.png" width="200" />

未来计划

贡献代码

开源项目离不开大家的支持,如果您有好的想法,遇到一些 BUG 并修复了,以及 蘑菇博客文档 上有错误的地方订正过来了,欢迎小伙伴们提交 Pull Request 参与开源贡献

  1. fork 本项目到自己的 repo
  2. fork 过去的项目也就是你仓库中的项目 clone 到你的本地
  3. 修改代码
  4. commitpush 到自己的库
  5. 发起PRpull request) 请求,提交到 Nacos 分支
  6. 等待作者合并

开源协议

Apache License 2.0

赞赏

服务器域名等服务的购买和续费都会产生一定的费用,为了维持项目的正常运作,如果觉得本项目对您有帮助的话,欢迎朋友能够给予一些支持,陌溪将用于提升服务器配置,感谢小伙伴们的支持( ps: 小伙伴赞赏的时候可以备注一下下~)

微信支付宝
<img src="./doc/images/qq/wx.png" width="200" /><img src="./doc/images/qq/zfb.png" width="200" />

移动端截图

目前移动端版本的代码已经开源至Nacos分支,如果想体验的小伙伴可以移动至Nacos分支

image text

网站截图

Admin端
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text
image text
Web端
image textimage text
image textimage text
image textimage text
image textimage text
image textimage text