基于vue3+element-plus+laravel8.x构建的前后端分离的博客应用

前端UI参考

• 炫酷ui
• 简洁ui

博客地址

实现了一些小功能

• 主题切换

• 前后端分离下第三方授权登录

• 响应式

• 模仿论坛样式的二级评论(ps 模范不到位 。挺丑的感觉)

• 评论框监听渲染(这个功能很简单我就不上图了。

• 前端源码

• 后端源码

工具🔧

• vue3
• element-plus
• laravel8.x

前端UI参考

• 炫酷ui
• 简洁ui

模块

• 登录第三方授权+jwt token 授权 使用了自己开发的第三方登录包 thirdparty_oauth
• 评论模块
• element组件:时间轴、组件分离、分页 导航栏等组件
• job队列异步记录访客ip以及地址(守护进程消费)
• 利用redis有序集合缓存热门排行榜
• 后台使用了dcat-admin
• 前端新增主题切换
• 等待完善...

前端安装集成

• 前端

   //全局配置文件 存放第三方登录一些key 以及后台接口
   .env
   .env.development
   .env.production

• 前端安装

npm install
npm run serve //热开发 加载.env.development配置文件
npm run build:prod //打包发布 加载 .env.production配置文件

后端安装集成(记得将sql文件导入并配置好数据库和redis)

• .env 配置(已经配置好了)

BROADCAST_DRIVER=log 
CACHE_DRIVER=array 
QUEUE_CONNECTION=sync //异步
SESSION_DRIVER=redis //redis驱动
SESSION_LIFETIME=120

• 启动

cp .env.example .env
composer install
php artisan key:gen
php artisan serve --port 9091

后台消费队列(正式环境用守护进程维护就行)

php artisan queue:work redis --sleep=3

更新日志

• 2021-04-17 新增用户评论所属区域显示 新增归档a链接 新增评论删除模型监听
• 2021-04-20 新增文章图片跳转 新增二级评论