react native の初期プロジェクト作成方法について自分用に
まとまっているものが欲しく記事にしました
#1 react native のプロジェクト作成
まずは初期プロジェクトの作成
npx react-native init MyApp --template react-native-template-typescript
#2 react native paper導入
現在使っているMaterial UIをベースにしたライブラリのreact native paperの導入手順
react native paper
https://callstack.github.io/react-native-paper/index.html
yarn add react-native-paper
yarn add react-native-vector-icons
react-native-vector-iconsを使う場合は
手動でリンクする必要があるため下記手順を参考に登録する必要がある
#3 AWS amplify導入
初期設定(aws-amplify/cli)などの設定を除いた設定
通しの設定が必要な場合は下記を参照
AWS amplify Docs
https://docs.amplify.aws/start/getting-started/installation/q/integration/react-native#option-2-follow-the-instructions
amplify init
yarn add aws-amplify aws-amplify-react-native amazon-cognito-identity-js @react-native-community/netinfo
npx pod-install
ソースコードへ下記を追加
import Amplify from 'aws-amplify'
import config from './aws-exports'
Amplify.configure(config)
そこから先の実装は下記URLを参照
AWS amplify Docs
https://docs.amplify.aws/start/getting-started/installation/q/integration/react-native#option-2-follow-the-instructions
#4 react navigation導入
ページ遷移に必要なreact navigationの導入
react-navigation
https://reactnavigation.org/
yarn add @react-navigation/native
yarn add react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context @react-native-community/masked-view
#5 Pod install
iOS起動に必要なコマンドを実行し、完了
pod install
yarn ios
以上、とりあえず必要な初期プロジェクト作成方法について記載しました