Prompt completo
"Você é um especialista em desenvolvimento front-end com foco em React e arquitetura de software escalável. Sua tarefa é criar um guia detalhado para um desenvolvedor sênior que precisa reestruturar um monorepo React monolítico, migrando-o para uma arquitetura de micro-frontends/componentes agnósticos. O guia deve abordar: 1. **Estratégias de Decoupling:** Como identificar e isolar domínios de negócio para transformá-los em componentes reutilizáveis e independentes (npm packages, etc.). Inclua exemplos de como lidar com a separação de lógica de UI, estado e dados. 2. **Comunicação entre Componentes/Micro-frontends:** Detalhe padrões e tecnologias (Event Bus, Context API com "boundary providers", Web Components com Custom Events, Module Federation com Webpack 5) para comunicação eficiente e desacoplada, evitando dependências cíclicas. 3. **Gerenciamento de Estado Compartilhado:** Abordagens para gerenciar estado global em um ambiente distribuído, considerando soluções como Redux Toolkit com "slices" desacoplados, Zustand, ou a orquestração de Contexts independentes. 4. **Build e Deployment:** Estratégias para otimizar o processo de build e deployment de múltiplos pacotes/componentes, incluindo versionamento semântico, CI/CD e caching. 5. **Testabilidade e Manutenibilidade:** Como garantir que os componentes individuais sejam facilmente testáveis (unitários, integração, E2E) e mantenham alta manutenibilidade ao longo do tempo. 6. **Desafios e Armadilhas Comuns:** Alerte sobre problemas típicos (duplicação de código, gerenciamento de dependências, performance de carregamento, versionamento de APIs internas) e forneça soluções preventivas. O guia deve ser prático, com exemplos de código (pseudo-código ou exemplos conceituais) quando apropriado, e focado em decisões arquiteturais que promovam escalabilidade, reusabilidade e independência entre as partes do sistema. Utilize uma linguagem clara e concisa."
Tags relacionadas
React
Componentização avançada
gerado-automaticamente
Como usar este prompt
1
Clique no botão "Copiar" para copiar o prompt para sua área de transferência
2
Acesse sua ferramenta de IA preferida (ChatGPT, ChatGPT, Claude, etc.)
3
Cole o prompt e adapte conforme necessário para seu contexto específico
Outros prompts de React
ChatGPT
Melhores práticas de server-side rendering para React
Prompt gerado automaticamente para Server-side rendering em React
4 usos
ChatGPT
Melhores práticas de error boundaries para React
Prompt gerado automaticamente para Error boundaries em React
4 usos
ChatGPT
Melhores práticas de performance optimization para React
Prompt gerado automaticamente para Performance optimization em React
4 usos