clean-architecture

Organize React/React Native projects into Clean Architecture layers and feature folders.

Updated Jan 18, 2026
One-click install
npx skills add https://github.com/333-333-333/iris --skill clean-architecture-333-333-333
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: clean-architecture
Source: https://github.com/333-333-333/iris/tree/main/skills/clean-architecture
Command: npx skills add https://github.com/333-333-333/iris --skill clean-architecture-333-333-333

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Clean Architecture + Screaming Architecture patterns help React/React Native teams structure large codebases, making intent clear and maintenance easier by separating concerns into distinct layers and feature folders.

Core Features & Use Cases

  • Structured layering that clearly separates Presentation, Application, Domain, and Infrastructure with inward dependencies.
  • Feature-oriented layout with representative folders (voice, vision, shared) that map to real app capabilities.
  • Refactoring guidance for starting new features, breaking large monoliths into focused components, and defining domain boundaries.

Quick Start

Analyze and apply the Screaming Architecture by reorganizing your React/React Native project into feature folders like voice, vision, and shared.

Frequently Asked Questions about clean-architecture

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
What is clean architecture in React Native projects?

Clean architecture in React Native separates code into Presentation, Application, Domain, and Infrastructure layers with inward dependencies. This clarifies boundaries and improves maintainability by keeping the domain framework-agnostic.

How do I structure a React project using screaming architecture?

Structure a React project using screaming architecture by reorganizing into feature folders like voice, vision, and shared. This feature-oriented layout maps to real app capabilities and separates concerns into presentation, application, domain, and infrastructure layers.

When do I need domain-driven layering for my React application?

You need domain-driven layering for React applications when structuring large codebases to make intent clear and maintenance easier. It separates concerns into distinct layers with inward dependencies and a framework-agnostic domain for testability.

Can I use clean architecture to refactor an existing React Native monolith?

Yes, clean architecture provides refactoring guidance for breaking large React Native monoliths into focused components. It helps define domain boundaries and reorganize code into feature folders with clear separation of concerns.

Does clean architecture work for both React and React Native codebases?

Yes, clean architecture applies to both React and React Native projects to clarify boundaries and improve maintainability. It separates presentation, application, domain, and infrastructure layers with inward dependencies across both frameworks.