# rmanguinho/clean-react

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/rmanguinho-clean-react).**

1,480 stars · 304 forks · TypeScript · GPL-3.0

## Links

- GitHub: https://github.com/rmanguinho/clean-react
- Homepage: https://rmanguinho.github.io/
- awesome-repositories: https://awesome-repositories.com/repository/rmanguinho-clean-react.md

## Topics

`clean-architecture` `clean-code` `design-pattern` `hooks` `javascript` `react` `reactjs` `recoil` `tdd` `typescript`

## Description

Clean React is a frontend development framework and application template designed to provide a structured foundation for building scalable web applications. It serves as a boilerplate that organizes complex user interface logic into decoupled, testable layers using TypeScript.

The project distinguishes itself by enforcing a strict clean architecture and interface-driven design, which separates high-level business rules from low-level framework details. It integrates a dependency injection container and reactive state management primitives to ensure that system components remain interchangeable and maintainable.

The framework supports a comprehensive development lifecycle by incorporating automated continuous integration and deployment pipelines. It mandates a test-driven development workflow, requiring the creation of unit and integration tests to verify code reliability and expected behavior before implementation.

## Tags

### Web Development

- [React Project Boilerplates](https://awesome-repositories.com/f/web-development/create-react-app-customizations/project-scaffolders/react-project-boilerplates.md) — Offers a structured foundation for building scalable web applications using TypeScript, Clean Architecture, and SOLID principles.
- [Frontend Frameworks](https://awesome-repositories.com/f/web-development/frontend-frameworks.md) — Provides a collection of patterns and practices for organizing complex user interface logic into decoupled, testable layers.

### Data & Databases

- [Application State Management](https://awesome-repositories.com/f/data-databases/application-state-management.md) — Synchronizes data across different parts of an interface using reactive patterns that ensure consistent updates and predictable behavior. ([source](https://github.com/rmanguinho/clean-react/blob/master/readme.md))

### DevOps & Infrastructure

- [Automated Deployment Pipelines](https://awesome-repositories.com/f/devops-infrastructure/automated-deployment-pipelines.md) — Connects continuous integration processes to production environments to streamline build, testing, and delivery workflows. ([source](https://github.com/rmanguinho/clean-react/blob/master/readme.md))

### Software Engineering & Architecture

- [Web Application Templates](https://awesome-repositories.com/f/software-engineering-architecture/application-lifecycle-management/reference-apps-and-blueprints/web-applications/typescript/web-application-templates.md) — Provides a production-ready starter kit that enforces strict typing and test-driven development for reliable web software.
- [Dependency Injection Containers](https://awesome-repositories.com/f/software-engineering-architecture/dependency-injection-containers.md) — Wires together decoupled system components at runtime to manage object lifecycles and simplify the process of swapping implementations for testing.
- [Hook-Based Logic Encapsulations](https://awesome-repositories.com/f/software-engineering-architecture/hook-based-logic-encapsulations.md) — Encapsulates and shares reactive data logic across components using functional primitives without relying on class-based lifecycle methods.
- [CI/CD Integrations](https://awesome-repositories.com/f/software-engineering-architecture/integration-extensibility/workflow-automation-integrations/ci-cd-integrations.md) — Streamlines build and deployment processes by connecting continuous integration workflows to production environments.
- [Interface Design Principles](https://awesome-repositories.com/f/software-engineering-architecture/interface-design-principles.md) — Defines strict contracts between system modules to ensure components remain interchangeable and adhere to solid principles for better maintainability.
- [Clean Architecture Implementations](https://awesome-repositories.com/f/software-engineering-architecture/java-application-architecture/clean-architecture-implementations.md) — Structures application logic into decoupled layers using established design patterns to improve long-term maintainability and simplify testing. ([source](https://github.com/rmanguinho/clean-react/blob/master/readme.md))
- [Dependency Inversion Patterns](https://awesome-repositories.com/f/software-engineering-architecture/project-management-governance/dependency-boundary-enforcers/dependency-inversion-patterns.md) — Organizes application logic into decoupled layers where high-level business rules remain independent of low-level framework details and external dependencies.
- [React State Distribution Patterns](https://awesome-repositories.com/f/software-engineering-architecture/react-state-distribution-patterns.md) — Synchronizes data across complex user interfaces using reactive patterns to maintain consistent updates and predictable behavior.
- [Static Type Checking](https://awesome-repositories.com/f/software-engineering-architecture/static-type-checking.md) — Employs a structural type system to catch errors during development by enforcing consistent data shapes across the entire application codebase.
- [Test-Driven Development Workflow](https://awesome-repositories.com/f/software-engineering-architecture/test-driven-development-workflow.md) — Requires writing failing unit tests before implementing features to ensure every piece of code is verified and functionally correct.

### Testing & Quality Assurance

- [End-to-End Testing](https://awesome-repositories.com/f/testing-quality-assurance/software-testing/e2e-integration-testing/end-to-end-testing.md) — Validates code reliability by writing unit, integration, and end-to-end tests that verify expected behavior before deployment. ([source](https://github.com/rmanguinho/clean-react/blob/master/readme.md))