開発環境にはWindows、Android Studio、Visual Studio Codeを使いました。
Expo↗
React Nativeでアプリを開発するとき、Expoを使うと作業が簡単になります。AndroidとiOSのアプリを開発するための多くの設定を、Expoが代わりに行います。無料で使え、ビルドと配布の作業も簡単になります。Expo Goを入れると、開発中のアプリを実機でリアルタイムに確認できます。
Expoを使うとビルドと配布が簡単になります。ただし、一部のライブラリを使えず、ネイティブ機能を追加できない場合があります。Expoで実現できない機能を追加するなら、ネイティブ機能を追加できるReact Native CLIを使います。
プロジェクトで使う機能がExpoに対応するか確認し、対応しなければReact Native CLIを使うとよいでしょう。
Node.jsはJavaScriptのランタイムで、React Nativeの開発に必要です。公式サイトからLTS版をダウンロードしてインストールします。
Node.js公式サイト↗
インストール後、ターミナルでnode -v、npm -vを実行してバージョンを確認します。
Expoを使うにはアカウントが必要です。公式サイトで登録し、Expoアカウントでログインします。
Expo公式サイト↗
ログイン後、Create a new projectを押してプロジェクト名を入力すると、Expoプロジェクトを作れます。
Testプロジェクトの作成
Expo CLIをインストールしてローカルプロジェクトを作る 🔗
ターミナルからexpo-cliをグローバルにインストールできます（任意）。
expo-cliを入れなくても、npx expoでプロジェクトを作成し、起動できます。
npm install --global eas-cli
expo-cliをインストールしたら、expo initでプロジェクトを作ります。
npx create-expo-app@latest my-new-project
実行前にExpoへログインします。
npx expo login # expo 계정 입력
プロジェクトを作ったら、フォルダーへ移動してExpo上のプロジェクトと接続します。プロジェクトIDはExpoの詳細ページで確認できます。
cd my-new-project
eas init --id {expo 프로젝트 id}
接続後、Expoプロジェクトを起動します。
起動後にaを押すとAndroid Studioのエミュレーター、wを押すとブラウザで確認できます。iを押すとXcodeのiOSシミュレーターで確認できますが、macOSでのみ利用できます。
2.3 Expo Goをインストールして接続する 🔗
expo : このシステムではスクリプトを実行できないため、C:~\expo.ps1 を読み込めません。詳細はabout_Execution_Policies（
https://go.microsoft.com/fwlink/?LinkID=135170↗) を参照してください。
位置 行:1 文字:1
+ expo init
+ ~~~~
+ CategoryInfo : セキュリティエラー: (:) [], PSSecurityException
+ FullyQualifiedErrorId : UnauthorizedAccess
expo initを実行するとエラーが出ます。
このエラーはPowerShellの実行ポリシーによるものです。
実行ポリシーを変更すると解決できます。
PowerShellを管理者として開き、次のコマンドを実行します。
Set-ExecutionPolicy -ExecutionPolicy Unrestricted
続いてYを入力する
次のコマンドで実行ポリシーを確認できます。
Get-ExecutionPolicy -List
LocalMachineがUnrestrictedか確認する
ExpoとReact Native CLIのうち、プロジェクトに合うものを選びます。Expoはアプリ開発を容易にしますが、使えないライブラリや追加できないネイティブ機能があります。Expoで実現できない機能を追加する場合は、React Native CLIやexpo ejectを使う方法があります。
簡単に言うと、アプリの設定ファイルから、ネイティブのソースコードを含むExpoプロジェクトを生成できます。
android/ と
ios/ フォルダーが生成され、ネイティブコードを含むプロジェクトになります。
次のコマンドでprebuildしたアプリを起動できます。
npx expo run:android
npx expo run:ios
Expoプロジェクトを作成する（Windows）
