React Directory Structure
React App directory structure turned into React Native Starter Kit. API Client, Helpers and Context Setup.
Overview
The react-directory-structure is a React Native and React boilerplate that provides a structured directory setup for starting new projects. It includes reusable components, context setup, API services, navigation, error handling, and more. This boilerplate can be used as a starting point for both React Native and React Web projects.
Features
- Context API: Allows for state management and sharing data between components.
- Components / Screens: Included reusable components and screens for building user interfaces.
- Hooks: Provides custom hooks for common functionalities and state management.
- API Services Setup with apisauce: Sets up API services using the apisauce library for making HTTP requests.
- Config: Configuration setup for the project, including environment variables.
- Library Helpful functions: Includes a library of helpful utility functions for various tasks.
- Navigation: Sets up navigation for the application using a navigation library.
- Assets and Themes: Handles assets such as images and themes for consistent styling.
- Global error handling with notification: Provides a global error handler and notification system for displaying error messages.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- React Native
React Native is a framework for building mobile applications using React and JavaScript. It enables developers to write once and deploy to multiple platforms, including iOS, Android, and the web, while providing a native app-like experience to users.
- Expo
An open-source platform for making universal native apps with React. Expo runs on Android, iOS, and the web.
- Formik
Formik is a popular form library for React that helps with form state management, validation, and submission handling. It provides a declarative approach to building forms with support for complex validation scenarios and easy integration with validation libraries like Yup.
- Typescript
TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.
- Yup
Yup is a schema builder for runtime value parsing and validation. It provides a declarative way to define validation schemas with support for complex nested objects, array validation, and custom validation rules. Often used with Formik for form validation.