up:: React Native
Develop an app with Expo - Expo Documentation
たまにexpo-cliをインストして使うコードが出るが、今はnpx expoでexpoは使える。
The New Expo CLI. In Expo SDK 46 we introduced a new… | by Evan Bacon | Exposition
ReactNative Expoでアプリ開発入門してみる Part1 reactnative - Qiita
Quick Start
init
npx create-expo-app name
typescriptを使用する場合は-t。
yarn tscが使える。
Use TypeScript - Expo Documentation
tabsだと初めからいくつか画面が用意されている。
Start server
npx expo start --dev-client
Build
npx expo run:android
The New Expo CLI. In Expo SDK 46 we introduced a new… | by Evan Bacon | Exposition
developmentバージョンとexpo goバージョンは別っぽい。
端末上でテストするだけならexpo goでいい。
Expoアプリ
「Expoツールを使用したReact Nativeアプリ」の短縮。
Expo Application Services
ExpoはReact Nativeアプリの構築と保証を支援するOSP。
Expo CLI、Expo Router、Expo SDKなどを含む。MIT。
Expo Application Services(EAS)はホスト型サービスのスイート。主に以下を担当する。
- アプリのビルド、送信、更新、自動化
- チームと協力
EASはサーバーやCDNの負担を軽減する。
Development Build
Expo-dev-clientを含むデバッグビルド。
Android及びiOSのNative Project
javascriptと各プラットフォーム対応用Native Project(Android用、iOS用等)で構成される。
Native Projectはnpx create-expo-appでは表示されない。npx expo prebuildで表示される。
Continuous Native Generation
CNG。
package.json → node_moduleの生成と同様、
app.json, package.json → Native Projectをオンデマンドで生成する。
npx expo prebuildで生成できる。
いつでもNative Projectを作り直せるという強み。
一応作った後にAndroid StudioかXcodeで編集できるが、もう一度prebuildを行うとその変更は上書きされる。
その場合はnpx expo runで成果物を生成する。
再生成はnpx expo prebuild --clean。
テスト、配布
EAS Buildを通し、ベータ配布を待たずに直接ブラウザからテスト用アプリをインストールできる。
iOSの方は有料。
Internal distribution - Expo Documentation
EAS Submit。リリース迄を自動化することが出来る。
EAS Submit - Expo Documentation
Sentry。エラーを検出しクラッシュレポートを提出できる。
Use Sentry - Expo Documentation
各種AnalyticsをExpoに接続できる。
Use Analytics - Expo Documentation
expo-updates。production app(実稼働アプリ)をプログラムからアップデートできる。
EAS Update。CDNを使用したりできる。
アプリ構成
app.json、app.config.js、app.config.tsの三種がある。
これらはpackage.jsonと同じ階層に置く必要がある。
ここに機密情報を含めてはいけない。なぜならConstants.expoConfigを通してコード中から読むことが出来るから。
Configure with app config - Expo Documentation
ローカルアプリのコンパイル
npx expo run:android。iosとすればiosも作れる。
prebuildで出来るNativeディレクトリが無い場合は一緒に生成する。
--deviceでデバイス選択。
--variant releaseでpruduction build。
(iosは--configuration Release)
プロジェクトの構成又はネイティブコードに変更があった場合はnpx expo prebuildで再ビルド。
これは上書き。全部ビルドしなおすなら--cleanをくっつける。
EAS build
eas login
eas build:configure
npx expo install expo-dev-client
eas build --profile development --platform android
Create your first build - Expo Documentation
Create a development build - Expo Documentation
Releaseビルドは