separation-of-concerns

To separate business logic from UI components, move business rules from the presentation layer into domain use cases. This skill detects mixed responsibilities and guides modularization of UI, business logic, and data access during refactoring or code reviews.

Clean architecture layer separation distinctly divides UI presentation, domain business logic, and data access infrastructure. This skill identifies and enforces these boundaries by providing layer dependency rules and checks to improve code modularity and testability.

Refactor mixed React components by extracting data access into infrastructure modules and business rules into domain use cases. This skill provides before and after refactoring examples with concrete domain, infrastructure, and presentation layer separations.

Common separation of concerns violations include UI components directly accessing databases or containing business rules. This skill outlines layer dependency rules and provides guidance for detecting these violations alongside clean modular solutions.

Yes, this approach applies to TypeScript and React projects undergoing code reviews. It detects mixed responsibilities across presentation, domain, and infrastructure layers, enabling modularization of UI, business logic, and data access.