React para quem vem do Delphi: o que muda na forma de pensar

Quem passou anos programando em Delphi tem uma vantagem enorme ao aprender React. Só que, no começo, a cabeça precisa mudar de lugar.

Eu venho de anos de aplicações desktop Windows (Win32) em Delphi e, mais recentemente, migrei para o desenvolvimento web com JavaScript, TypeScript e React, que hoje uso tanto em projetos corporativos quanto em projetos pessoais. Isso não quer dizer que larguei o Delphi: hoje estou mais focado nas tecnologias web, mas ainda mantenho um projeto Delphi legado, que segue recebendo evoluções, além de projetos Delphi pessoais e de conteúdos para o meu canal do YouTube. Este post não é um tutorial, e também não esgota o assunto — é muita coisa para caber num post só. É um resumo do que eu senti na pele nessa mudança, com opinião e tudo.

O quadro em branco

No Delphi, você abre a paleta de componentes, arrasta um botão, um campo, uma grid, e a tela já tem cara de tela. No React, tudo começa como um quadro em branco. Cada elemento é desenhado do zero: o tamanho, a cor, o espaço entre as coisas, o que acontece quando a janela encolhe.

Essa foi uma das coisas que mais me travaram no começo: a quantidade de detalhes de CSS. O que no Delphi parecia natural virava uma lista de decisões, e cada uma delas era minha.

Estado: onde eu mais travei

A outra pedra no caminho foi o estado. É a mudança de mentalidade mais importante, então vale um exemplo bem pequeno.

No Delphi, quando o usuário clica em salvar, eu mando a tela fazer as coisas:

procedure TFormCliente.btnSalvarClick(Sender: TObject);
begin
  lblStatus.Caption := 'Salvo!';
  btnSalvar.Enabled := False;
end;

No React, eu não mando nada. Só guardo uma informação, o "estado", e descrevo como a tela fica quando ela for verdadeira:

function FormCliente() {
  const [salvo, setSalvo] = useState(false);

  return (
    <>
      <button disabled={salvo} = => setSalvo(true)}>
        Salvar
      
      {salvo && Salvo!}
    
  );
}