Mkhira/react-clean-architecture

¿Qué hace react-clean-architecture?

Claude Code Agent Skill: andamiaje de características de arquitectura limpia impulsado por scripts para una app React Native (Expo) + tsyringe — con curl obtienes una pila completa de características (DTOs, mapeadores, servicios, repositorios, casos de uso, DI, i18n, configuración de entorno, tests Jest, auto-auditoría).

¿Qué hace?

Cuando ejecutas la instrucción:

curl -s https://raw.githubusercontent.com/Mkhira/react-clean-architecture/main/scaffold-feature.sh \
  | bash -s -- NombreDeLaCaracteristica

Obtienes instantáneamente:

• src/features/<nombre>/dto.ts & index.ts
• src/features/<nombre>/mapper.ts
• src/features/<nombre>/service.ts & index.ts
• src/features/<nombre>/repository.ts & index.ts
• src/features/<nombre>/use-case.ts & index.ts
• src/features/<nombre>/di.ts
• src/features/<nombre>/i18n/ (en & es)
• src/features/<nombre>/env.ts
• src/features/<nombre>/__tests__/service.test.ts, use-case.test.ts, repository.test.ts, controller.test.ts
• Controlador incorporado en src/controllers/<nombre>.controller.ts
• Enrutado automático en src/routes/index.ts
• Auto-auditoría: npm run audit:features

Plataformas compatibles

• Claude Code – hereda instrucciones del sistema a través del setup de SKILL.md
• Cursor – importa como regla personalizada desde .cursorrules
• Cline – se añade a CLINE_COMMAND o claude_project_instructions

Cómo funciona

1. El script scaffold-feature.sh descarga el paquete react-clean-architecture vía npm/git
2. Lee la estructura de la app (administrador, usuario, etc.) desde src/config/app.ts
3. Crea archivos con nombre de archivo CamelCase + TypeScript + tsyringe
4. Vincula i18n, entorno y DI
5. Agrega enrutamiento automático de Express

Estructura de ejemplo

src/
├── features/
│   ├── auth/
│   │   ├── dto.ts
│   │   ├── mapper.ts
│   │   ├── service.ts
│   │   ├── repository.ts
│   │   ├── use-case.ts
│   │   ├── di.ts
│   │   ├── i18n/
│   │   │   ├── en.json
│   │   │   └── es.json
│   │   ├── env.ts
│   │   └── __tests__/
│   │       ├── service.test.ts
│   │       ├── use-case.test.ts
│   │       └── repository.test.ts
│   └── ...
├── controllers/
│   └── auth.controller.ts
├── routes/
│   └── index.ts

Explicación técnica

Este skill aprovecha:

• tsyringe para inyección de dependencias
• expo para el ecosistema móvil
• Jest para tests unitarios con mocks
• Scripts de shell para generación de código
• Plantillas para piezas estandarizadas de arquitectura limpia

Requisitos previos

• Node.js 18+
• Expo SDK 49+
• React Native 0.72+
• tsyringe instalado
• Jest configurado

Instalación

# Añadir a tu proyecto
npm install --save-dev @mkhira/react-clean-architecture

# O habilita como skill de Claude Code
# claude-skills.json

Uso

Crear una nueva característica

curl -s https://raw.githubusercontent.com/Mkhira/react-clean-architecture/main/scaffold-feature.sh \
  | bash -s -- Auth

Esto genera:

✅ Característica Auth scaffold creada
✅ Controlador creado en src/controllers/auth.controller.ts
✅ Rutas añadidas en src/routes/index.ts
✅ DI registrado
✅ i18n configurado (en, es)
✅ Entorno configurado
✅ Tests listos

Ejecutar auto-auditoría

npm run audit:features

Ejecutar tests

npm test -- --testPathPattern=features/Auth

Scripts personalizados

Script	Descripción
scaffold-feature.sh	Crea el scaffolding completo de una característica
audit-features.sh	Audita consistencia de imports, DI y tests
clean-feature.sh	Elimina una característica y sus referencias

Integración con Claude Code

Usa este skill activando "Mkhira/react-clean-architecture" desde tu archivo claude-skills.json o añade esto a tu sesión:

Activa el skill Mkhira/react-clean-architecture para que genere scaffolding de características

Licencia

MIT