Além de desenhar a tela

Um componente tem um trabalho principal: desenhar a tela a partir das props e do estado. Mas às vezes ele precisa fazer algo além disso — buscar dados de uma API, ligar um timer, mudar o título da aba, salvar no navegador.

Essas ações são efeitos colaterais (side effects): coisas que "saem" do simples desenhar.

🧠 Modelo mental: o corpo do componente é "descrever a foto" (o JSX). Um efeito é "e também, depois de tirar a foto, mande um e-mail". São tarefas paralelas ao desenho.

⚠️ Por que não fazer isso solto no meio do componente: o componente re-renderiza várias vezes. Se você chamar uma API direto no corpo, ela seria chamada a cada render — um desastre. Por isso existe um lugar certo para efeitos: o useEffect (próxima aula).