> ## 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 # 最初の機能を作る 新しい画面からサーバー検証済みデータまでのエンドツーエンドのウォークスルー。 ## 初心者向けのウォークスルー 前提条件: 以下の 2 つの初心者ガイドを読み、Mobile ローカル セットアップを完了し、このリポジトリをルートでエディターで開きます。Mobile の設定は `apps/mobile/.env.local` に入れます。Expo はルートの .env を読みません。プレビューには実データ用に到達可能なバックエンドが必要です。 簡単に説明すると、ワークスペースは 1 つのチームの個別のユーザー、データ、設定です。サーバーは信頼できるバックエンドです。プロバイダー キーがブラウザーや電話コードに含まれないようにします。移行は、テーブルを作成または更新する、バージョン管理されたデータベースの変更です。 AI モデルは答えを返すエンジンです。モデル カタログは、使用可能なモデル ID と価格のサーバーのリストです。プロバイダーは、AI、電子メール、請求サービスなどの外部サービスです。資格は、ワークスペースで機能を使用できるようにする付与です。 Webhook は、あるサービスが別のサービスの URL に送信するメッセージです。 1. `.agents/skills/add-a-mobile-screen/SKILL.md` を開く — またはコーディング エージェントに従わせる — 小さな画面を 1 つ作成します。例えば `apps/mobile/app/(app)/ideas.tsx` にロジックを `apps/mobile/src/ideas/` に置きます。 2. 実行中のプレビュー経由でデバイスの新しい画面を開き、サインイン済みメンバーに対してレンダリングされることを確認します。 3. サインアウトしたアカウントと第 2 ワークスペースのアカウントを確認します — 非公開のままであるべきものは拒否されるか存在しないはずです。サーバーが境界を強制するためです。 カスタム コードでは、画面名、表示するデータ、誰が見られるか、処理するエラーを指定します。このタスクをコーディング エージェントに渡し、`AGENTS.md`、`.ai/PROJECT_CONTEXT.md`、および変更するファイルの `.ai/` ミラーを読ませ、編集前にファイルとチェックを列挙させ、差分を見せてもらいます。サンプル値を使用し、実際のシークレットは決して貼り付けないでください。 [始める前に](https://supastack.dev/ja/docs/mobile/before-you-start.md) 【端末の基本】(/docs/mobile/terminal-basics) [モバイルローカルセットアップ](https://supastack.dev/ja/docs/mobile/ship-in-5-minutes.md) [エージェント プロンプトとプロジェクト メモリ](https://supastack.dev/ja/docs/mobile/agents.md) ## 画面を作成する `apps/mobile/app/(app)/` 下にルート ファイルを追加します — Expo Router がそのファイルをサインイン済みスタック内の画面に変えます。`apps/mobile/src/ui` プリミティブ (Screen、Card、Title、Detail、AppButton) で構成し、アプリのスペーシング、タイポグラフィ、色を継承させます。 ``` apps/mobile/app/(app)/ideas.tsx apps/mobile/src/ideas/index.ts apps/mobile/src/ideas/index.test.ts ``` ## 型付きクライアントで読み書きする `apps/mobile/src/api/client.ts` 経由で fetch します。これは保存済みセッションを `EXPO_PUBLIC_API_URL` への各リクエストに添付し、型付きエラーを返します。ペイロードは Web 契約と同一に保ちます — 同じエンドポイントが両方のクライアントにサービスを提供します。 画面がワークスペース データを読む場合は、`apps/mobile/src/offline/` のヘルパーで呼び出しをラップし、ネットワーク エラー時にキャッシュ コピーにフォールバックできるようにします — ネットワーク エラーのみで、認証や権限エラーの後には決して行いません。 ## サーバーに所有権を決定させる サーバーはサインイン済みメンバーとアクティブなワークスペースを解決し、すべてのレコードを `workspaceId` でスコープします。アプリはサーバーが返すものを表示します。サーバーが信頼すべきワークスペース ID を送信することは決してありません。 必要なデータにエンドポイントがない場合は、まずバックエンドに追加します — ビジネス ルールはサーバーにあります。アプリ内の非表示ボタンはアクセスを強制しません。 ## アクセスとリカバリを確認する サインイン済みメンバー、別ワークスペースのメンバー、サインアウト セッション、機内モードを確認します: メンバー データは表示され、他者のデータは拒否され、サインアウトしたデバイスはサインインに戻り、オフライン コピーはネットワーク エラー時のみ提供されます。 [オフライン読み取りキャッシュ](https://supastack.dev/ja/docs/mobile/offline.md) [Mobile セキュリティ チェックリスト](https://supastack.dev/ja/docs/mobile/security.md) ## 状態を磨く 共有プリミティブで画面にローディング、空、エラーの各状態を与え、すべての新しい文字列を 4 つの i18n カタログに追加し、メンバーが実際に見つけられるようルートをホームまたは設定ナビゲーションに配線します。 ## 次へ [コーディングエージェントで構築する](https://supastack.dev/ja/docs/mobile/agents.md)