Expo-router-starter-kit is a streamlined template for building cross-platform mobile apps with Expo. This template provides a starting point with updated features and simplified components for efficient development.
- SDK Update: Upgraded to version 50 (canary).
- NativeWind: Updated to version 4.
- React-native-picker: Latest version implemented.
- Template Simplification: Removed certain components/pages for a leaner template.
- Shopify/Flashlist Removal: Currently incompatible with expo-router.
- Type Updates: Enhanced and updated type definitions.
- Splash Screen Fix: Replaced Lottie with an alternative solution.
- UI Adjustments: Minor improvements in UI, especially for FontAwesome icons on iOS.
- Expo
- Expo Router
- expo-image
- Zustand for state management
- Tanstack Query for asynchronous state management
- i18next for internationalization
- Apisauce for HTTP communication
# Clone and create a new repository from this template
# Install dependencies
pnpm install
# Run the project
pnpm ios
# or
pnpm android
-
Create a
.env
file in the root of the project. -
Define environment variables inside the
.env
file. Variables must start withEXPO_PUBLIC_
. -
Update
_utils/env-loader
schema to include new variables:const schema = z.object({ EXPO_PUBLIC_MY_NEW_VARIABLE: z.string(), });
const my_env_var = process.env.EXPO_PUBLIC_MY_NEW_VARIABLE;
Note: Remember to restart the project after creating the .env file.
For setting up deep linking, follow the documentation provided by Expo: Deep Linking.
The project is organized as follows:
- src - Source code for the application.
- /components - Reusable components.
- /screens - Application screens.
- /assets - Application assets (all assets stored here will be bundled).
- /config - Application configuration files.
- /constants - Application constants.
- /context - Application theme and context.
- /locales - Localization files (i18n, i18next, expo-localization).
- /store - Zustand store for state management.
- /utils - Helper functions and utilities.
Main screens included in the template:
- Home Screen: The primary screen users see after logging in.
- Secondary Screen: Additional screen for supplementary features.
- Settings Screen: Allows users to customize their app experience.
- Navigation: Includes Top Navigation, Bottom Navigation, and Native Modal for seamless app navigation.
We are inviting developers who are passionate about Expo and React Native to collaborate with us. Whether it's contributing code, sharing ideas, or providing feedback, all forms of collaboration are welcome.
Special thanks to our contributors, including @kewinzaq1.