expo-router-starter-kit 🏎️📱

expo-router-starter-kit is for building robust cross-platform apps blazingly fast! Currently we are focusing on building the best template to kick off your next mobile project.

Expo
Expo Router
expo-image
zustand - state management
nativewind - Tailwind CSS for React Native
axios - Promise based HTTP client
i18next - Internationalization-framework
@shopify/flash-list - React Native flash list component
OneSignal - Push Notification delivery
Lottie - Animated Splash Screen

Installation

Clone this template by clicking on Use this template -> Create new repository.
Clone the new repository
Install dependencies

yarn install

Run the project

yarn ios

yarn android

Environment Variables

Create a .env file in the root of the project.
Define env variables inside the .env file. Variables must begin with EXPO_PUBLIC_.
Define new variables in _utils/env-loader zod scheme:

const schema = z.object({
  EXPO_PUBLIC_MY_NEW_VARIABLE: z.string(),
});

Use env variables everywhere by import env-loader:

const my_env_var = process.env.EXPO_PUBLIC_MY_NEW_VARIABLE;

That's it! Nice and simple way of dealing with environment variables.

Note: don't forget to restart the project once you created .env

Deep Linking

To set up Deep linking you can follow this documentation provided by Expo - Deep Linking

File Structure

- src  -  source  code  for  the  application.

- /components  -  contains  reusable  components.

- /screens  -  contains  the  application's screens.

- /assets - contains the application's  assets (all the  assets  stored  here  will  be  bundled  into  the  app).

- /config  -  contains  the  application's config files.

- /constants - contains the application's  constants.

- /context  -  contains  the  application's theme.

- /locales - contains the application's  local  files (i18n, i18next,  expo-localization).

- /store  -  contains  the  application's zustand store for state managment.

- /utils - contains the application's  utils  for  helper  functions.

Screens

Main screens:

Login
Signup
Home Screen
Secondary Screen
Settings Screen
Top Navigation , Bottom Navigation, Native Modal

🚧 Roadmap 🚧

This roadmap outlines the planned development and enhancement of the expo-router template project. Our primary goal is to create a comprehensive template covering essential Expo features, followed by the expansion into multiple templates and a CLI for tailored project initialization.

🚀 Phase 1: Comprehensive Template Development - currently IN PROGRESS

Carousel and other components fix - Address and fix carousel related issues in the current template + create/fix multiple expo base components, utils, helper functions.
Originally we wanted to remove Nativewind due to some major issues that have not been fixed. We dropped this due to NativeWind will be patching all the known issues in version 4 therefor as soon as NativeWind v4 going to be release we are going to upgrade our current project.
Authentication Integration - Explore and integrate authentication providers like Clark or other alternatives.
TanStack Query - Implement an example of Data Mutation.

🛠 Phase 2: Template Expansion and CLI Development

Expand the project to include a variety of templates catering to different use cases. (e-commerce , barebone, base, etc)
Develop a CLI to streamline the creation and management of projects based on these templates.

Contributors

Hey fellow developers! We are inviting developers who are enthusiastic about Expo and React Native to join us in this venture. Whether you are looking to contribute code, share ideas, or provide feedback, we welcome all forms of collaboration. - Join to our Discord : https://discord.gg/ns6gassHaS

We would like to thank the following people who've contributed to this project:

@kewinzaq1

josephakayesi/expo-router-starter-kit