https://github.com/carlossalasamper/react-native-clean-architecture
🧅 A React Native scaffold with a clean architecture that is easy to understand.
https://github.com/carlossalasamper/react-native-clean-architecture
clean-architechture clean-code ddd ddd-architecture dependency-injection dependency-inversion expo inversify inversifyjs mobile-development mobx mobx-react react react-native scaffold
Last synced: 2 months ago
JSON representation
🧅 A React Native scaffold with a clean architecture that is easy to understand.
- Host: GitHub
- URL: https://github.com/carlossalasamper/react-native-clean-architecture
- Owner: carlossalasamper
- License: mit
- Created: 2022-10-23T17:35:22.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2024-12-19T14:29:39.000Z (6 months ago)
- Last Synced: 2025-03-30T02:03:44.463Z (3 months ago)
- Topics: clean-architechture, clean-code, ddd, ddd-architecture, dependency-injection, dependency-inversion, expo, inversify, inversifyjs, mobile-development, mobx, mobx-react, react, react-native, scaffold
- Language: TypeScript
- Homepage:
- Size: 828 KB
- Stars: 105
- Watchers: 1
- Forks: 26
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# React Native Clean Architecture
A React Native scaffold with a clean architecture that is easy to understand.
## Features
- 🚀 [Expo 52](https://expo.dev/)
- 📁 Clean architecture. Layered file structure
- 🛡️ TypeScript bulletproof typing
- 🖌️ Code format: [ESLint](https://eslint.org/)
- 🖌️ Commit format: [CommitLint](https://commitlint.js.org)
- 🐩 Git hooks: [Husky](https://www.npmjs.com/package/husky)
- 💉 Dependency injection: [Inversiland](https://github.com/inversiland/inversiland)
- 🌍 I18n: [expo-localization](https://docs.expo.dev/versions/latest/sdk/localization/) + [i18n-js](https://www.npmjs.com/package/i18n-js)
- 🚢 Navigation: [@react-navigation/native](https://reactnavigation.org/docs/getting-started)
- 🧰 State Manager: [Mobx](https://mobx.js.org/)
## 📁 Project File Structure
> ⚠️ What makes the implementation of the clean architecture concept more difficult in my opinion is that since it is defined theoretically, each person implements it using different terminology or omitting/adding some layers or pieces to simplify it or continue to make it more complex.
For this reason, I think it is important to emphasize the documentation that accompanies the architecture to avoid obstacles with the rest of the people who are going to work with this system.
I briefly explain each of the four layers that make up clean architecture within the /src folder:
```
└── /src
├── AppModule.ts # Dependency injection root module
├── /core # Core bounded context
│ └── /presentation
└── /post # Post bounded context
├── /domain
├── /application
├── /infrastructure
└── /presentation
```
### Domain
This layer contains all the enterprise business rules: entities, specifications...
### Application
This layer contains the use cases of the bounded context.
### Infrastructure
This layer contains the technical details (implementation) of the domain layer and third parties integrations.
### Presentation
This layer contains the React Native source code: views and controllers (Redux Thunks).
### References
- https://blog.cleancoder.com/uncle-bob/2012/08/13/the-clean-architecture.html
- https://jeffreypalermo.com/2008/07/the-onion-architecture-part-1/
## Environment
Expo CLI loads .env files according to the [standard .env file resolution](https://github.com/bkeepers/dotenv/blob/c6e583a/README.md#what-other-env-files-can-i-use) and then replaces all references in your code to `process.env.EXPO_PUBLIC_[VARNAME]` with the corresponding value set in the .env files. Code inside node_modules is not affected for security purposes.
### Development Environment
Create a `.env` file in the root of your project for development purposes:
```
EXPO_PUBLIC_API_URL=https://jsonplaceholder.typicode.com
```
### Production Environment
Configure the `.env.production` file with the environment variables you want to use in production.
## Run
Dev
```bash
yarn dev
```
Web
```bash
yarn web
```
Android
```bash
yarn android
```
iOS
```bash
yarn ios
```
## Eject from Expo
```bash
expo eject
```
## Support the project
☕️ Buy me a coffee so the open source party will never end.
YouTube |
Instagram |
Twitter |
Facebook