react-native-typescript-react-navigation-v4

React Native TypeScript and React Navigation v4.0

Let's create a React Native app with TypeScript and React Navigation v4.0 by using the builder below.

####Requirements:

• nodejs (this includes NPM package manager)
• vscode
• yarn (optional NPM package manager)
• uninstall the legacy react-native-cli

$ npm uninstall -g react-native-cli

Open up a terminal that points to your Desktop. Then start creating a React Native in TypeScript project

$ npx react-native init MyRnProject --template react-native-template-typescript@latest

open the project on vscode using the command below

$ code MyRnProject

Install the packages below

$ npm install react-navigation
$ npm install react-native-gesture-handler
$ npm install react-native-reanimated
$ npm install react-native-screens
$ npm install react-native-safe-area-context
$ npm install react-navigation-stack
$ npm install @react-native-community/masked-view

additional configuration

To run the app

$ npm run android

or

$ npm run ios

create the directories and files below

• app/auth/LoginScreen.tsx
• app/navigation/root-navigation.tsx

Just copy and paste the content of each file. Also edit the App.tsx