> ## Documentation Index
> Fetch the complete documentation index at: https://supastack.dev/llms.txt
> Use this file to discover all available pages before exploring further.
> For the full documentation corpus in one file, fetch: https://supastack.dev/llms-full.txt

# 技術スタック

キットを支える技術とそれぞれの役割。

## 始める前に

[ファイル] → [フォルダーを開く] を使用して、Visual Studio Code でダウンロードした supastack プロジェクトを開き、[ターミナル] → [新しいターミナル] を選択します。リポジトリ ルートは、package.json、アプリ、およびパッケージを含むフォルダーです。そこで以下のコマンドを実行し、ターミナルを開いたままにしておきます。コマンドが認識されない場合は、続行する前にツールのインストール ガイドを完了してください。

まずプラットフォームのチュートリアルをお読みください。サーバーは、ブラウザまたは電話のリクエストに応答するアプリ プロセスです。 Web は apps/web/.env.local を読み取り、Expo は apps/mobile/.env.local を読み取り、データベース移行コマンドは root .env を読み取ります。データベースなしの /dashboard デモは、Postgres の移行が必要な実際の /auth アカウントとは別のものです。電話またはデスクトップのみのチェックアウトには、別途実行される Web バックエンドが必要です。

[ツールをインストールしてコードを取得](https://supastack.dev/ja/docs/web/before-you-start.md)

[コマンド、ファイル、設定を学ぶ](https://supastack.dev/ja/docs/web/terminal-basics.md)

[Web の初回実行チュートリアルを完了する](https://supastack.dev/ja/docs/web/ship-in-5-minutes.md)

```
corepack pnpm --filter @supastack/web dev
```


## アプリケーションスタック

Web アプリは共有 TypeScript パッケージで構成された Next.js アプリケーションです — 同じパッケージが Expo モバイルアプリにも使われます。プロダクトの UI はデザイントークン上の CSS Modules を使うため、デバッグすべきランタイム CSS-in-JS はなく、オブジェクトストレージは S3 互換です。以下のツールが意図的なデフォルトです。


## Next.js + React

Web アプリは App Router を備えた [Next.js](https://nextjs.org) 16 と [React](https://react.dev) 19 サーバーコンポーネントで動作します。

- [Next.js](https://nextjs.org)
- [React](https://react.dev)


## TypeScript + Turborepo

[TypeScript](https://www.typescriptlang.org) の strict モードは pnpm ワークスペース全体に適用され、[Turborepo](https://turborepo.com) がビルドを調整します。

- [TypeScript](https://www.typescriptlang.org)
- [Turborepo](https://turborepo.com)


## Better Auth

[Better Auth](https://better-auth.com) がアイデンティティエンジンです。標準化したいチーム向けに Auth.js エンジンも利用できます。

- [Better Auth](https://better-auth.com)


## Drizzle + PostgreSQL

永続化は [PostgreSQL](https://www.postgresql.org) 上の [Drizzle](https://orm.drizzle.team) ORM を通じて行われます。すべてのレコードが流れるスキーマとヘルパーです。

- [Drizzle](https://orm.drizzle.team)
- [PostgreSQL](https://www.postgresql.org)


## 請求

請求は [Stripe](https://stripe.com) がデフォルトで、[Lemon Squeezy](https://www.lemonsqueezy.com) アダプターも同梱されています。

- [Stripe](https://stripe.com)
- [Lemon Squeezy](https://www.lemonsqueezy.com)


## Trigger.dev

バックグラウンドジョブは [Trigger.dev](https://trigger.dev) で実行されます。

- [Trigger.dev](https://trigger.dev)


## トランザクションメール

トランザクションメールは [Resend](https://resend.com) または AWS SES 経由で送信されます。

- [Resend](https://resend.com)


## Sentry + PostHog

オブザーバビリティは [Sentry](https://sentry.io) と [PostHog](https://posthog.com) で構成されます。

- [Sentry](https://sentry.io)
- [PostHog](https://posthog.com)


## Expo

[Expo](https://expo.dev) モバイルアプリは同じ TypeScript パッケージを利用するため、コントラクトの変更は両方のサーフェスに対して同時に型チェックされます。Expo は iOS と Android 向けに提供されます。

- [Expo](https://expo.dev)


## 共有モジュール

横断的な各機能は小さなコントラクトを持つパッケージに格納されています: auth、db、billing、ai、jobs、email、storage、observability、config、i18n、api。アプリケーションがそれらを組み合わせ、プロダクト固有のドメインロジックはキットの外に置かれます。

プロバイダーに依存する各モジュールには fake またはローカルアダプターが付属し、デフォルトのテスト・開発サイクルが有料サービスを呼び出すことはありません。


## 検証ツール

Vitest がユニット・統合の動作をカバーし、Playwright がブラウザフローをカバーし、ESLint と Prettier がコードを一貫させます。決定的なスイートはプロバイダーの認証情報なしで実行でき、実プロバイダーによる受け入れは別の任意パスです。

```
corepack pnpm test          # deterministic unit + integration
corepack pnpm check         # lint, types, tests, format
corepack pnpm build         # production builds
corepack pnpm test:e2e      # browser flows
```


## 次へ

[ローカルセットアップ](https://supastack.dev/ja/docs/web/local-setup.md)