開発環境
- OS：Windows11 Home
- フレームワーク：React Native（Expo）
- 実行環境：Node.js
- 開発エディタ：VSCode
- リリース元：Google Play（Androidスマホアプリ）
初めてのアプリ開発から再開発を始めるまで
2024年1月、React Native(Expo)でのAndroidアプリ開発を何もわからない状態からやり始め、10月に初めて作ったアプリの最初のバージョンをリリースすることができました。
当時は職業プログラマでもなく、アプリの作成について何も知識がないところから公開までこぎつけたので、それはもうたくさんの悪戦苦闘がありましたが、そのかいあってか、今年になって職業プログラマとして企業に所属することになりました（パートですけど）。
そんなこんなで忙しく、しばらくアプリについてはほったらかし状態でしたが、そろそろバージョンアップもしたいと思ってました。
しかし、前の開発をしていたノートPCはプログラミングをするつもりがなかった2年ほど前に買ったもので、SSDは256GBでメモリは8MBで、あまりにも貧弱。
まずはPCの増強をすることに決め、SSDを1TBのものに交換したりメモリを増設したりしました。
そうなると前のSSDのデータも全部入れ直しとなり、これまた悪戦苦闘してOneDriveにバックアップしていたはずのデータを移したり……これも話すと長くなる？なエピソードがありました。
アプリのコードはGitHubにあるので、そこからクローンすれば良いわけですが、リポジトリが他のプロジェクトとまとめて一つだったりしたので単体プロジェクト単位に直したり……ちょっとずつ準備をしていました。
そんな折、Google Play Consoleから「あなたのアプリ、最新のAndroidバージョンに対応しないと更新不可になるよ？」と警告が入りました。
もう後伸ばしはできません。いよいよ本腰を入れてバージョンアップのための再開発にとりかかることにしました。
SSD換装後のプロジェクトの準備
GitHubからプロジェクトフォルダをダウンロードし、新しいリポジトリに移設。あとはChatGPTに聞きながらプロジェクトを再開するための準備をしました。
- GitHubのプロジェクトのリポジトリ最新バージョンにアプリのバージョンタグを付ける（そのままmainで開発を進めても以前の公開バージョンが保管される）
-
https://nodejs.org/ から最新版のNode.jsをインストールし、
node -vで確認 - Expoをインストール
npm install -g expoし、expo --versionで確認 - プロジェクト依存パッケージのインストール（package.jsonがある場所で
npm install）
エラーメッセージが出たら表示に従って追加のインストールをします。
他は必要に応じてVSCodeにExpoの機能拡張とかを入れても良いんでしょうが、無くてもそんなに問題ない感じです。私は今のところ使ってないです。
仮想デバイスにExpo開発ビルドをインストールする
最初の開発のときは終盤近くまでExpo Goで実機テストをしていました。
Expo Goは本当にテストが簡単すぎるので対応のライブラリしか使わないようにしてたのですが、課金システム（RevenueCat）だけは非対応のため、他の機能をぜんぶ作成・テストしたあと、最後にRevenueCatのテストをすることにしました。
課金システムのためそのままGoogle Play Console内でテストを行ったあとリリースしたので、開発ビルドでテストする方法はこれまでやっていませんでした。
しかし、今回の再開発はすでにRevenueCat組みこみ済のアプリをテストするため、Expoで開発ビルドを作成して仮想デバイスにインストールしてテストすることにしました。
今回も最初は実機でテストしようとしてたのですが、PCを増強したら仮想端末を動かすのが以前にくらべてはるかに快適だったので、仮想端末でのテストに変更しました。
開発ビルドをインストールするまでの準備
基本的にはExpoドキュメントを見てやります。しかし細かい部分で壁がたくさんあったので、ChatGPTに聞きながら解決していきました。
全体の流れ（初期設定）
- PCにAndroid Studioをインストールする
- Android StudioでSDKをインストールする
- ユーザー環境変数を設定する
- Android Studioで仮想デバイスを起動する
- VSCodeでExpo開発ビルドを実行する
開発ビルドを作成して仮想デバイスにインストールするのに必要なツール（SDK、Java、ADB）がAndroid Studioにまとまっているため、こちらをインストールします。ツールを個別に導入することも考えましたが、いろいろ面倒そうだったので、Android Studioの導入に落ち着きました。
Android Studioのインストール
私の開発環境ではAndroid Studioそのものは使わないのですが、SDKだったりJavaだったりを単体で導入するよりAndroid Studioを入れたほうが手っ取り早いという結論になりました。
SDKのインストール
本体をインストールしたら一度起動してSDKもインストールします。ウェルカム画面でボタンが並んでいる下に小さく「More Actions」と書いてある部分をクリックし、「SDK Manager」を選択。最新バージョンにチェックが入ってなければチェックしOKを押します。
このとき「Android SDK Location」に入っているパスを次のシステム環境変数の設定に使います。
ユーザー環境変数の設定
Windowsの検索窓に「システム環境変数」と入力して画面を開きます。「環境変数…」ボタンから設定画面に入り、ユーザー環境変数の「新規」ボタンをクリック。下記の内容で登録します。
- 変数名：ANDROID_HOME
- 変数値：Android SDK Locationのパス（たいていは C:\Users\（ユーザー名）\AppData\Local\Android\Sdk）
java.exeのパスも通しておかないとビルド時にエラーになるので、さらに新規ボタンをクリックし、下記の内容も登録します。
- 変数名：JAVA_HOME
- 変数値：C:\Program Files\Android Studio\jbr（Java.exeを含むbinフォルダの前までを指定する）
次に、ユーザー環境変数に登録してある「Path」を選択して編集ボタンを押します。
新規ボタンを押すとリストに新規登録できる状態になるので、下記３つを登録します。
- %ANDROID_HOME%\platform-tools
- %ANDROID_HOME%\emulator
- %JAVA_HOME%\bin
あとはOKボタンを押していき、画面を終了します。
仮想デバイスの起動
ウェルカム画面に戻り、「More Actions」から「Virtual Device Manager」を選択します。初期設定でひとつは登録してあるので、それを▶で起動すればOKですが、＋ボタンから新しい仮想デバイスを作成してもかまいません。開発ビルドはテストのたびにインストールした方が良いらしいですが、インストール前に仮想デバイスをどれかひとつ起動しておくと、自動的にそのデバイスにインストールされます。
Expo開発ビルドの実行
始めて仮想デバイスを起動した場合は、コマンドシェルでadb devicesとすると起動しているデバイスの確認ができます。
問題なければVSCodeでプロジェクトのフォルダからコマンドシェルで開発ビルドを作成します。
npx expo run:android
起動中の仮想デバイスを確認し、うまくアプリがインストール・起動できれば準備完了です。
テスト環境の実行手順
初期設定が完了したので、次回からは下記の手順でテスト環境を実行し、コードを再開発していきます。
- Android Studioを起動し、仮想デバイスをひとつ選択して起動
- VSCodeのプロジェクトフォルダで
npx expo run:androidを実行して仮想デバイスにアプリをインストール - コードを書き換えると即座に仮想デバイス上で反映されるので、確認しながら開発する
今回はGoogleにせっつかれているため、最小限の修正や機能実装をしてなるべく早く再リリースし、また落ち着いてから大きな機能の追加や修正をしていこうと思います。
製品ビルド
EASビルドのエラー対処
プログラムの気になっていた部分をひととおり修正したので、新バージョンとしてGoogle Playストアに公開するための製品ビルドを作成することにしました。
Expoはサーバー側でビルドしてくれる便利な機能があります。使用するためのコマンドラインツールであるEAS CLIをインストールします。
npm install --global eas-cli
前にいちどビルドしていてeas.jsonがあるので、そのまま製品ビルドに進みます。始めてEASビルドを行う場合はプロジェクトフォルダでeas update:configureを実行し、ビルド設定ファイルを作成します。
私の場合はAndroid向けアプリしか作らないので下記のコマンドでビルドします。
eas build --platform android
しかしここで問題が起こり、なんど試しても途中でビルドエラーに。ログには複数ファイルで「Cannot open: Permission denied」とあり、ファイルが読み取り不可と出ています。このエラー文で調べてたりChatGPTに聞いたりしてファイルの権限を変更しましたがまったく解消しません。
最終的にRedditで見つけたこの対処法で解決しました。
eas.jsonファイルの"cli"の中に下記の文を追加するだけでビルドが通るようになりました。内容としてはビルド前にGitHubにコミットする動作を入れるというだけなのですが、なんなんですかね…？
"cli": {
"version": ">= 11.0.3",
"appVersionSource": "remote",
"requireCommit": true //←これを追加
},
Android15（SDK35）への対応
Google Play Consoleから「8月末までにAndroid15（SDK35）に対応しないと今後のアプリの更新ができなくなる」と脅されてしぶしぶバージョンアップの作業を始めたわけですが、最新のEASビルドをすれば自然にSDK35に対応するのだと思っていたらそういうわけでもなく、SDK34までしか対応していませんでした。
この件についてはChatGPTはあまりあてにならず、ググって調べた結果、Expoのexpo-build-propertiesというAPIを導入してからapp.jsonを修正する必要があることがわかりました。
npx expo install expo-build-properties
{
"expo": {
"plugins": [
[
"expo-build-properties",
{
"android": {
"targetSdkVersion": 35
}
}
]
]
}
}
さらに既存のandroidフォルダを削除し、npx expo prebuildで再構成後、eas build --platform androidでビルドすると、SDK35に対応した実行ファイルをビルドしてくれるということです。
