[react native,Expo CLI]expo startによるビルドサーバーのページがでない

 expo-cli@6.0.0以降のバージョンでは、Expo CLIのWebUIが廃止されたようです。

 https://blog.expo.dev/sunsetting-the-web-ui-for-expo-cli-ab12936d2206

[typescript, react native]React Navigation画面遷移サンプルアプリのひな形作成手順

 備忘録として、

React Navigation画面遷移ライブラリの環境構築の方法を記載する。

■前提条件

・nodejsがインストールされていること

・Expo-CLI が事前にインストールされていること

>npm install -g expo-cli

1./サンプルプロジェクトを作成する

> npx expo init react-navigation-sample

2.「react-navigation-sample」フォルダに移動する

> cd react-navigation-sample

3.React Navigationのコアライブラリをインストールする

> npm install @react-navigation/native

4-1.stackを使う場合、statckをインストールする

> npm install @react-navigation/stack

4-2.bottom-tabsを使う場合、bottom-tabsをインストールする

> npm install @react-navigation/bottom-tabs

4-3.drawerを使う場合、drawerをインストールする

> npm install @react-navigation/drawer

5.react-native-paperをインストールする

npm install react-native-paper

6.React Navigationの依存ライブラリをインストールする

> npx expo install react-native-gesture-handler react-native-reanimated react-native-screens react-native-safe-area-context @react-native-community/masked-view

[react-native,react-navigation/drawer]createDrawerNavigator()を使用した時のエラー：Error: Reanimated 2 failed to create a worklet, maybe you forgot to add Reanimated's babel plugin"

 react-navigation/drawerのcreateDrawerNavigator()を使用した時のエラー対応を備忘する

■エラーメッセージ

"Error: Reanimated 2 failed to create a worklet, maybe you forgot to add Reanimated's babel plugin"

■対応手順

1.babel.config.jsに【plugins: ["react-native-reanimated/plugin"]】を追記する。

[babel.config.js]

-----

module.exports = function (api) {

  api.cache(true);

  return {

    presets: ["babel-preset-expo"],

    plugins: ["react-native-reanimated/plugin"],

  };

};

-----

2.[expo start -c]コマンドを実行する

■参考サイト

https://www.youtube.com/watch?v=Ad0LUwCytu4&ab_channel=LahoreGraphicsAcademy

[typescript, react native]React Native Expo でapkファイルを作成する

 備忘録になる

■前提条件

React Native Expoアカウントを作成する

https://expo.dev/

■手順

1.Expo プロジェクトを作成する

>expo init build-sample

2. プログラミング言語を選択する

 .blank (TypeScript)

3.「expo build:android」を実行する

> npx expo build:android

4.Androidパッケージ名を決める

> What would you like your Android package name to be?

> com.example.myapp

5.ビルドタイプを決める

> Choose the build type you would like: 

> apk

6.KeyStoreを指定する

>? Would you like to upload a Keystore or have us generate one for you?

>If you don't know what this means, let us generate it! :) »

>Generate new keystore

7.expo-updatesのインストール

>In order to publish an update, expo-updates needs to be installed. Do you want to install it now? 

>Y

8.ビルドが成功したことを確認する

>Successfully built standalone app

9.apkダウンロードのURLが通知される。