React Native Template

Overview

The React Native Template is a clean, efficient, and scalable template designed to provide a quick start for new app development. It comes with a pre-configured common set of packages, enabling developers to focus on building their app rather than setting up initial configurations.

Features

• Using Typescript: Incorporates Typescript for strong typing and scalability.
• Folder-by-feature structure: Organizes code based on features for better maintainability.
• Dark mode support: Provides built-in support for dark mode.
• UI kit with TailwindCSS.
• Internationalization framework with I18next.
• Lint commit messages using Commitlint.
• Multiple environment configurations using React Native Config.
• Client-state management with Zustand.
• Server-state management using React Query.
• Local storage with MMKV.
• Routing and navigation via React Navigation.
• API requests handled by Axios.
• Debug tool using Flipper.
• Schema validation using Zod.
• OTA updates through CodePush.
• Additional support for FlashList, React Native Reanimated, React Native Gesture Handler, etc.

Setup

1. Run setup command.
2. For CodePush setup:
   • Update appCenter.ownerName and appCenter.appName values in scripts/utils.mjs.
   • Add App Secret Key and Code Push Deployment Key into AppCenter variables in your environments/.env.* files.
   • Create AppCenter config files for both platform directories by running a specific command.
3. Android Setup:
   • Generate a keystore file in android/app.
   • Update values in environments/.env.* files with appropriate keystore information.
4. iOS Setup:
   • No additional steps required.

Troubleshooting

• Ensure proper environment setup per official documentation.
• For problems with Ruby versions:
  • Navigate to the project directory.
  • Run specific commands to reinstall dependencies and fix issues.

Summary

The React Native Template provides a robust starting point for React Native app development, offering essential features like TypeScript integration, structured project organization, dark mode support, and various management tools. By following the setup guide and troubleshooting tips, developers can efficiently leverage this template to kickstart their projects.