重要な部分では安定した技術を選択し、本当の差別化をもたらす部分では革新的なソリューションを採用することを信じています。スタックはデベロッパーエクスペリエンス、パフォーマンス、信頼性のために最適化されています。
フロントエンド
- Next.js 15 — すべてのウェブアプリケーションに選択したフレームワーク。App Routerはボックスアウトで優れたパフォーマンスと必要な柔軟性を提供します。ランディングサイトには静的エクスポートを、ダッシュボードにはSSRを使用します。
- TypeScript — 型安全性はオプションではありません。本番環境に届く前にバグをキャッチし、リファクタリングを安心して行えます。ランタイムバリデーションにZodと組み合わせることで、エンドツーエンドの型安全性を実現します。
- Tailwind CSS — スタイルシートを保守可能でデザインを一貫したものに保つユーティリティファーストのCSS。デザインシステムはテーミングのためにCSS変数を基に構築されています。
- Framer Motion — 自然でパフォーマンスの良いアニメーションのために。ページトランジション、マイクロインタラクション、データビジュアライゼーションのアニメーションに使用します。
バックエンドとインフラ
- Cloudflare PagesとWorkers — エッジファーストのデプロイにより、ユーザーがどこにいても速いレスポンスが得られます。WorkersはエッジでAPIリクエストを処理し、グローバルで50ms未満のレスポンスタイムを実現します。
- Honoフレームワーク — Workers上で動作する軽量で高速なAPIフレームワーク。Expressライクなパターンに完全なTypeScriptサポートと最小限のコールドスタートオーバーヘッド。
- Supabase — リアルタイムサブスクリプション、認証、ストレージを備えたPostgreSQL。Row Level Security(RLS)ポリシーがデータベースレベルでチームベースのマルチテナンシーを強制します。
- Cloudflare KV — レート制限、セッションロック、頻繁にアクセスされるデータのキャッシングのためのキーバリューストレージ。
- Cloudflare R2 — エグレス料金なしのオブジェクトストレージ。スクリーンショット、ヒートマップ、セッションリプレイのチャンクを保存します。
ビジュアライゼーション
- Mapbox GL JS — 滑らかなインタラクションとグローバルカバレッジを持つ3Dグローブビジュアライゼーションを実現。60fpsパフォーマンスのためにWebGLで高速化。
- Recharts — アナリティクスダッシュボード向けのクリーンで構成可能なチャート。折れ線グラフ、棒グラフ、面グラフ、円グラフに使用します。
- rrweb — セッションリプレイの記録と再生。DOM変異、マウスの動き、インタラクションをキャプチャし、機密データは自動的にマスクされます。
インテグレーション
- Stripe — 支払いとサブスクリプション。自動プラン適用を伴うWebhookドリブンの請求イベント。
- Resend — トランザクションメール配信。認証、レポート、通知に使用。
- Cloudflare Turnstile — CAPTCHAなしのボット保護。ユーザーを中断させない透明な確認。