Create a React Native app with the basics

npx react-native init AwesomeTSProject --template react-native-template-typescript

npm install @react-navigation/native

npm install react-native-screens react-native-safe-area-context

Edit MainActivity.java file which is located in android/app/src/main/java/<your package name>/MainActivity.java.

@Override
protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(null);
}

and make sure to add an import statement at the top of this file:

import android.os.Bundle;

Then install the gesture handler:

npm install react-native-gesture-handler

Add the following at the top (make sure it's at the top and there's nothing else before it) of your entry file, such as index.js or App.js:

import 'react-native-gesture-handler';

Optionally, you can also install @react-native-masked-view/masked-view. This is needed if you want to use UIKit style animations for the header (HeaderStyleInterpolators.forUIKit).

npm install @react-native-masked-view/masked-view

Now, we need to wrap the whole app in NavigationContainer. Usually you'd do this in your entry file, such as index.js or App.js:

import * as React from 'react';
import { NavigationContainer } from '@react-navigation/native';

export default function App() {
  return (
    <NavigationContainer>{/* Rest of your app code */}</NavigationContainer>
  );
}