Exécutez n'importe quel Skill dans Manus
en un clic

Exécutez n'importe quel Skill dans Manus en un clic

react-web-feature-architecture

Étoiles2

Forks0

Mis à jour27 février 2026 à 11:26

React web feature architecture guidelines for LifeOS. Use when creating pages, feature modules, forms, API hooks, global stores, and UI composition in frontend/src for scalable and testable structure.

Installation

Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.

Exécuter dans Manus

Source

pvidaal07

pvidaal07/LifeOS

Ouvrir le dépôt GitHub Voir les dépôts du créateur

Téléchargement

Exécuter dans Manus

Métiers associésSOC

Basé sur la classification professionnelle SOC

Développeurs de logicielsProfessions informatiques et mathématiques·SOC 15-1252

Explorateur de fichiers

2 fichiers

SKILL.md

readonly

name	react-web-feature-architecture
description	React web feature architecture guidelines for LifeOS. Use when creating pages, feature modules, forms, API hooks, global stores, and UI composition in frontend/src for scalable and testable structure.

React Web Feature Architecture

Objetivo

Organizar frontend por features para escalar sin acoplar vistas, estado y acceso a API.

REQUIRED

Estructurar por dominio/feature (auth, dashboard, studies, etc.).
Separar UI reusable (components) de lógica de feature.
Centralizar cliente HTTP en frontend/src/api.
Usar TanStack Query para estado servidor (fetch/cache/retry).
Reservar Zustand para estado cliente/global (sesión, UI).
Tipar respuestas API y normalizar errores en hooks.
Mantener páginas ligeras: composición + navegación, no reglas de negocio.

NEVER

No duplicar lógica de fetching en múltiples componentes.
No mezclar estado remoto en stores globales sin necesidad.
No acoplar componentes de UI a endpoints concretos.

Flujo recomendado

Definir contrato API del feature.
Crear api.* + hook de query/mutation.
Crear componentes presentacionales.
Componer página y cubrir estados loading/error/empty/success.

Plus depuis ce dépôt

même dépôt

nestjs-best-practices

pvidaal07/LifeOS

NestJS best practices and architecture patterns for building production-ready applications. This skill should be used when writing, reviewing, or refactoring NestJS code to ensure proper patterns for modules, dependency injection, security, and performance.

2026-02-272

api-contracts

pvidaal07/LifeOS

API DTO and response contract rules for LifeOS backend/frontend compatibility. Use when adding or changing endpoints, request/response DTOs, error payloads, versioning decisions, or Swagger/OpenAPI documentation.

2026-02-272

auth-and-ownership

pvidaal07/LifeOS

Authentication and ownership enforcement rules for LifeOS multi-user isolation. Use when creating or changing auth flows, guarded endpoints, user-scoped queries, or nested resource access checks.

2026-02-272

clean-architecture-ddd

pvidaal07/LifeOS

Clean Architecture + DDD rules for this repo. Triggers: adding/refactoring code across src/domain|application|infrastructure, moving files between layers, creating ports/adapters/use-cases.

2026-02-272

docker-selfhost

pvidaal07/LifeOS

Docker Compose self-hosting conventions for LifeOS development and production. Use when editing compose files, environment variables, service networking, persistent volumes, health checks, or deployment workflows.

2026-02-272

docs

pvidaal07/LifeOS

Repository documentation conventions for LifeOS. Use when creating or updating README, docs/*, architecture notes, API behavior notes, or implementation decisions that must remain clear for future contributors and agents.

2026-02-272

name	react-web-feature-architecture
description	React web feature architecture guidelines for LifeOS. Use when creating pages, feature modules, forms, API hooks, global stores, and UI composition in frontend/src for scalable and testable structure.

React Web Feature Architecture

Objetivo

Organizar frontend por features para escalar sin acoplar vistas, estado y acceso a API.

REQUIRED

Estructurar por dominio/feature (auth, dashboard, studies, etc.).
Separar UI reusable (components) de lógica de feature.
Centralizar cliente HTTP en frontend/src/api.
Usar TanStack Query para estado servidor (fetch/cache/retry).
Reservar Zustand para estado cliente/global (sesión, UI).
Tipar respuestas API y normalizar errores en hooks.
Mantener páginas ligeras: composición + navegación, no reglas de negocio.

NEVER

No duplicar lógica de fetching en múltiples componentes.
No mezclar estado remoto en stores globales sin necesidad.
No acoplar componentes de UI a endpoints concretos.

Flujo recomendado

Definir contrato API del feature.
Crear api.* + hook de query/mutation.
Crear componentes presentacionales.
Componer página y cubrir estados loading/error/empty/success.