対象読者
- モバイルアプリを作ってみたいReactエンジニア
- モバイルアプリのリリース作業を手軽に行いたい方
前提環境
筆者の検証環境は以下の通りです。
- macOS Sequoia 15.0.1
- Node.js 22.10.0
- npm 10.9.0
- Expo 51.0.38
- React Native 0.74.5
React Nativeに直接含まれるモジュールは少ない
本連載ではExpoというフレームワークを中心に解説していきますが、Expoを利用してモバイルアプリ開発を行う場合でも、そのベースとなるReact Native固有のモジュールが隠ぺいされるわけではありません。そのため、今回は基礎編として、React Nativeの基本的なモジュールをおさらいしていきます。
基礎という意味ではReactの各種APIの知識も必要ではありますが、JSXの扱いやフック等はブラウザ向けのReactと同じように扱えるため、本連載では割愛します。Reactの基礎から学びたい場合は、React公式サイトなどを参照してください。
まずは、React Nativeのモジュールについての考え方を整理しておきましょう。筆者が認知している範囲では、「React Native」と呼ばれるものには次の3つの側面があります。
- モバイルアプリ上でJavaScriptランタイムとReactアプリケーションを動作させ、JavaScriptコードとネイティブコードの橋渡しを行うミドルウェア
- モバイルアプリのGUIを構築するベースとなる、Reactコンポーネントを提供するモジュール
- UI表示以外の機能を提供するモジュール（例：クリップボード、GPS、音声再生など）
これらのうち、（1）はAndroidやiOSのライブラリとして提供されるものであり、React Nativeの最もコアな部分です。その上で、（2）と（3）がReact Nativeの標準ライブラリとして提供されている形になります。
（2）と（3）の種類のモジュールは、私たち一般の開発者でも所定のAPIに沿って開発することで、サードパーティモジュールとして作成し、各自のアプリに組み込むことができます。そう考えると、React Nativeというフレームワークの本質的な部分は、（1）のミドルウェア部分だけなのかもしれません。
実際に、React Nativeの現行のアーキテクチャは、「Lean Core（最小限のコア）」の方針で設計されています。Meta社のReact Native開発チームは、React Native本体に含めるモジュールを最小限にしています。また、豊富な機能を持った便利なモジュールは、Expoなどのサードパーティ（多数の企業を含む）によって開発されています。
本連載でも、次回以降、主にExpoが提供する各種モジュールを解説していきます。これらを組み合わせることで、実用的なモバイルアプリを開発していくことができることでしょう。
Lean Coreの方針が決まって以降、かつてReact Nativeの本体に含まれていたモジュールは、次々とサードパーティでの開発に移行していきました。しかしながら、前述の（2）や（3）の種類のモジュールの中にも「最小限」のくくりに収まって、React Native本体に残ったものがあります。これらのモジュールは、Expoを前提とした開発環境でも、React Nativeのモジュールとして直接インポートして使用する機会が多いです。今回は、そういったモジュールのうち、特に基本のコンポーネントを解説しましょう。
実験用のプロジェクトを作成する
今回の実験用のプロジェクトを作成しましょう。リスト1のコマンドを実行して、Expoプロジェクトを作成します。
$ npx create-expo-app@latest rn-basic-modules --template blank
--template blankを指定することで、最も小さい形でプロジェクトを作成しました（図1）。
ReactコンポーネントはエントリーポイントでもあるApp.jsだけなので、今回はこのファイルを編集していきましょう。
