Contexto
Trabalhei via Tecla em um projeto curto para uma empresa de saúde dos Estados Unidos. O produto existente usava transcrição de áudio e agentes de IA para apoiar fluxos de atendimento em hospitais, como organizar informações clínicas e consultar conhecimento médico e artigos. Um grande cliente hospitalar pediu uma experiência personalizada, que envolvia vários frontends que precisavam evoluir de forma consistente.
Restrições
- Várias aplicações: um shell principal cujo menu levava a frontends separados.
- Os micro-frontends tinham sido escolhidos antes da minha entrada.
- Todos os frontends precisavam seguir os mesmos designs do Figma.
- Trabalho direto com stakeholders dos Estados Unidos.
- Um prazo curto.
O que construí
- Um Storybook para o time.
- Uma biblioteca interna de componentes React construída a partir dos designs do Figma: mais de 50 componentes, incluindo botões, inputs, chat e modais.
- A integração da biblioteca nos micro-frontends, com adaptações onde cada um precisava.
- Manifests de ArgoCD para os novos serviços, adaptados dos existentes mudando o serviço e os recursos.
Arquitetura: o que foi meu
- Já existia: a arquitetura de micro-frontends, o shell que levava a frontends separados e o setup de deploy com ArgoCD usado por outros serviços.
- Minha implementação: a biblioteca de componentes, o Storybook como referência visual, a integração da biblioteca nos frontends e os manifests de ArgoCD dos novos serviços.
Dados FHIR na interface
Parte dos dados do domínio seguia o FHIR, o padrão de interoperabilidade em saúde usado pelo backend. Ajudei a adaptar os dados FHIR de que a interface precisava para um formato que o frontend conseguisse exibir.
Resultado
- Uma biblioteca compartilhada com mais de 50 componentes reutilizáveis em uso.
- O Storybook como referência do time para a implementação visual.
- Vários frontends construídos sobre a mesma base.
- Um MVP funcionando.
Fim do projeto
O projeto terminou quando o cliente decidiu não continuar o contrato por motivos comerciais ligados a prazo e custo.
Lição de engenharia
Micro-frontends trazem independência, mas cada fronteira também é um lugar onde botões, inputs e modais são reconstruídos de um jeito um pouco diferente. Sem uma base compartilhada, essa independência vira fragmentação e duplicação. Uma biblioteca de componentes com uma referência visual única permite que os frontends fiquem separados no código e ainda pareçam um só produto.