偻儸小卒的博客
偻儸小卒的博客
About Me:
我是刘帅,(曾用网名:偻儸小卒、会PS的小码农、爱折腾的小码农、Edison Liu),来自酉州桃花源,重庆市酉阳县可大乡。是一枚真正会修电脑的程序员,也是一个在编程的路上越走越远的设计师,曾编写过一个叫“锟斤拷”的项目,也曾设计过一张叫“五彩斑斓的黑”的设计稿。我的个人博客采用ginblog_nuxt编写使用ginblog改写有兴趣或者申请免费友情链接的朋友可以加我QQ我们一起交流学习。
747357766
EdisonLiu_
747357766@qq.com
欢迎来到Ginblog
2021-03-17 19:05
0
31

[//]:#(keywords:Ginblog,gin博客,gin博客框架,刘帅个人博客,程序之家)

@[TOC](Ginblog是一款使用gin+vue开发的博客框架,并且不仅仅是一款博客框架,强大的功能可以实现大多数网站功能。)

重要更新

  • 2021.3.2 修改静态资源托管路径,前端项目下直接打包,不用再移动到static目录下,更加方便。

  • 2021.2.12 为了交流方便,建立了一个QQ群:951736723,如果有问题,欢迎进群交流。

  • 2021.2.10 增加了展示页面的移动端适配

     
  • 2021.1.2 加入注册、登录、评论功能,后台管理加入评论审核功能

  • 2021.1.3 增加 登录、注册验证功能;增加评论数量显示;增加阅读数量显示 增加:文章页面评论数、阅读数

介绍

gin+vue 全栈制作一个博客。

这是一个分享全栈制作过程的项目,旨在为有兴趣接触 golang web 开发的朋友分享一些制作经验。

你可以前往 B 站(https://space.bilibili.com/402177130) 观看全栈的制作过程,你也可以留言分享你的观点,非常乐意与你交流。

目录结构

├─  .gitignore
│  go.mod // 项目依赖
│  go.sum
│  latest_log.log
│  LICENSE
│  main.go //主程序
│  README.md
│  tree.txt

├─api         
├─config // 项目配置入口   
├─database  // 数据库备份文件(初始化)
├─log  // 项目日志
├─middleware  // 中间件
├─model // 数据模型层
├─routes
│      router.go // 路由入口    
├─static // 打包静态文件
│  ├─admin  // 后台管理页面 (已废弃,打包静态文件在web/admin/dist下)         
│  └─front  // 前端展示页面 (已废弃,打包静态文件在web/front/dist下)            
├─upload   
├─utils // 项目公用工具库
│  │  setting.go 
│  ├─errmsg   
│  └─validator         
└─web // 前端开发源码(VUECLI项目源文件)
    ├─admin             
    └─front

运行&&部署

  1. 克隆项目

    git clone git@gitee.com:wejectchan/ginblog.git
    or
    git clone https://github.com/wejectchen/Ginblog.git
  2. 转到下面文件夹下

    cd yourPath/ginbolg

  3. 安装依赖

go mod tidy
  1. 初始化项目配置config.ini
./config/config.ini

[server]
AppMode = debug # debug 开发模式,release 生产模式
HttpPort = :3000 # 项目端口
JwtKey = 89js82js72 #JWT密钥,随机字符串即可

[database]
Db = mysql #数据库类型,不能变更为其他形式
DbHost = 127.0.0.1 # 数据库地址
DbPort = 3306 # 数据库端口
DbUser = ginblog # 数据库用户名
DbPassWord = admin123 # 数据库用户密码
DbName = ginblog # 数据库名

[qiniu]
# 七牛储存信息
AccessKey = # AK
SecretKey = # SK
Bucket = 
QiniuSever =
  1. 在database中将sql文件导入数据库

    推荐navicat或者其他sql管理工具导入

  2. 启动项目

 go run main.go

此时,项目启动,你可以访问页面

首页
http://localhost:3000
后台管理页面
http://localhost:3000/admin

默认管理员:admin  密码:123456

enjoy~~~~

==使用、二开过程中,发现问题或者有功能需求欢迎提交 Iusse 或者直接 PR==

实现功能

  1. 简单的用户管理权限设置
  2. 用户密码加密存储
  3. 文章分类自定义
  4. 列表分页
  5. 图片上传七牛云
  6. JWT 认证
  7. 自定义日志功能
  8. 跨域 cors 设置
  9. 文章评论功能

技术栈

  • golang
    • Gin web framework
    • gorm(v1 && v2)
    • jwt-go
    • scrypt
    • logrus
    • gin-contrib/cors
    • go-playground/validator/v10
    • go-ini
  • JavaScript
    • vue
    • vue cli
    • vue router
    • ant design vue
    • vuetify
    • axios
    • tinymce
    • moment
  • MySQL version:8.0.21

项目预览

  • 前端展示页面

 

  • 前端展示页面

 

  • 后台登录页面

  • 后台管理页面

更新进度(制作视频已基本全部更新完毕)

后端完成

第一节 初始化项目+配置参数

第二节 配置数据库,数据模型

第三节 构架错误处理模块和路由接口

第四节 编写用户模块接口,实现初步验证+分页功能

第五节 用户密码加密存储策略介绍及选择

第六节 编写编辑用户信息+删除用户接口

第七节 完成博客分类接口编写

第八节 编写博客文章接口(新增、编辑、删除)

第九节 完成博客文章接口(文章和分类的关联查询)

第十节 编写登录接口,完成 JWT 中间件

第十一节 完成登录接口

第十二节 完成上传接口(GIN+七牛对象储存)

第十三节 处理日志系统(自定义日志、按时间分割日志、软连接最新日志)

第十四节 后端数据验证、跨域参数配置、增加列表查询的总数返回

前端后台管理页面完成

第一节 前端初始化,开发环境搭建及相关依赖安装

第二节 编写登录页面,实现数据双向绑定和数据验证

第三节 完成登录页面

第四节 配置路由导航守卫,搭建后台管理页面框架

第五节 完成后台页面菜单栏和页面路由跳转

第六节 编写用户列表页面

第七节 用户列表搜索和删除功能

第八节 完成用户列表新增用户和编辑用户功能

第九节 修复部分 BUG

第十节 编写分类列表和文章列表页面

第十一节 完成新增文章和编辑文章页面

第十二节 自定义封装 tinymce 富文本编辑器,实现编辑器本地上传图片等功能

第十三节 后台页面完结,vue 打包部署

前端展示页面(更新完毕)

第一节 搭建项目框架

第二节 编写主内容区+个人介绍

第三节 完成个人简介更新功能

第四节 完成文章列表页面

第五节 完成文章详情页面

 

本文转载至 https://blog.scjglaw.cn/article/detail/1