Além o básico
Este manual cobriu o essencial: configurar um projeto, componentes, JSX, estilo, props, estado, eventos, formulários, efeitos, e os hooks que os conectam, junto com o processo de pensar em React para transformar um design em uma aplicação funcional e o trabalho de manter essa aplicação acessível. Isso é o núcleo da biblioteca, e é suficiente para construir interfaces reais e funcionais. Alguns temas ficam fora desse núcleo, e quase toda aplicação React em produção acaba precisando de uma combinação deles mais cedo ou mais tarde. Este capítulo é o mapa: o que cada um faz, onde se encaixa, e onde aprender sobre isso.
Roteamento
Uma aplicação de página única renderiza tudo no navegador e troca o que está na tela em vez de pedir ao servidor uma página nova toda vez. Isso faz parte do que a torna rápida, mas também significa que a navegação usual do navegador — digitar uma URL, clicar para voltar, marcar uma página — não tem onde se conectar a menos que algo construa isso. Roteamento é essa peça: mapeia uma URL para a view que deve aparecer, mantém a barra de endereço sincronizada conforme o usuário se move, e mantém o botão de voltar funcionando, tudo sem recarregar a página inteira. React Router é a biblioteca que a maioria das aplicações React usa para isso.
Meta-frameworks
React em si apenas renderiza a interface. Ele não oferece uma opinião sobre roteamento, como carregar dados antes de uma página aparecer, ou como renderizar uma página no servidor antes de chegar ao navegador — três coisas que quase toda aplicação em produção precisa. Um meta-framework é um framework construído sobre React que fornece essas peças faltantes, e Next.js é o que a maioria do mundo React usa. Por isso a maioria das aplicações React em produção não é apenas React: é React rodando dentro do Next.js ou algo parecido. Os tipos de frameworks cobre meta-frameworks com mais profundidade, inclusive como Next.js se relaciona com React.
Ferramentas
Esta parte já tem um capítulo só dela. Configurar um projeto React cobriu por que o JSX usado em todo este manual não é JavaScript válido por si só, e como Vite roda um servidor de desenvolvimento, compila JSX na hora, e empacota tudo em arquivos otimizados quando chega a hora de colocar em produção. Merece estar neste mapa porque fica embaixo de tudo mais: um roteador, um meta-framework, e uma etapa de deploy todos assumem que uma ferramenta de build já está fazendo esse trabalho. Volte ao capítulo de configuração quando quiser entender os detalhes de novo.
Colocando em produção
Depois que a aplicação é construída, ela precisa de um lar. Rodar um comando de build, vite build para um projeto Vite, produz uma pasta com arquivos HTML, CSS e JavaScript puros: a saída estática da aplicação. Enviar essa pasta para um host, como Netlify, Vercel ou Cloudflare Pages, é o que coloca a aplicação na internet para outras pessoas usarem.
Onde isso deixa você
Esse é o mapa: roteamento para se mover entre views, um meta-framework como Next.js para lidar com o que React deixa de lado, o build do Vite do capítulo de configuração transformando o código em arquivos que o navegador pode carregar, e um host para colocar o resultado online. Nada disso precisa ser aprendido hoje. Escolher e aprender um framework é o guia para decidir se e quando adicionar uma peça como Next.js, e como pesar as opções quando chegar essa hora. O caminho mais rápido por tudo isso é a mesma abordagem que te trouxe até aqui: construir um pequeno projeto real. Escolha algo que valha a pena fazer, confie nos fundamentos deste manual, e traga as peças acima apenas quando o projeto realmente pedir por elas.
