iT邦幫忙

鐵人檔案

2024 iThome 鐵人賽
回列表
Modern Web

30天用Vitepress 開啟我的"部落客"生活 系列

用30 天 使用 Vitepress + typescript + Github 架設自己的部落格

鐵人鍊成 | 共 30 篇文章 | 7 人訂閱 訂閱系列文 RSS系列文
DAY 1

[Day01] - Opshell 的碎碎念 - 前言

緣起: 在全端打滾久了後,終於在去年底默默轉職了純前端,更多東西要塞進我小小的腦袋裡,但是度過了一段很充實的時光,只是心心念念的部落格就離我越來越遙遠了......

2024-09-02 ‧ 由 Opshell 分享
DAY 2

[Day02] - 環境準備&對齊

看一篇文章最大的不是寫的爛,而是他環境跟你差的遠遠的。-------------------- By Opshell ※ 廣告:請考慮到Opshell's...

2024-09-03 ‧ 由 Opshell 分享
DAY 3

[Day03] - Vitepress Blog

Why write & Why is vitepress 距離weblog(部落格) 線上日記型式的個人網站:張貼文章、圖片或影片,來記錄生活、抒發情...

2024-09-04 ‧ 由 Opshell 分享
DAY 4

[Day04] - 一切都是從 vitepress init 開始的

今天我們要來安裝、啟動還有調整 VitePress 的首頁,: 快速安裝 VitePress 可以單獨使用,也可以安裝到現有專案中。在這兩種情況下,都可以使用...

2024-09-05 ‧ 由 Opshell 分享
DAY 5

[Day05] - Base Config Part 1

改完首頁樣式之後,就會開始想把 header 調整成自己想要的樣子了,看了 官方文件 就會知道,如果我們要調整 header 的內容,我們需要打開 docs/...

2024-09-06 ‧ 由 Opshell 分享
DAY 6

[Day06] - Base Config Part 2

沒想到簡單的 config 設定可以寫到兩天,接續昨天的 nav 之後,今天就從 sidebar 開始吧。 sidebar (側邊欄) 這邊是進入文章頁面的時...

2024-09-07 ‧ 由 Opshell 分享
DAY 7

[Day07] - 設定字型與CSS

共用的主題 config 設定完之後,部落格終於有了基礎的雛形啦~但是,使用的樣式都是 VitePress 預設的,今天就來改樣式吧~~~ 自訂字型 部落格最...

2024-09-08 ‧ 由 Opshell 分享
DAY 8

[Day08] - configs 拆分

config 拆分 加完了字型和 SCSS 之後 又要繼續在 config 加設定啦~~不過現在的 themeConfig 由於要一個個連結設定的原因,已經是...

2024-09-09 ‧ 由 Opshell 分享
DAY 9

[Day09] - 部署到 GitHub Pages

經過前幾天的水之後,我們部落格的基本設定應該都處理的差不多了,積極的看官可能都新增了一堆頁面在玩了,那我們今天就來正式部署出來,快速拉高成就感吧。 建立 Gi...

2024-09-10 ‧ 由 Opshell 分享
DAY 10

[Day10] - Anthony Fu's ESLint

從第二階段開始就會寫一些程式啦~終於開始擠牙膏出來了,在寫程式之前,我希望有個聰明靈活的小助手可以幫助我這個老眼昏花的碼農,首先想到的事 ESLint + P...

2024-09-11 ‧ 由 Opshell 分享