{"id":21499245,"url":"https://github.com/carlossalasamper/react-native-clean-architecture","last_synced_at":"2025-04-06T03:05:20.039Z","repository":{"id":186272096,"uuid":"556366236","full_name":"carlossalasamper/react-native-clean-architecture","owner":"carlossalasamper","description":"🧅 A React Native scaffold with a clean architecture that is easy to understand.","archived":false,"fork":false,"pushed_at":"2024-12-19T14:29:39.000Z","size":848,"stargazers_count":105,"open_issues_count":0,"forks_count":26,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-30T02:03:44.463Z","etag":null,"topics":["clean-architechture","clean-code","ddd","ddd-architecture","dependency-injection","dependency-inversion","expo","inversify","inversifyjs","mobile-development","mobx","mobx-react","react","react-native","scaffold"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/carlossalasamper.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["carlossalasamper"],"buy_me_a_coffee":"carlossala95"}},"created_at":"2022-10-23T17:35:22.000Z","updated_at":"2025-03-24T03:57:25.000Z","dependencies_parsed_at":"2024-12-19T15:39:01.904Z","dependency_job_id":null,"html_url":"https://github.com/carlossalasamper/react-native-clean-architecture","commit_stats":null,"previous_names":["carlossalasamper/react-native-clean-architecture"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/carlossalasamper%2Freact-native-clean-architecture","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/carlossalasamper%2Freact-native-clean-architecture/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/carlossalasamper%2Freact-native-clean-architecture/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/carlossalasamper%2Freact-native-clean-architecture/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/carlossalasamper","download_url":"https://codeload.github.com/carlossalasamper/react-native-clean-architecture/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247427005,"owners_count":20937200,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["clean-architechture","clean-code","ddd","ddd-architecture","dependency-injection","dependency-inversion","expo","inversify","inversifyjs","mobile-development","mobx","mobx-react","react","react-native","scaffold"],"created_at":"2024-11-23T17:15:06.862Z","updated_at":"2025-04-06T03:05:20.022Z","avatar_url":"https://github.com/carlossalasamper.png","language":"TypeScript","funding_links":["https://github.com/sponsors/carlossalasamper","https://buymeacoffee.com/carlossala95","https://www.buymeacoffee.com/carlossala95"],"categories":[],"sub_categories":[],"readme":"# React Native Clean Architecture\r\n\r\n\u003cp align=\"center\"\u003e\r\n\u003cimg src=\"./assets/images/react-native-clean-architecture.png?raw=true\" style=\"max-width: 100%; width: 600px;\" /\u003e\r\n\u003c/p\u003e\r\n\u003cp align=\"center\" style=\"margin-top: 10px;\"\u003eA \u003cb\u003eReact Native scaffold\u003c/b\u003e with a clean architecture that is easy to understand.\u003c/p\u003e\r\n\r\n## Features\r\n\r\n- 🚀 [Expo 52](https://expo.dev/)\r\n- 📁 Clean architecture. Layered file structure\r\n- 🛡️ TypeScript bulletproof typing\r\n- 🖌️ Code format: [ESLint](https://eslint.org/)\r\n- 🖌️ Commit format: [CommitLint](https://commitlint.js.org)\r\n- 🐩 Git hooks: [Husky](https://www.npmjs.com/package/husky)\r\n- 💉 Dependency injection: [Inversiland](https://github.com/inversiland/inversiland)\r\n- 🌍 I18n: [expo-localization](https://docs.expo.dev/versions/latest/sdk/localization/) + [i18n-js](https://www.npmjs.com/package/i18n-js)\r\n- 🚢 Navigation: [@react-navigation/native](https://reactnavigation.org/docs/getting-started)\r\n- 🧰 State Manager: [Mobx](https://mobx.js.org/)\r\n\r\n\u003chr\u003e\r\n\r\n## 📁 Project File Structure\r\n\r\n\u003e ⚠️ 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.\r\n\r\nFor 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.\r\n\r\nI briefly explain each of the four layers that make up clean architecture within the /src folder:\r\n\r\n```\r\n└── /src\r\n    ├── AppModule.ts               # Dependency injection root module\r\n    ├── /core                      # Core bounded context\r\n    │   └── /presentation\r\n    └── /post                      # Post bounded context\r\n        ├── /domain\r\n        ├── /application\r\n        ├── /infrastructure\r\n        └── /presentation\r\n```\r\n\r\n### Domain\r\n\r\nThis layer contains all the enterprise business rules: entities, specifications...\r\n\r\n### Application\r\n\r\nThis layer contains the use cases of the bounded context.\r\n\r\n### Infrastructure\r\n\r\nThis layer contains the technical details (implementation) of the domain layer and third parties integrations.\r\n\r\n### Presentation\r\n\r\nThis layer contains the React Native source code: views and controllers (Redux Thunks).\r\n\r\n### References\r\n\r\n- https://blog.cleancoder.com/uncle-bob/2012/08/13/the-clean-architecture.html\r\n- https://jeffreypalermo.com/2008/07/the-onion-architecture-part-1/\r\n\r\n\u003chr\u003e\r\n\r\n## Environment\r\n\r\nExpo 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.\r\n\r\n### Development Environment\r\n\r\nCreate a `.env` file in the root of your project for development purposes:\r\n\r\n```\r\nEXPO_PUBLIC_API_URL=https://jsonplaceholder.typicode.com\r\n```\r\n\r\n### Production Environment\r\n\r\nConfigure the `.env.production` file with the environment variables you want to use in production.\r\n\r\n## Run\r\n\r\nDev\r\n\r\n```bash\r\nyarn dev\r\n```\r\n\r\nWeb\r\n\r\n```bash\r\nyarn web\r\n```\r\n\r\nAndroid\r\n\r\n```bash\r\nyarn android\r\n```\r\n\r\niOS\r\n\r\n```bash\r\nyarn ios\r\n```\r\n\r\n\u003chr\u003e\r\n\r\n## Eject from Expo\r\n\r\n```bash\r\nexpo eject\r\n```\r\n\r\n\u003chr\u003e\r\n\r\n## Support the project\r\n\r\n\u003cp align=\"center\"\u003e☕️ Buy me a coffee so the open source party will never end.\u003c/p\u003e\r\n\r\n\u003cp align=\"center\"\u003e\u003ca href=\"https://www.buymeacoffee.com/carlossala95\" target=\"_blank\"\u003e\u003cimg src=\"https://cdn.buymeacoffee.com/buttons/default-orange.png\" alt=\"Buy Me A Coffee\" height=\"41\" width=\"174\"\u003e\u003c/a\u003e\u003c/p\u003e\r\n\r\n\u003cp align=\"center\"\u003e\r\n  \u003ca href=\"https://www.youtube.com/channel/UCC-EUKPStBfQ1nEIvSl6bAQ\" target=\"_blank\"\u003eYouTube\u003c/a\u003e |\r\n  \u003ca href=\"https://instagram.com/carlossalasamper\" target=\"_blank\"\u003eInstagram\u003c/a\u003e |\r\n  \u003ca href=\"https://twitter.com/carlossala95\" target=\"_blank\"\u003eTwitter\u003c/a\u003e |\r\n  \u003ca href=\"https://facebook.com/carlossala95\" target=\"_blank\"\u003eFacebook\u003c/a\u003e\r\n\u003c/p\u003e\r\n\u003cp align=\"center\"\u003e\r\n  \u003ca href=\"https://godofprogramming.com\" target=\"_blank\"\u003egodofprogramming.com\u003c/a\u003e\r\n\u003c/p\u003e\r\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcarlossalasamper%2Freact-native-clean-architecture","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcarlossalasamper%2Freact-native-clean-architecture","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcarlossalasamper%2Freact-native-clean-architecture/lists"}