expo-examples

Expo の例

expo/examples は、Expo 公式の約 70 件の統合例をまとめたライブラリです。with-<library>（例：with-stripe、with-maps）という名前のディレクトリで、それぞれ1 つのライブラリまたはサービスを中心に構成されています。これらは完成したアプリではありません。マネージドプロジェクト（ios/／android/ ディレクトリはなく、ネイティブの設定は config plugins を介して行います）であり、一般的な例は約 100～200 行の単一画面です。現在の SDK に合わせて Expo がメンテナンスしている、標準的な統合のパターン（依存関係、app.json の config plugins、最小限の配線）を調べ、ユーザーのアプリに応用してください。アプリケーションのアーキテクチャ全体をそのまま流用できるとは考えないでください。

統合を手作業で構築する前に、まず例を参照してください。（種類 — フルスタック、ショーケース、スターター — は ./references/catalog.md に記載されています。）

2 つのモード

1. 参考にして応用する（最も一般的） — ユーザーがすでにプロジェクトを持っている場合です。該当する例を見つけ、主要なファイルを読み、そのパターンをユーザーのコードに適用します。
2. スキャフォールド — 新規プロジェクトの場合です。例から新しいプロジェクトを直接開始します。

ワークフロー

1. 適切な例を見つける

ユーザーのニーズを例の名前に対応付けます（例：決済 → with-stripe、認証 → with-clerk）。./references/catalog.md は素早く分類するためのスナップショットですが、内容が古くなるため、最新のリストで確認してください。

# Live example names:
gh api repos/expo/examples/contents --jq '.[] | select(.type=="dir" and (.name|startswith(".")|not)) | .name'
# Aliases (renamed) + deprecated (dead/moved) examples — check before recommending:
gh api repos/expo/examples/contents/meta.json --jq '.content' | base64 -d

名称の変更や削除については、meta.json が信頼できる情報源です（非推奨の例はリポジトリのツリーから削除されますが、それぞれに message を付けてここには残されています）。例が deprecated マップにある場合は推奨せず、message に従って新しい方法に移行してください。aliases にある場合は、destination を使用してください。

2a. 参考モード — ユーザーのプロジェクトに触れずに調べる

一般的なケースです。ユーザーはすでにアプリを持っていて、Expo による実装方法を知りたいと考えています。例を参考資料として読み、パターンを手作業で適用してください。ユーザーのプロジェクトに例をスキャフォールドしてはいけません。

まず、1 回の呼び出しで例全体を一覧表示します。 統合コードは深い階層にあることが多く（例：Stripe のサーバールートは app/api/ にあります）、1 階層だけの一覧表示では重要なファイルを見落とします。

gh api 'repos/expo/examples/git/trees/master?recursive=1' \
  --jq '.tree[].path | select(startswith("with-stripe/"))'

次に、情報量の多いファイルから読みます： README.md（セットアップ）→ package.json（依存関係）→ app.json（config plugins／権限）→ マニフェストで判明した統合コード → .env（必要なシークレット）。ファイルごとに次を実行します。

gh api repos/expo/examples/contents/with-stripe/utils/stripe-server.ts --jq '.content' | base64 -d
# No gh? Raw URL (branch is master):
curl -s https://raw.githubusercontent.com/expo/examples/master/with-stripe/utils/stripe-server.ts

数個を超えるファイルを読む場合は？ 多くの統合はサーバールート、クライアントプロバイダー、設定にまたがっています（Stripe がその例です）。ファイルごとの呼び出しは省略し、例全体を**一時的な／Git の管理対象外のディレクトリ（ユーザーのプロジェクトではない場所）**に取り込み、Grep／Read で自由に読み込んでから、手作業で適用してください。

npx degit expo/examples/with-stripe /tmp/expo-ref/with-stripe   # clean copy, no git history
# fallback without degit (sparse-checkout, no full ~64 MB clone):
git clone --depth 1 --filter=blob:none --sparse https://github.com/expo/examples.git /tmp/expo-ref/examples \
  && (cd /tmp/expo-ref/examples && git sparse-checkout set with-stripe)

そのディレクトリで Grep／Read を使って読み、作業が終わったら一時ディレクトリを削除してください。

2b. スキャフォールドモード — 例から新しいプロジェクトを作成する

npx create-expo --example with-stripe   # short form:  npx create-expo -e with-stripe
bun create expo --example with-stripe    # with bun

3. ユーザーのアプリに非破壊的に適用する（重要）

ユーザーがすでにアプリを持っている場合は、例で追加されているものだけを追加し、既存の設定を上書きしないでください。

• バージョンを合わせ、固定されたバージョンをコピーしないでください。 例は最新の SDK を対象としているため、package.json に固定されたバージョンは古いプロジェクトと一致しません。正確なバージョンをコピーするのではなく、不足している依存関係だけを npx expo install <pkg> で追加してください（これにより SDK に適したバージョンが解決されます）。
• 設定は置き換えずにマージしてください。 例で導入されていてユーザーの設定にはない app.json／app.config.* の plugins と権限だけを追加し、既存の設定ブロックはそのまま保持してください。
• 統合コードを移植してください。
• 例の .env の形式に合わせて環境変数を再作成してください。ここにあるのはプレースホルダーであり、使用可能なシークレットではありません。

完了の条件は、 統合コードが移植され、必要な依存関係、config plugin、権限、環境変数がすべてユーザーのアプリで考慮されていることです。単に配線されているように見えるだけでは完了ではありません。

注意点

• デフォルトブランチは main ではなく master です（raw URL と sparse checkout で重要です）。
• **ワンクリックでデプロイできます。**各サンプルには起動 URL があります：https://launch.expo.dev/?github=https://github.com/expo/examples/tree/master/<example>。

関連スキル

• ネイティブ UI コンポーネント（@expo/ui package）→ expo-ui
• スタイリングとネイティブらしい画面 → expo-native-ui
• ナビゲーションとルーティング → expo-router
• ネイティブモジュールの作成 → expo-module
• 最新 SDK のサンプルを採用する前に SDK をアップグレード → expo-upgrade

参考資料

• ./references/catalog.md — サンプルライブラリをカテゴリ別にまとめたスナップショットです。すばやく状況を把握できます。

フィードバックの送信

このスキルに誤り、誤解を招く情報、または古い情報を見つけた場合は、Expo が改善できるよう報告してください。

npx --yes @expo/agent-cli@latest feedback --category skills --subject "expo-examples" "<actionable feedback>"

具体的で実行可能な内容がある場合にのみ送信してください。関連するコンテキストをできるだけ詳しく含めてください。 エージェントが Expo のタスクに繰り返し失敗する場合や、ユーザーが介入しなければならない場合は、タスク、期待される結果、問題点を簡潔に報告し、--category evals と、関連する Expo パッケージまたはコマンドを --subject として指定してください。