Docusaurus Blog

🚀 Docusaurus を使ったブログサイトです。 GitHub Actions によって main ブランチに push された内容が自動的に GitHub Pages にデプロイされます。

プロジェクト構成

• フレームワーク: Docusaurus
• デプロイ先: GitHub Pages
• CI/CD: GitHub Actions
  • main ブランチにコミット/マージすると自動でビルド & デプロイ
• リポジトリ名: docusaurus-blog
• 公開 URL: https://futahei.github.io/docusaurus-blog/

セットアップ

依存関係のインストール

npm ci

開発サーバー起動

npm start

→ http://localhost:3000 で確認できます。

ビルド

npm run build

ビルド成果物は build/ に出力されます。

プレビュー

npm run serve

デプロイフロー

1. main ブランチへコミット or Pull Request をマージ

2. GitHub Actions が npm run build を実行し、Pages へデプロイ

3. 数十秒後、GitHub Pages で公開されます

   設定ファイル: .github/workflows/deploy.yml

運用 Tips

• ブランチ運用

  記事執筆は feat/post-記事名 ブランチで進め、PR を main にマージ → 自動公開。

• プレビュー環境

  下書きはローカルで npm start で確認。 必要に応じて PR 用の preview デプロイワークフローを追加可能。

• baseUrl の注意

  プロジェクトサイト（/docusaurus-blog/ 配下）で公開されるため、画像やリンクは useBaseUrl を使うのが安全。

• 静的ファイル

  static/ 配下に置いたファイルはそのまま build/ にコピーされます。画像や favicon はここに置く。

• SEO 対策

  docusaurus.config.ts の themeConfig で metadata や OGP 画像を設定。

• コード品質

  npm run lint / npm run typecheck を使ってコードチェック。必要なら GitHub Actions に統合可能。

• カスタムドメイン

  static/CNAME にドメイン名を記述し、GitHub Pages の設定でカスタムドメインを登録。

参考

• Docusaurus ドキュメント

• GitHub Pages Docs

• GitHub Actions Docs