dogvane/StarBlog

博客

支持Markdown导入的博客

后端基于最新的.Net6和Asp.Net Core框架，遵循RESTFul接口规范，前端基于Vue+ElementUI开发，可作为 .Net Core 入门项目学习~

博客已经上线，网址：http://blog.deali.cn

配套的管理后台（Vue + ElementUI）前端项目：https://github.com/Deali-Axy/StarBlog-Admin

配套了一系列的开发笔记记录本项目开发过程，欢迎关注

公众号	公众号

前言

OK，我也来造轮子了

博客系统从一开始用WordPress，再到后来用hexo、hugo之类的静态博客生成放github托管，一直在折腾

折腾是为了更好解决问题，最终还是打算自己花时间搞一个好了

为什么要自己开发博客？

找不到一个让我满意的在线博客
在线写博客体验不如在本地用typora写
写公众号推文的话注意力会分散一部分到如何写得吸引读者而不是文章本身
自己的网站才有完整的控制权，不会被垃圾平台添加不良信息污染

本项目实现的功能

本地markdown文章批量上传导入，根据目录结构解析文章分类（支持多级分类嵌套），解析markdown中的图片并导入到网站目录中
本地摄影作品批量上传，读取图片EXIF信息并导入
可以配置的博客主页（展示置顶和置顶的文章、图片、分类）
代码片段编辑与分享功能
后台需要完整的文章、分类、图片、代码片段编辑功能
博客前台需要有将文章快捷发表到微信公众号、知乎专栏、博客园、掘金等平台的功能

OK，大概就这些了~ 更多功能可能后面想到了就加上~

技术

后端：C# + AspNetCore
ORM：FreeSQL
markdown解析：Markdig
分页：X.PagedList
博客前台：Bootstrap + Vue + editor.md + bootswatch
管理端：Vue + Vuex + VueRouter
管理端UI：SCSS + ElementUI

项目结构

StarBlog.Contrib：一些共享库
StarBlog.Data：数据模型
StarBlog.Migrate：博客文章导入，运行该项目可以将markdown文章批量导入
StarBlog.Web：博客主项目

Build

本项目基于 .Net6 开发，构建之前请确保已经安装 .Net6 SDK。

本项目的前端资源使用 NPM + Gulp 管理，可使用 NPM 或 Yarn 安装依赖：

详情可以查看这篇博客：Asp-Net-Core开发笔记：使用NPM和gulp管理前端静态文件

在 StarBlog.Web 目录下执行命令

npm install
// 或者
yarn

安装 gulp-cli 工具

npm install --global gulp-cli

执行gulp任务（同样是在 StarBlog.Web 目录下执行命令）

gulp move

然后运行 StarBlog.Web 项目即可

博客截图

放几个截图咯

博客主页

文章列表

摄影页面（虽然现在还没把拍的照片放上去就是了）

管理后台主页

后台文章列表

文章编辑界面

后台图片列表

篇幅关系就放这些图片了~

博客马上就部署上线了，到时直接上demo链接！

代码高亮：

本来是打算拿Markdig的几个第三方插件来试验的，测试后勉强能用就以下两个

Markdig.Prism：前端渲染，但需要服务端组件配合
Markdown.ColorCode：服务端渲染

结果效果都不是很理想，今晚（2022-2-17）看阿星plus的博客，看到Editor.md这个组件也可以渲染HTML，立即测试了一下，好用！

所以最终我的markdown渲染HTML以及代码高亮由Editor.md承包！

（PS：Markdig组件先保留吧）

About

☀☀支持Markdown导入的博客。后端基于最新的.Net6和Asp.Net Core框架，遵循RESTFul接口规范，前端基于Vue+ElementUI开发，可作为 .Net Core 入门项目学习~

http://blog.deali.cn

Apache License 2.0

Languages

Language:C# 69.4%Language:HTML 20.0%Language:JavaScript 6.9%Language:CSS 3.2%Language:Dockerfile 0.6%

博客

前言