📌 概要

本プロジェクトでは、

SSR（サーバーサイドレンダリング）を中心に構成されており、

クライアントコンポーネントと組み合わせた構成になっている。

👉 「SSR + クライアント」で高速表示と操作性を両立している

🏗 全体構造

app/page.tsx（サーバーコンポーネント / SSR）
  └── ClientApp.tsx（クライアント）
       ├── TaskForm.tsx
       ├── TaskList.tsx
       ├── Chart.tsx
       └── DashBoard.tsx

🚀 SSR（サーバーサイドレンダリング）

① app/page.tsx（メインページ）

export default async function Page() {
  const res = await fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/api/tasks`, {
    cache: "no-store",
  });
}

🧠 ポイント

🔄 処理の流れ

① ユーザーアクセス
② サーバーでDBからデータ取得
③ HTML生成
④ ブラウザに返却