histcat

histcat

博客の更新

博客大更新!#

如果你点进来了这篇文章,那么你一定已经看到了博客的变化了(QWQ)

动机#

更新博客的动机也比较简单,hexo 的 miracle 主题停止更新了,再加上想要练习一下自己的前端知识,就下决心要改博客

在 vue,valaxy,astro 之间徘徊了好久,vue 因为 spa 对 seo 的优化不太好,放弃了;valaxy 的文档写的不太完善,看不太懂,最终还是选择了 astro

过程#

显然以我现在的前端知识从头开始写是不太可能的,于是选择了 hexo 的 journal 主题作为模板,把它迁移到 astro

迁移的过程中参考了 astro-paper 和 Frosti 两个主题来编写代码,不过最后感觉写出了一坨屎山

简介#

源码全部都放在了/src目录下

/public目录下只有一个 js 文件,负责网站的动态行为,包括

  1. 宽屏模式下的返回顶部
  2. 窄屏模式下抽屉功能的实现
  3. 窄屏模式下顶部标题的展现

/page#

page 目录是 astro 的路由目录

内含有 post 目录,负责文章的路由;archives 负责归档,category 负责分类界面,page 负责首页的文章展示,index 实现了和/page/1一样的功能

/style#

存放 css 文件

layout#

负责每一个界面的具体实现

其中 BaseLayout 是总体的 layout 实现

component#

可以复用的组件,未来的 comment 也要写在这里

utils#

一些工具组件

成果#

最后的成果就是展示在你面前的博客了,不过到现在还是只完成了一部分,还有好多细节要更新。

如果感兴趣的话,可以看一看github.com/histcat/blog源码,

加载中...
此文章数据所有权由区块链加密技术和智能合约保障仅归创作者所有。