Use os exemplos como laboratório: leia o código, preveja o resultado e teste no ambiente de prática. Para guardar uma ideia, selecione qualquer trecho.
CAPÍTULO 45 DE 48
Observabilidade sem expor pessoas
Neste capítulo, você transforma erro contextualizado em uma decisão de engenharia de interfaces que pode ser explicada, testada e revisada. Você sairá com uma implementação pequena, evidências de teste e um critério reutilizável nos projetos seguintes.
Escrita, marcações e comentários ficam só neste navegador, separados por capítulo e sem sincronização com a conta. Evite informações sensíveis; limpar os dados do navegador pode remover seus registros.
As seis questões têm correção comentada. Laboratório e projeto são práticas livres, sem execução automática de código.
Prepare-se — O que você vai construir
- Explicar erro contextualizado sem depender de uma receita decorada.
- Relacionar métrica de resultado ao contrato e ao fluxo observável.
- Aplicar privacidade em um caso real e em um limite.
Se precisar de apoio, consulte a capítulo anterior e volte a estas tarefas. Não há obrigação de seguir um prazo.
Entenda — Modelo mental e estrutura
1. Comece pelo modelo mental
Telemetria útil mede conclusão, falha e duração de tarefas. Erros recebem contexto técnico seguro, enquanto senhas, tokens e conteúdo pessoal ficam fora dos eventos. Em erro contextualizado, a sintaxe é apenas a superfície de um contrato. Relacione essa ideia a métrica de resultado e privacidade antes de editar o exemplo. Em software real, uma linha pode compilar e ainda representar uma suposição incorreta sobre dados, tempo, ambiente ou responsabilidade. Por isso, descreva a entrada, a transformação e o resultado observável com palavras simples.
Descreva primeiro o contrato de erro contextualizado e como ele se relaciona com métrica de resultado. Implemente a menor versão que revele o mecanismo e mantenha o caminho principal fácil de seguir. Se a solução depende de estado implícito, conversão silenciosa ou ordem acidental, registre essa dependência e procure torná-la explícita. O objetivo não é memorizar uma receita: é reconhecer quando o conceito se aplica, escolher uma abstração proporcional e conseguir explicar o custo dessa escolha.
2. Leia o código como uma sequência de decisões
registrar({ evento: 'perfil_salvo', duracaoMs, resultado: 'sucesso' });
Leia o exemplo de fora para dentro. Primeiro localize os dados e o contrato público; depois acompanhe as transformações; por fim, identifique efeitos, falhas e saídas. O trecho deixa erro contextualizado visível no código e permite evoluir privacidade sem esconder o fluxo principal. Digite o trecho em vez de apenas copiá-lo. Troque nomes e valores, faça uma hipótese e execute novamente. Essa comparação mostra o que pertence à regra da linguagem ou do framework e o que existe apenas por causa do exemplo.
Observe também o que o código não garante. React descreve a interface a partir de props e estado; TypeScript verifica contratos estáticos; HTML, CSS e APIs do navegador continuam responsáveis por semântica e comportamento da plataforma. Um tipo estático não valida automaticamente uma resposta externa; um componente não substitui semântica; uma abstração não corrige um contrato mal definido. Comentários úteis registram intenção, limite ou motivo. Comentários que repetem a sintaxe não compensam nomes vagos ou responsabilidades misturadas.
3. Converta observação em critério verificável
Uma solução forte torna erro contextualizado legível, verifica métrica de resultado com evidência e registra os limites de privacidade. Um bom critério descreve contexto, ação e resultado. Em vez de “funcionou”, registre qual entrada foi usada, qual saída era esperada e como uma falha deveria aparecer. Inspecione valores, mensagens e transições no projeto React 19.2 com TypeScript, navegador e testes. Quando houver interface, percorra também com teclado, zoom e tecnologia assistiva; quando houver servidor ou compilação, confira logs, tipos e limites de confiança.
A armadilha central é: usar casts, efeitos ou estado duplicado para contornar o contrato de erro contextualizado.. Corrija a causa antes de empilhar exceções. Reduza o caso, reproduza o problema, altere uma variável por vez e repita o teste. Ao terminar, você deve conseguir dizer por que a solução funciona, quais suposições preserva, onde pode falhar e que evidência outra pessoa pode usar para revisar a entrega.
Analise — Código em contexto
Uma revisão começa pela intenção. Para “Observabilidade sem expor pessoas”, o requisito é: a solução deve demonstrar erro contextualizado, preservar métrica de resultado e reagir de forma previsível quando privacidade variar. Analise a variação abaixo e preveja o resultado antes de executá-la.
<ErrorBoundary onError={(erro, info) => relatar(erro, info.componentStack)}>...</ErrorBoundary>
A variação isola métrica de resultado. Acompanhe dados, controle e efeitos antes de decidir se o resultado respeita o contrato. Faça quatro passagens. Na primeira, identifique entradas e saídas. Na segunda, siga o fluxo de controle e as transformações. Na terceira, procure valores ausentes, concorrência, mutação e dependências do ambiente. Na quarta, avalie a experiência de erro e a capacidade de testar o trecho isoladamente.
Compare a variação com o exemplo principal. Escolha uma mudança e formule uma hipótese completa: “se eu alterar isto, espero aquilo, porque…”. Execute, observe e registre. A resposta importante não é apenas qual trecho passa no caso feliz, mas qual comunica melhor o contrato, reduz acoplamento e permanece compreensível para quem precisar manter, depurar ou integrar o módulo depois.
Construa — Teste cada decisão no ambiente
Crie um laboratório pequeno e executável em projeto React 19.2 com TypeScript, navegador e testes. Reproduza o exemplo, explique cada etapa e crie uma segunda versão que aplique privacidade sem perder erro contextualizado. Primeiro implemente o caminho principal sem abstrações prematuras. Depois use o depurador, o verificador de tipos, os testes ou as ferramentas de inspeção adequadas para confirmar o fluxo. Por último, force três situações adversas: entrada vazia, volume maior que o esperado e falha controlada em projeto React 19.2 com TypeScript, navegador e testes.
Não corrija todos os sintomas de uma vez. Para cada falha, anote hipótese, evidência e menor mudança. Rode novamente os cenários já aprovados para detectar regressões. Quando houver mais de uma solução possível, escolha pela clareza do contrato, pela facilidade de teste e pelo custo de mudança. Uma captura ou um log ajuda a documentar, mas código, critérios e testes reproduzíveis continuam sendo a fonte principal da entrega.
Pratique — Seis decisões de implementação
Resolva primeiro pelo raciocínio. Consultar o capítulo e testar hipóteses no navegador faz parte do processo; depois, releia as justificativas.
Confira — Gabarito comentado
Abrir gabarito e explicações completas
E1 — A. A implementação começa pelo contrato observável. Descreva primeiro o contrato de erro contextualizado e como ele se relaciona com métrica de resultado. Assim, a sintaxe passa a servir a uma decisão que pode ser revisada.
E2 — C. A evidência precisa exercitar o mecanismo estudado. Executar o caminho principal e os limites de métrica de resultado, observando o resultado de privacidade. O caso feliz isolado não revela limites nem recuperação.
E3 — B. A armadilha é usar casts, efeitos ou estado duplicado para contornar o contrato de erro contextualizado. Ela oculta o mecanismo e amplia o risco de regressão quando dados ou requisitos mudam.
E4 — A. A alternativa correta inclui pessoas e integrações no contrato: Manter nomes, estados, foco e mensagens compreensíveis quando erro contextualizado chegar à interface. Estados e limites precisam permanecer compreensíveis.
E5 — C. A sequência baseada em evidência relaciona causa e efeito. Mudanças amplas escondem o mecanismo e dificultam perceber regressões.
E6 — B. Pronto para revisão significa atender critérios observáveis. O contrato de erro contextualizado está explícito, métrica de resultado foi exercitado e a falha de privacidade produz um estado compreensível. Outra pessoa ainda pode encontrar melhorias, mas consegue reproduzir a evidência.
Projete — Implemente, compare e refine
Entrega incremental: um componente de laboratório sobre observabilidade sem expor pessoas com props tipadas, estados visíveis e testes de interação. Comece descrevendo, em até cinco linhas, quem usa o recurso e qual tarefa precisa concluir. Separe domínio, entrada e apresentação conforme a escala do problema. Inclua um caso real, um limite e uma falha recuperável. Ao final, escreva uma nota técnica explicando onde aplicou erro contextualizado, como verificou métrica de resultado e qual limite encontrou em privacidade.
Consultar um modelo possível
registrar({ evento: 'perfil_salvo', duracaoMs, resultado: 'sucesso' });
O modelo ilustra uma possibilidade. Use os critérios para revisar suas próprias ideias, não para copiar as mesmas frases.
Critérios para revisar
- O contrato de erro contextualizado está explícito, métrica de resultado foi exercitado e a falha de privacidade produz um estado compreensível.
- Manter nomes, estados, foco e mensagens compreensíveis quando erro contextualizado chegar à interface.
- O código evidencia erro contextualizado e métrica de resultado sem estado acidental.
- A nota técnica registra o teste de entrada vazia, volume maior que o esperado e falha controlada em projeto React 19.2 com TypeScript, navegador e testes.
Até 12.000 caracteres em cada versão. Produção livre, sem correção automática.
Retome — Organize sua revisão
- Explique com suas palavras a relação entre erro contextualizado e métrica de resultado.
- Reabra o laboratório sem consultar o texto e reconstrua a decisão ligada a privacidade.
- Aplique o teste “Executar o caminho principal e os limites de métrica de resultado, observando o resultado de privacidade.” ao projeto acumulado e registre uma melhoria.
Feche a explicação, tente lembrar um exemplo e depois confira. Retome uma dificuldade no próximo encontro e alguns dias depois; ajuste o intervalo ao que ainda precisa praticar.
Use exemplos concretos na autoavaliação: “consigo explicar com consulta” ou “quero praticar novamente”. Marcar como lida não representa uma certificação.
SEU PROGRESSO NO CAPÍTULO 45
Um capítulo, no seu ritmo.
— exercícios respondidos
Carregando progresso…Você decide quando marcar este capítulo como lido. Isso não altera seus exercícios nem suas marcações.
Progresso salvo só neste navegador, sem sincronização com sua conta.