{"id":28143725,"url":"https://github.com/askides/clean-architecture-react","last_synced_at":"2025-05-14T21:21:00.741Z","repository":{"id":65362243,"uuid":"585984598","full_name":"askides/clean-architecture-react","owner":"askides","description":"Clean Architecture Example Using React.js","archived":false,"fork":false,"pushed_at":"2023-02-10T15:08:17.000Z","size":142,"stargazers_count":149,"open_issues_count":1,"forks_count":24,"subscribers_count":6,"default_branch":"main","last_synced_at":"2024-04-28T03:47:57.844Z","etag":null,"topics":["clean-architecture","clean-code","reactjs"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/askides.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2023-01-06T16:15:44.000Z","updated_at":"2024-04-27T12:54:50.000Z","dependencies_parsed_at":"2023-02-15T23:15:41.283Z","dependency_job_id":null,"html_url":"https://github.com/askides/clean-architecture-react","commit_stats":null,"previous_names":["askides/clean-architecture-react"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/askides%2Fclean-architecture-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/askides%2Fclean-architecture-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/askides%2Fclean-architecture-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/askides%2Fclean-architecture-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/askides","download_url":"https://codeload.github.com/askides/clean-architecture-react/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254227679,"owners_count":22035699,"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-architecture","clean-code","reactjs"],"created_at":"2025-05-14T21:20:59.675Z","updated_at":"2025-05-14T21:21:00.692Z","avatar_url":"https://github.com/askides.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Clean Architecture React\n\nThis project is an experiment in applying clean architecture with React.\n\n## Important\n\nInside a React context, Clean Architecture will always be some kind of adaption. The key is separation of concerns and decoupling dependencies. In addition, the project originated as an example for personal study, if you want to make a suggestion go ahead and PR!\n\n## Architecture\n\n### Models\n\n- User\n- Todo\n  \n### Repositories\n\n- TodoRepository\n- UserRepository\n\n### DataSources\n\n- User\n  - UserAPIDataSource (From a REST API)\n- Todo\n  - TodoAPIDataSource (From a REST API)\n  - TodoLocalStorageDataSource (From Browser Local Storage)\n  \n### UseCases\n  \n- useClearTodos\n- useCreateTodo\n- useFetchTodos\n- useFetchUsers\n\nThese use cases are implemented using react-query, a library for fetching and caching data in React applications.\n\nThe Todo model has two data source implementations available: one using a REST API and the other using local storage.\n\n### Services\n\n- Http (Abstraction over axios)\n- Notification (Abstraction over alert)\n- Logger (Abstraction over console.log)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faskides%2Fclean-architecture-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faskides%2Fclean-architecture-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faskides%2Fclean-architecture-react/lists"}