問答

最新作品

關於 Letter 佈景

Letter 佈景預覽圖

透過定義完善的 Markdown 和配置文件,輕鬆搭建自己的線上履歷作品集,甚至是個人問答。本網站基於Letter Portfolio 主題建構,並部屬在 GitHub Pages 上。

特色

  • Astro v6 + Tailwind v4
  • 超快 (100% lighthouse 分數)
  • 響應式頁面與 SEO 友善
  • 內建多語系
  • CI 流程 (ESLint + Prettier + TS Typecheck + Lighthouse)
  • CD 流程 (Cloudflare PagesGitHub Pages)

如何開始

開發

# 1. 複製倉庫
git clone https://github.com/riceball-tw/letter.git .

# 2. 安裝依賴
pnpm install

# 3. 運行開發伺服器
pnpm run dev

自定義

  1. astro.config.mjs: Astro 相關設定
    • site: 最終部屬的 URL
  2. /src/content: 全站設定、作品集、履歷與問答內容
  3. /src/i18n: 用於 Astro 模板當中的翻譯
  4. /public: 網站資產 (logo.svg, favicon…)
  5. /src/styles/global.css: 樣式
  6. /.github/workflows/deploy-pipeline.yml: GitHub CI/CD 流程 (可以設置以下環境變數)
    • LHCI_GITHUB_APP_TOKEN, LHCI_TOKEN: lighthouse 檢測使用
    • CLOUDFLARE_ACCOUNT_ID, CLOUDFLARE_API_TOKEN: Cloudflare Wrangler 部屬使用
    • BASE_URL: 前綴網站中每個連結與資產 (通常用於部屬沒有自訂網域的 GitHub Pages 時使用)

建構

# 1. 部屬 `./dist` 資料夾中的網頁
pnpm install
pnpm build
pnpm preview

# 2. 部屬透過 Docker
docker build -t <your-astro-image-name> .
docker run -p <local-port>:<container-port> <your-astro-image-name>

協助開發

有任何問題或需要幫助的地方都歡迎到 GitHub Issue 發起討論 。

授權

MIT