搭建自己的博客-拾壹博客

写在前面

唠叨两句

作为一个技术开发人员,没有一个自己的博客,人生注定缺少点什么东西,是不是?最近研究了一些博客搭建,本文是使用开源项目”拾壹博客“进行搭建。

推荐等级

所需技术难度:4星
后续自定义程度:5星
美观度:4星
使用技术:VUE+JAVA
优点:丰富的后台管理功能以及独立的文档管理
缺点:需要一定的技术功底

所需工具

内容备注
数据库存储数据使用,本文用的是MySQL,如果用其他数据库,需要修改代码进行适配
一台能部署的服务器,有外网ip那种本文使用的是Centos7,最低1核2G即可,碰到各大服务器商打折的时候,不到一百就能买一年
Redis缓存使用

本文使用内容

内容备注
MySQL阿里云RDS服务
Centos7阿里云云服务
Oss文件存储七牛(也可以用阿里云OSS)
Redis做缓存使用
Nginx部署前端用的

开始搭建

gitee地址:https://gitee.com/quequnlong/shiyi-blog
官方演示地址:https://www.shiyit.com/

前端: vue + vuex + vue-router + axios + vuetify + element + echarts
后端: SpringBoot + nginx + docker + sa-token + Swagger2 + MyBatisPlus + Mysql + Redis + elasticsearch
其他: 接入QQ、微博、码云第三方登录,接入七牛云对象存储

安装包准备

(如不想那么麻烦,可以直接联系我,我给你准备启动运行的包,然后直接进行配置)

通过码云,使用git下载源码(我这里使用的idea)

image-20240303000247841

下载完之后,就对前后端进行编译。

(1)后端编译需要已经搭建JAVA环境(JDK8即可),并下载好maven的使用包,并配置好对应的环境。使用maven命令,对blog文件夹进行编译:

mvn -DskipTests=true clean package

image-20240303100514312

(2)前端编译需要已经搭建Node环境,使用node命令,编译blog-web和blog-admin,分别进入到blog-web和blog-admin文件,执行如下命令:

# 先安装对应的组件
npm install
# 对服务进行编译
npm run build

image-20240303102510210

参数配置

后端

进入到shiyi-blog/blog/common/src/main/resources的文件夹,编辑application.yml,需要修改的内容如下,此处只留下必改内容,其余内容暂时省略(此处在打出jar包之后,再修改也可以)

server:
  # (可选)端口号
  port: 8800
  servlet:
    # (可选)应用的访问路径
    context-path: /shiyi
spring:
  ......
  datasource:
    # (必改)数据库地址
    url: jdbc:mysql://数据库地址:3306/myblog?characterEncoding=UTF-8&useUnicode=true&useSSL=false&serverTimezone=Asia/Shanghai&tinyInt1isBit=false&allowPublicKeyRetrieval=true
    driver-class-name: com.mysql.cj.jdbc.Driver
    # (必改)数据库账号
    username: 账号
    # (必改)数据库密码
    password: 密码
    ......
  redis:
    # (必改)缓存地址
    host: 缓存地址
    port: 6379
    timeout: 3000
    # (必改)缓存密码
    password: 缓存密码
		......

前端

进入到blog-web文件夹,需要编辑.env.development及.env.production文件,具体编辑如下

# 环境名称,不需要修改
ENV = 'development'

# base api
VUE_APP_BASE_API = 'http://127.0.0.1:8800/shiyi'

# 图片地址
VUE_APP_IMG_API = 'https://七牛的地址/'

VUE_APP_ADMIN_API = 'http://127.0.0.1/admin'

VUE_APP_WEBSOCKET_API =  "ws://127.0.0.1:8801/websocket"

VUE_APP_URL = 'http://127.0.0.1/'

另外,因为源码在我们手里,页面内容就可以自己编辑了。比如改一下页面的字体,内容啥的,删一删里面的模块。比如博客首页中,我就把轮播图右侧的广告栏,改成了我的另一个博客的推荐位置。

展示

Blog客户端

博客首页

image-20240320145250414

文章详情

image-20240320145459995

后台管理系统

首页

image-20240320133104002

文章管理

image-20240320133204039

当然,后台管理还有很多优秀的功能,功能丰富,供我们自行使用

--------END--------

天行健,君子以自强不息;地势坤,君子以厚德载物

欢迎关注

blog:http://myblog.doubletree.fun
公众号:Doubletree的杂七杂八
csdn:https://blog.csdn.net/qq_27808011

  • 31
    点赞
  • 33
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论
Flask是一个基于Python的轻量级Web框架,通过使用它我们可以快速搭建起一个个性化的博客网站。 首先,我们需要安装Flask。可以使用pip命令来进行安装,如下所示: ``` pip install flask ``` 接下来,我们需要创建Flask应用程序。在项目目录下创建一个名为app.py的文件,并在其中编写如下代码: ```python from flask import Flask, render_template app = Flask(__name__) @app.route('/') def index(): return 'Hello, World!' if __name__ == '__main__': app.run() ``` 在这个例子中,我们创建了一个名为app的Flask应用程序,并在根路由上定义了一个index函数作为视图函数。这个函数返回一个简单的字符串"Hello, World!"。 接下来,我们可以运行这个应用程序。在命令行中执行以下命令: ``` python app.py ``` Flask会在本地启动一个开发服务器,默认监听端口为5000。我们可以在浏览器中访问`http://localhost:5000`来查看效果。 在实际开发中,我们可以创建多个视图函数来处理不同的路由请求,并使用模板引擎来渲染页面。使用Flask,我们可以轻松地实现用户认证、博客文章的展示与编辑、评论功能等。 使用Flask扩展,我们可以更加方便地集成数据库ORM(对象关系映射)工具、表单验证以及文件上传等功能。 总结来说,Flask是一个灵活且功能丰富的Web框架,通过Python语言的简洁和可读性,我们可以快速搭建起一个个性化的博客网站,并实现各种功能需求。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

Doubletree_lin

老板,爱你,么么哒

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

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

打赏作者

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

抵扣说明:

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

余额充值