🌐

Expo MCPサーバーで始めるAIネイティブ開発

に公開
AI
Expo
Model Context Protocol
tech

Expo開発者の皆さん、朗報です。
Expo公式が Expo MCP Server（Model Context Protocol対応のリモートサーバー）を提供し、AIがExpoプロジェクトと正しく・安全に・文脈を踏まえてやり取り出来るようになりました。これにより、ドキュメント探索、依存関係の導入、シミュレータを使ったUIの目視検証まで、AI駆動開発が一段と深くなります。

YouTube解説動画もあるので、ぜひご覧ください。
https://www.youtube.com/watch?v=dp9dpIgDxZQ

Expo MCPサーバーとは何か？

Expo MCP Server は、ExpoがホストするリモートMCPサーバー（https://mcp.expo.dev/mcp）で、Claude Code、Cursor、VS Code などのMCP対応ツールから接続できます。AIアシスタントはこれを介して、あなたのExpo環境を理解し、適切な支援を行えるようになります。利用には EASの有料プラン が必要です。

公式いわく：「AI支援ツールがExpo SDKを学び、シミュレータやReact Native DevToolsとも連携しながら、より正確な支援を提供できるようになる」とのこと。Using Model Context Protocol (MCP) with Expo（最終更新：2025-10-21）

何が出来る?？

  • 学習／リサーチ：最新のExpo公式ドキュメントを都度取得して回答に反映（例：「Expo Routerの使い方」「Deep Linkの実装を検索」）。
  • 依存関係の管理：npx expo install を用い、互換性のある推奨パッケージを追加（例：「SQLiteを追加してCRUDの雛形」）。
  • 視覚的な検証・自動化（ローカル機能）：iOSシミュレータのスクリーンショット取得、画面タップ、testIDによる要素特定などで、UIの表示やインタラクションを自動チェック。

サーバー機能とローカル機能

Expo MCP Serverは 二層構成 です。

  • サーバー機能（リモートのみで有効）
    例：search_documentation（ドキュメント検索）、add_library（推奨パッケージ導入）、generate_agents_md（設定ファイル生成 など）。
  • ローカル機能（開発サーバーをMCP対応で起動時）
    expo-mcp を導入し、MCPモードで expo start すると解放。automation_take_screenshot、automation_tap(_by_testid)、open_devtools、expo_router_sitemap などが使えます。

ローカル機能は SDK 54以降 が対象。iOSは現在 シミュレータ限定（物理デバイス未対応・macOSホスト必要）などの制限も明記されています。Using Model Context Protocol (MCP) with Expo（最終更新：2025-10-21）

セットアップ

  1. MCPサーバーの追加（リモート）
  • 種別：Streamable HTTP
  • URL：https://mcp.expo.dev/mcp
  • 認証：OAuth（Expoのアクセストークン推奨）
  1. Expo認証
  • EASダッシュボードから Personal access token を発行して利用、またはExpoアカウントでログイン。
  1. ローカル機能（推奨）
# プロジェクトに導入
npx expo install expo-mcp --dev

# Expo CLIで同一アカウントにログイン
npx expo whoami || npx expo login

# MCP対応で起動（SDK 54+）
EXPO_UNSTABLE_MCP_SERVER=1 npx expo start

起動・停止の度に、AI側のMCP接続をリフレッシュする必要があります。

従来のExpo開発と比べた革新点

  • 正確な一次情報への直接アクセス：回答の根拠に常に最新の公式ドキュメントを引けるため、古い記事に引っ張られにくい。
  • 依存関係の安全な導入：expo install で互換バージョンをAIが提案・適用。バージョン不整合による手戻りを抑制。
  • UI検証の自動化：スクショや擬似タップで“見た目”と“動作”を即座に確かめ、修正ループを短縮。
  • エディタ内完結のワークフロー：MCP対応ツールから一連の操作が出来るため、コンテキストスイッチが減る

具体的ユースケース

  • 「expo-notifications を追加してプッシュ通知を使いたい」
  • 「青い円のビューを追加して、正しく描画されるかスクショで検証して」
  • 「ボタンを追加して、タップでカウントが増えることを確認して」
    いずれも コード生成→実機（シミュレータ）確認→微修正 までをAIが支援するイメージです。

既知の制限（2025-10-21時点）

  • 同時に扱える開発サーバー接続は 1つ。
  • iOSローカル機能はシミュレータのみ（物理端末は未対応）、macOSホスト前提。
  • 機能一覧は expo-mcp／サーバー更新により変動しうる（最新は公式表を参照）。

今すぐ出来ること（安全運転の導入方針）

  1. リモート接続から始める：まずはMCPサーバーをツールに追加し、search_documentation や add_library で“確実に便利なところ”から。
  2. ローカル機能を段階投入：検証用プロジェクトで EXPO_UNSTABLE_MCP_SERVER=1 を使い、スクショ・タップなどの自動化を試す。
  3. 本番導入の前に運用ルール：どこまでAIに任せるか（生成コードのレビュー基準・CIでの可視化等）をチームで決める。※公式も“高度機能の再接続やプラットフォーム要件”を明示しているので、運用フローに織り込むと安定します。

まとめ

Expo MCPサーバーは、AI×Expo を“雰囲気”ではなく 公式の仕組み として結び付ける中核です。
正確なドキュメント参照／安全な依存導入／UIの視覚検証の自動化が 一本線 でつながり、エディタから離れずに素早く反復できます。まずはリモート機能で確実に効果を取り、ローカル自動化を段階的に足していきましょう。

参考

Discussion