k2wanko.dev

個人ブログサイト - Astro + React + TypeScriptで構築

技術スタック

• フレームワーク: Astro 4.x
• UI: React 18 + TypeScript
• スタイリング: Tailwind CSS
• パッケージマネージャー: Bun
• リンター/フォーマッター: Biome
• ホスティング: Firebase Hosting

開発環境のセットアップ

# リポジトリのクローン
git clone https://github.com/k2wanko/k2wanko.dev.git
cd k2wanko.dev

# 依存関係のインストール
bun install

# 開発サーバーの起動 (http://localhost:4321)
bun dev

開発コマンド

# 開発サーバーの起動
bun dev

# プロダクションビルド
bun run build

# ビルド済みサイトのプレビュー
bun run preview

# リント & 型チェック
bun run lint

# コードフォーマット
bun run format

# リント & フォーマットの自動修正
bun run check:fix

デプロイ

Firebase Hostingへのデプロイ:

# ビルドとデプロイを実行
bun run deploy

※ 事前にFirebase CLIのセットアップと認証が必要です

プロジェクト構造

/
├── src/
│   ├── content/
│   │   └── blog/        # Markdownブログ記事
│   ├── pages/           # Astroページ
│   ├── components/      # React/Astroコンポーネント
│   ├── layouts/         # レイアウトテンプレート
│   └── styles/          # グローバルスタイル
├── public/              # 静的アセット
├── astro.config.ts      # Astro設定
├── tailwind.config.ts   # Tailwind CSS設定
├── biome.json          # Biome設定
└── firebase.json       # Firebase設定

ライセンス

MIT License