はじめに
こんにちは、Tanji です。今日からこのブログを正式に公開します。
長らく「自分のドメインで自分の言葉で書ける場所が欲しい」と思っていたものの、なかなか着手できずにいました。今回ようやくその一歩を踏み出せたので、軽くサイトの成り立ちを書き残しておきます。
なぜ今ブログなのか
- 業務知見やサイドプロジェクトの記録を、検索しやすい形で残したい
- Twitter や Discord などのフロー型では拾い直しが難しい
- 自分の運用基盤として「フルスタック Next.js を本気で動かす」題材が欲しかった
この 3 つが重なったタイミングで、ようやくテンプレート化までこぎつけました。
技術スタック
今回は 全部入りで Next.js 16 を試す ことを目的に組みました。
- Next.js 16 (App Router) — Server Components 中心の構成
- tRPC v11 — RSC からも Client からも同じ型で呼べる API 層
- Prisma 7 — Rust-free な WebAssembly ベースの新世代 ORM
- PostgreSQL (Supabase) — マネージドな Postgres + ローカル開発用の Docker
- Clerk — JWT ベースの認証 / ロール管理
- Cloudflare R2 — メディアストレージ（公開 / 非公開バケット分離）
- Sentry — エラーモニタリング + Source Map 自動アップロード
- Cloudflare Web Analytics + Speed Insights — 計測
- Vercel — ホスティング (Fluid Compute)
苦戦したポイント
Prisma 7 への移行で 1 日溶けました。旧ジェネレータで node_modules 配下に出力する旧来の構成だと、Next.js 16 の output file tracing が WASM の動的 import を辿れず、Vercel Lambda で初期化が落ちて全ページ 500。
結局、公式推奨どおりに新ジェネレータでソースツリーに出力し直したら一発で直りました。素直に公式に従うのが一番早い という当たり前の教訓を改めて。
このブログで書く予定のこと
- Next.js / TypeScript の実装メモ
- 個人開発の振り返り
- ハマったバグと解決の過程
- ときどき非技術な日記
しばらくは更新ペースを掴むために短めの記事を中心に書いていきます。よろしくお願いします。