https://github.com/react-navigation/template
A starter project using React Navigation
https://github.com/react-navigation/template
Last synced: 5 months ago
JSON representation
A starter project using React Navigation
- Host: GitHub
- URL: https://github.com/react-navigation/template
- Owner: react-navigation
- Created: 2024-11-27T13:22:32.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-06-19T08:53:48.000Z (6 months ago)
- Last Synced: 2025-06-26T06:15:34.842Z (6 months ago)
- Language: TypeScript
- Size: 45.9 KB
- Stars: 5
- Watchers: 2
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Starter Template with React Navigation
This is a minimal starter template for React Native apps using Expo and React Navigation.
It includes the following:
- Example [Native Stack](https://reactnavigation.org/docs/native-stack-navigator) with a nested [Bottom Tab](https://reactnavigation.org/docs/bottom-tab-navigator)
- Web support with [React Native for Web](https://necolas.github.io/react-native-web/)
- TypeScript support and configured for React Navigation
- Automatic [deep link](https://reactnavigation.org/docs/deep-linking) and [URL handling configuration](https://reactnavigation.org/docs/configuring-links)
- Theme support [based on system appearance](https://reactnavigation.org/docs/themes/#using-the-operating-system-preferences)
- Expo [Development Build](https://docs.expo.dev/develop/development-builds/introduction/) with [Continuous Native Generation](https://docs.expo.dev/workflow/continuous-native-generation/)
- Edge-to-edge configured on Android with [`react-native-edge-to-edge`](https://www.npmjs.com/package/react-native-edge-to-edge)
## Getting Started
1. Create a new project using this template:
```sh
npx create-expo-app@latest --template react-navigation/template
```
2. Edit the `app.json` file to configure the `name`, `slug`, `scheme` and bundle identifiers (`ios.bundleIdentifier` and `android.bundleIdentifier`) for your app.
3. Edit the `src/App.tsx` file to start working on your app.
## Running the app
- Install the dependencies:
```sh
npm install
```
- Start the development server:
```sh
npm start
```
- Build and run iOS and Android development builds:
```sh
npm run ios
# or
npm run android
```
- In the terminal running the development server, press `i` to open the iOS simulator, `a` to open the Android device or emulator, or `w` to open the web browser.
## Notes
This project uses a [development build](https://docs.expo.dev/develop/development-builds/introduction/) and cannot be run with [Expo Go](https://expo.dev/go). To run the app with Expo Go, edit the `package.json` file, remove the `expo-dev-client` package and `--dev-client` flag from the `start` script.
We highly recommend using the development builds for normal development and testing.
The `ios` and `android` folder are gitignored in the project by default as they are automatically generated during the build process ([Continuous Native Generation](https://docs.expo.dev/workflow/continuous-native-generation/)). This means that you should not edit these folders directly and use [config plugins](https://docs.expo.dev/config-plugins/) instead. However, if you need to edit these folders, you can remove them from the `.gitignore` file so that they are tracked by git.
## Resources
- [React Navigation documentation](https://reactnavigation.org/)
- [Expo documentation](https://docs.expo.dev/)
---
Demo assets are from [lucide.dev](https://lucide.dev/)