Expoとは？React Nativeでの使い方とエラー対処

React Nativeを調べていると、必ずExpoという名前に行き当たります。使うべきなのか、React Nativeと何が違うのか、最初は分かりにくい部分です。

この記事では、Expoの正体と使い方、そしてつまずきやすい箇所を公式ドキュメントに沿って解説します。

Expoとは

公式ドキュメントには、次のように書かれています。

Expoは、AndroidとiOSのアプリ開発をより簡単にするReact Nativeのフレームワークである

公式によれば、Expoはファイルベースのルーティングや、ネイティブモジュールの標準ライブラリなどを提供します。オープンソースで開発されています。

ここで思い出してほしいのが、React Native側の公式サイトの記載です。React Nativeは「ルーティングの方法やプラットフォームAPIへのアクセス方法を規定しない」とされており、そのうえで新しいアプリを作るならExpoのようなフレームワークを推奨しています。

つまりExpoは、React Nativeが意図的に決めていない部分を埋める存在です。React NativeそのものについてはReact Nativeとは？Flutterとの違いを比較して解説で解説しています。

Expoを使うと環境構築が軽くなる

これがExpoを選ぶ最大の理由です。React Nativeの公式ドキュメントには、フレームワークを使う場合Android StudioやXcodeの環境構築は必須ではないと明記されています。フレームワーク側がネイティブアプリのビルドを引き受けるためです。

逆に使わない場合、公式は導入と設定に1時間ほどかかると案内しています。学習を始めたい段階でこの時間を使うのは、あまり良い投資とは言えません。

必要なもの

Expoの公式ドキュメントが示すシステム要件は、次のとおりです。

• Node.js（長期サポート版）
• macOS、Windows（PowerShellおよびWSL 2）、Linuxに対応

WindowsでもMacでも始められます。ただし前述のとおり、実機のiOS向けに本格的なビルドを行う段階ではMacが関わってきます。

プロジェクトを作る

公式は、まず既定のプロジェクトから始めることを推奨しています。作成コマンドは次のとおりです。

npx create-expo-app@latest

公式によれば、この既定のプロジェクトには開始の助けになるサンプルコードが含まれています。

別のテンプレートから始めたい場合は、テンプレートを指定するオプションが用意されています。また、Expoの例から始めることもでき、公式には一覧から対話的に選ぶ方法も記載されています。

Expo GoとDevelopment buildの違い

ここがExpoで最も誤解されやすい部分です。公式ドキュメントは、開発の進め方として2つを明確に区別しています。

	Expo Go	Development build
位置づけ	学ぶ人がExpoを手早く試すための遊び場	開発者ツールを含んだ自前のアプリのビルド
独自のネイティブモジュール	対応していない	対応している
想定用途	基本の理解、お試し	本番のプロジェクト

公式はExpo Goについて「遊び場のアプリであり、制限があるため、本番品質のプロジェクトを作るのには役立たない」とはっきり書いています。

学習の最初はExpo Goで問題ありません。ただし本気で作り始める段階で必ずDevelopment buildに移ることを、最初から想定しておいてください。この前提を知らずに進めると、後半で行き詰まります。

Expo Goの始め方

公式ドキュメントでは、Android端末の場合、Google PlayストアからExpo Goを入手する手順が案内されています。開発マシンで起動したプロジェクトのQRコードを端末で読み取れば、実機で動作を確認できます。

なお公式は「実際の利用者が見るものをそのまま確認できる」という理由から、実機での開発を推奨しています。エミュレータやシミュレータでの開発も選択できます。

つまずきやすい箇所と対処

インストールできない・コマンドが動かない

まず確認すべきはNode.jsです。公式が求めているのは長期サポート版です。最新の開発版や、古いまま放置されたものを使っていると、想定外のエラーが起きます。

あわせて、作成コマンドの末尾にある最新版の指定を省いていないかも確認してください。古いバージョンが使われると、ドキュメントと手順が合わなくなります。

ライブラリを入れたら動かなくなった

Expo Goで独自のネイティブコードを必要とするライブラリを使おうとすると、この状況になります。公式の区分どおり、独自のネイティブモジュールに対応しているのはDevelopment buildのほうです。移行を検討してください。

実機とつながらない

QRコードを読み取っても接続できない場合、開発マシンと端末が同じネットワークにいるかを確認します。社内ネットワークや公衆無線では、端末同士の通信が遮断されていることがあります。

エラーメッセージが読めない

エラーの多くは、文面に対処方法が含まれています。分からない単語があっても、まず全文を最後まで読んでください。推測で設定を変更すると、原因の切り分けができなくなります。

Expoを使うべきか

• 学習目的：使うべき。環境構築の負担が大きく下がる
• 新規のアプリ開発：React Native公式が推奨している
• 既存アプリへの組み込み：状況によるため、構成を確認してから判断する

Flutterと迷っている段階なら、Flutterとは？できること・できないことを初心者向けに解説も併せて確認してください。

まとめ

• ExpoはAndroidとiOSの開発を簡単にするReact Nativeのフレームワーク
• React Nativeの公式も、新規開発でのフレームワーク利用を推奨している
• フレームワークを使えばAndroid StudioやXcodeの環境構築は必須ではない
• Expo Goはお試し用、本番はDevelopment build
• 動かないときはNode.jsの版と、Expo Goの制限を疑う