#1 - O que é React?

React é uma biblioteca — e essa distinção importa

💡 A confusão mais comum de quem está começando é chamar React de "framework". Essa diferença tem impacto real no dia a dia.

Uma biblioteca é uma coleção de ferramentas que você usa para resolver problemas específicos. Você escolhe quando e como usar cada uma. Quem manda é o seu código.

Um framework, por outro lado, define a estrutura do projeto. Ele dita como as coisas devem ser organizadas e quais padrões seguir. Quem manda é o framework — e o seu código se encaixa nele.

React é uma biblioteca JavaScript criada para construir interfaces de usuário (o que aparece na tela). Ele nasceu no Facebook (hoje Meta) em 2011, foi liberado como open source em 2013, e desde então cresceu muito além do feed de notícias onde foi criado.

Para deixar mais concreto: Node.js é usado com Express ou Nest.js. Java é usado com Spring. React funciona da mesma forma — você traz ele para o projeto, e decide como organizar o resto.

No fundo, React é JavaScript

Esse ponto faz muita diferença na hora de aprender: React não é uma linguagem nova, não é uma magia separada. É JavaScript com algumas convenções e ferramentas em cima.

Quando você escreve um componente React, está escrevendo JavaScript. Quando trata eventos, manipula dados ou cria lógica, é JavaScript. Aquela sintaxe que parece HTML dentro do código (o JSX) também é convertida para JavaScript puro antes de rodar no navegador.

Isso significa que investir em entender JavaScript bem é investir em entender React melhor. Quanto mais sólida sua base em JS, mais natural o React vai parecer.

Como o React trabalha: DOM e Virtual DOM

Para entender o que React faz de especial, é preciso conhecer dois conceitos:

DOM (Document Object Model) é como o navegador representa a estrutura de uma página HTML — uma árvore de elementos. Toda vez que algo muda na página, o navegador precisa percorrer e atualizar essa árvore. Em páginas com muita interação, isso pode ficar lento.

Virtual DOM é uma cópia leve dessa árvore que o React mantém na memória. Quando algo muda no seu app, o React primeiro atualiza o Virtual DOM, compara com a versão anterior (um processo chamado de "diff"), e só então atualiza no DOM real as partes que realmente mudaram. Resultado: menos trabalho para o navegador, interface mais fluida.

Por que tanta gente usa React?

Alguns motivos práticos que fazem diferença no dia a dia:

• Componentização: você divide a interface em blocos independentes e reutilizáveis. Cria um botão uma vez, usa em qualquer lugar do projeto.

• Ecossistema enorme: tem biblioteca para quase tudo — roteamento, formulários, animações, gerenciamento de estado.

• Comunidade ativa: muita documentação, muita resposta em fóruns, e muita vaga de emprego pedindo React.

• Portabilidade: com React Native, o mesmo raciocínio de componentes serve para criar apps mobile para iOS e Android.

Quando não usar React

Aqui está o ponto que poucos falam logo de início: React não é a resposta para tudo.

Se você está criando uma landing page, um site institucional simples ou um blog com poucas páginas, React pode ser um canhão para combater uma formiga. Você vai adicionar complexidade de configuração, mais peso de carregamento e tempo de setup para algo que HTML + CSS + um pouco de JavaScript resolve muito bem.

Faz sentido usar React quando:

• A interface tem muita interação com o usuário

• Você precisa de componentes reutilizáveis em escala

• O projeto vai crescer e precisa de uma boa organização

• Há atualização frequente de dados na tela sem recarregar a página

Provavelmente não precisa de React quando:

• A página é basicamente estática

• Não há muita interação

• Performance de carregamento é crítica e a simplicidade resolve melhor

• O time é pequeno e a manutenção de um setup mais complexo não compensa