【致关注者】个人博客网站上线(附技术栈)

一年前,我尝试搭建了下面这个个人博客网站来提供更良好的浏览体验。

但是彼时的我没有选择深入研究这一方面的技术栈和工作流,一方面单纯把静态页面挂在GitHub上在国内访问很不稳定,另一方面从obsidian到hugo博客框架的附件迁移也十分繁琐,以至于我最终放弃了对它的维护。

一年之后,随着文章数量和种类的增多,我觉得我不得不采取更好的方式发布我的内容了。于是我又流连于数字花园这一概念,并且似乎摸到了一些能动动手指头直接将obsidian原生形式发布为网站的门道,却屡屡碰壁。而这个过程中的一次必应搜索让我偶然走进了时歌的博客(www.lapis.cafe)。

我再一次为一个个人网站所能达到的大气、美观、个性所动容。

而这一次,我相信一定有方法,能够让obsidian到博客的工作流不再繁琐,能够让大家更流畅地访问我的博客,并且最终实现了。大家可以通过www.inkem.space访问。

因为过程太过于波折,在此我只简述一下我搭建博客所用的框架和要点,也许会对其他想做个人网站的人有所帮助。

我使用由Astro驱动的Mizuki博客主题,将博客仓库上传至GitHub后在Vercel进行部署。域名在阿里云购买(选择space域名是因为它有10年249元的白菜价),通过Cloudflare解析到Vercel并提供CDN加速,从而实现更流畅的国内访问。站长之家可以进行国内访问测速。

上述基础工作完成后,可以使用谷歌的PageSpeed Insights分析自己的网站,它会提供详细的提升网站性能的方向。我基本上全丢给AI帮我进一步解释,一些通用措施有内联关键CSS样式(Critical CSS Generator网站可以帮你生成)、异步运行js脚本、图像webp压缩(推荐Squoosh)等。

由于obsidian和Astro的附件语法、路径都不统一,在转移时很麻烦,所以我采用了腾讯云cos作为图床,本地图片可以由picgo直接上传至图床并生成Markdown语句。obsidian的auto image upload plugin可以一键将一篇文章的所有图片都通过picgo上传并替换语法为图床引用,由此便只需将文章复制到Astro的相应文件夹下,无需再挪动附件。在obsidian中我还是选择在语法替换后撤回编辑操作,保留本地引用以防万一。

除此之外,博客这边的Twikoo评论、pagefind搜索、bangumi追番记录等也把我搞得焦头烂额,尤其是pagefind搜索本地部署与服务器部署表现不一致的问题十分诡异,因此入门建站还是推荐使用一些功能、配置都比较简单的主题框架。

总之,后续的文章都推荐大家在我的个人博客网站上浏览以获得更好的体验。我也会将其视为比平台更加自由的创作空间,发布更丰富的内容。

感谢大家的支持。

相关推荐
小小资源铺7 天前
Foxiz v2.7.0 – WordPress 报纸新闻和杂志博客出版网站主题
博客·网站模板·wordpress 主题·foxiz·杂志·新闻门户
小小资源铺8 天前
Vault – 多功能 Elementor WordPress 主题 v3.2.6
博客·vault·企业网站·wordpress 主题·线上商店
南知意-9 天前
从零搭建 Live2D 看板娘教程(自建API避墙版)
服务器·前端·vue.js·开源·博客·美化·看板娘
AwakeFantasy25 天前
关于fluid打字机问题的解决记录
javascript·博客·hexo·fluid
梅花141 个月前
基于Django的博客系统
后端·python·django·毕业设计·博客·博客系统·毕设
知了一笑2 个月前
互联网十年,从博客到知识库
笔记·博客·知识库·自媒体
七仔的博客2 个月前
Vue视差标题背景
vue·博客·动画·视差
七仔的博客2 个月前
博客的加载速度和大小的优化、优化再优化
vue·博客·优化·gzip·live2d
mjhcsp2 个月前
博客安全攻防演练:从实战视角构建全方位防护体系
网络安全·博客