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源碼,

載入中......
此文章數據所有權由區塊鏈加密技術和智能合約保障僅歸創作者所有。