O stack web moderno: React, TypeScript e Next.js

React, TypeScript e Next.js dominam o desenvolvimento de front-end em 2025. Eles são usados por 81%, 78% e 17,9% dos desenvolvedores de JavaScript, respectivamente. Todos os três surgiram entre 2012 e 2016. Os três agora enfrentam a mesma questão: a busca por poder os tornou complexos demais?

Entendendo o stack

Veja como o React, o TypeScript e o Next.js evoluíram juntos nos últimos 13 anos:

Explore os principais conceitos abaixo. Alterne entre o modo CLI para uma experiência de terminal ou o modo Browse para cartões expansíveis.

React: De ferramenta do Facebook a padrão do setor

Origens

Jordan Walke criou o React em 2011 para resolver problemas de atualização em cascata nos anúncios do Facebook. Inicialmente chamado de "FaxJS", ele foi lançado no Feed de notícias do Facebook em 2011 e no Instagram em 2012. O React teve seu código aberto em 29 de maio de 2013 na JSConf US.

Os desenvolvedores estavam céticos. O JSX incorporava uma sintaxe semelhante à do HTML no JavaScript, o que parecia um passo para trás. A equipe do React realizou um "React Tour" para conquistar os críticos. A adoção aumentou depois que o artigo de David Nolen de dezembro de 2013 mostrou a vantagem de desempenho do React.

Principais marcos

Os Hooks, introduzidos em fevereiro de 2019, marcaram a maior mudança de paradigma do React. Eles permitiram recursos de estado e ciclo de vida em componentes funcionais, eliminaram componentes de classe e reduziram o boilerplate em 30-50%.

Principais lançamentos:

• 0.3.0 (maio de 2013): Virtual DOM, arquitetura de componentes
• 16.0 (setembro de 2017): Fiber architecture, reescrita completa, licença MIT
• 16.8 (fevereiro de 2019): Hooks (useState, useEffect)
• 18.0 (março de 2022): Renderização simultânea, batching automático
• 19.0 (dezembro de 2024): Server Components estáveis, Server Actions, React Compiler

Filosofia técnica

O React se concentra no fluxo de dados unidirecional, na arquitetura baseada em componentes e no Virtual DOM. Ao contrário da abordagem de estrutura completa do Angular com injeção de dependência e TypeScript necessário, o React se posiciona como "apenas uma biblioteca" para a camada de visualização. Os desenvolvedores escolhem suas próprias ferramentas de roteamento, gerenciamento de estado e construção.

Adoção

O React tem mais de 50 milhões de downloads semanais do npm e mais de 234.000 estrelas no GitHub. Mais de 50 milhões de sites e 20 milhões de desenvolvedores usam o React. Os principais usuários incluem Netflix, Airbnb, Walmart, Uber, Discord e Meta.

O React influenciou todo o setor. Vue, Angular, SwiftUI e Jetpack Compose adotaram padrões inspirados no React.

Estado atual

O React 19, lançado em dezembro de 2024, estabilizou os Server Components. Os defensores citam renderizações iniciais 67% mais rápidas e bundles de cliente menores. Os críticos dizem que Server Components adicionam muita complexidade e dificultam o debugging.

Em 7 de outubro de 2025, a Meta anunciou a React Foundation sob a Linux Foundation com US$ 3 milhões em financiamento e cinco anos de suporte de engenharia. Isso aborda preocupações sobre o controle de uma única empresa sobre a direção do React.

TypeScript: O companheiro essencial do JavaScript

Origens

Anders Hejlsberg, criador do Turbo Pascal, Delphi e C#, liderou o desenvolvimento do TypeScript na Microsoft a partir de 2010. A linguagem foi lançada em 1º de outubro de 2012 (versão 0.8). Hejlsberg explicou a motivação: "Não havia classes, não havia módulos e não havia um sistema de tipos estáticos, por isso era muito difícil escrever aplicativos grandes em JavaScript."

O TypeScript foi lançado como código aberto sob a licença Apache 2.0. A adoção inicial foi lenta, limitada às equipes da Microsoft e aos usuários do Visual Studio.

Marcos

O caminho do TypeScript do ceticismo ao padrão:

• 2012: Lançamento inicial (v0.8)
• 2013: Adicionados os genéricos (v0.9)
• Abril de 2014: TypeScript 1.0 na Microsoft Build
• 2016: TypeScript 2.0 com verificações rigorosas de nulidade e análise de fluxo de controle
• 2016: O Google adota o TypeScript para o Angular 2 (ponto de virada)
• 2018: pesquisa da npm mostra que 46% dos desenvolvedores de JS usam TypeScript
• Março de 2023: TypeScript 5.0 com decoradores padronizados
• Agosto de 2025: O TypeScript se torna a linguagem mais usada do GitHub, ultrapassando o Python

Hoje: Mais de 95 milhões de downloads semanais do npm, 4,2 milhões de repositórios públicos do GitHub, 78% de adoção entre os desenvolvedores de JS. A Airbnb descobriu que 38% dos bugs em sua base de código poderiam ter sido evitados com o TypeScript.

Abordagem técnica

O TypeScript é um superconjunto estrito do JavaScript. Todo programa JavaScript válido é um TypeScript válido. Ele usa tipagem estrutural (os tipos correspondem à forma, não ao nome), ao contrário da tipagem nominal do Java ou do C#. Os tipos são apagados durante a compilação. O resultado é JavaScript simples com zero de sobrecarga de tempo de execução.

TypeScript 7 e a reescrita em Go

Em 11 de março de 2025, Anders Hejlsberg anunciou o Projeto Corsa: o compilador do TypeScript está sendo reescrito em Go. Os benchmarks mostram uma melhoria de 10 vezes. As 1,5 milhão de linhas do VS Code são compiladas em 7,5 segundos, em vez de 77 segundos. A versão em Go (tsgo) está sendo planejada para o início de 2026 para ser lançada como TypeScript 7.0.

Next.js: React pronto para produção

Origens

Guillermo Rauch e a equipe da Zeit (agora Vercel) lançaram o Next.js em 25 de outubro de 2016 para preencher lacunas no desenvolvimento do React. O React não tinha renderização no lado do servidor, o que dificultava o SEO. Os desenvolvedores tinham que configurar manualmente o Webpack, o Babel e o Express. A renderização no lado do cliente significava carregamentos iniciais lentos.

O Next.js foi desenvolvido com base em seis princípios: configuração zero, JavaScript em todos os lugares, divisão automática de código e renderização no servidor, busca de dados configurável e implantação simples. A visão de Rauch: "A renderização deve ocorrer o mais próximo possível do banco de dados."

A Zeit mudou sua marca para Vercel em abril de 2020. Em novembro de 2021, a Vercel levantou US$ 150 milhões em financiamento da Série D em uma avaliação de US$ 2,5 bilhões, elevando o financiamento total para US$ 313 milhões. Next.js é a base de código aberto para o negócio de hospedagem da Vercel.

Duas Eras

O desenvolvimento do Next.js se divide em dois períodos:

O Pages Router (2016-2022) introduziu o roteamento baseado em arquivos, getStaticProps/getServerSideProps para busca de dados, Incremental Static Regeneration (ISR), rotas de API e otimização de imagens.

App Router (2022-presente) começou com o Next.js 13, trazendo React Server Components, streaming, layouts aninhados e Server Actions. O App Router se tornou estável em maio de 2023 com a versão 13.4.

Principais versões:

• Next.js 12 (outubro de 2021): Compilador SWC baseado em Rust
• Next.js 13 (outubro de 2022): App Router beta, Turbopack anunciado
• Next.js 14 (outubro de 2023): Melhorias em Server Actions
• Next.js 15 (outubro de 2024): Turbopack Dev estável, suporte ao React 19
• Next.js 16 (outubro de 2025): Turbopack padrão, Cache Components

A controvérsia do App Router

O App Router causou atrito. Os críticos citam uma curva de aprendizado acentuada, cache confuso, limites complexos de servidor/cliente e TTFB mais lento em alguns benchmarks. Um usuário do GitHub: "Estou completamente desanimado com o Next v13+ e evito o App Router como se fosse uma praga."

O State of JS 2024 mostra que 44% dos desenvolvedores usariam o Next.js novamente, uma queda em relação aos anos anteriores. O Astro (94%) e o SvelteKit (90%) têm uma pontuação muito mais alta em termos de satisfação. O Next.js é um dos meta-frameworks com a classificação mais baixa, apesar de sua liderança no mercado.

Como eles trabalham juntos

O stack React + TypeScript + Next.js é o padrão da indústria para desenvolvimento web em produção.

React e TypeScript

O TypeScript fornece tipagem estática para props, estado, eventos e hooks do React por meio de @types/react e @types/react-dom. O React 19 recomenda oficialmente o TypeScript. Os PropTypes foram removidos.

Benefícios: captura de erros em tempo de compilação, melhor autocompletar, APIs autodocumentadas, refatoração segura.

Next.js e React

O Next.js adiciona SSR, SSG, ISR, routing baseado em arquivo, API routes, otimização de imagem e suporte a edge runtime. Com o App Router, Server Components são o padrão. Os componentes são renderizados no servidor e enviam somente a saída para os clientes.

Vários membros da equipe principal do React agora trabalham na Vercel. Isso permite uma estreita colaboração, mas levanta preocupações sobre a influência da Vercel na direção do React.

Next.js e TypeScript

O Next.js detecta automaticamente o TypeScript via tsconfig.json, gera next-env.d.ts para tipos de estrutura e oferece suporte à verificação incremental de tipos. O Next.js 15 adicionou suporte ao TypeScript para next.config.ts. O App Router permite type safety de ponta a ponta com Server Actions type-safe.

Sinergias e tensões

O stack combinado oferece type safety do banco de dados até a UI, ferramentas de IDE robustas e suporte do ecossistema. Desafios: Server Components exigem TypeScript 5.1.3+ para tipos de componentes assíncronos. O modelo mental do App Router frustra os desenvolvedores. A complexidade de configuração se acumula entre as ferramentas.

Impacto no setor

Essas tecnologias reformularam a forma como os aplicativos da Web são criados e como os desenvolvedores são contratados.

Mercado de trabalho

React é a principal habilidade de front-end. Os desenvolvedores de React dos EUA recebem em média US$ 110.278 por ano. As ofertas de emprego agora exigem "React mais Next.js, TypeScript ou Tailwind CSS". O React sozinho não é suficiente. As ofertas de emprego do Next.js cresceram à medida que as empresas adotaram a estrutura.

Influência arquitetônica

O modelo de componentes do React agora é universal. Vue, Angular, Svelte, SwiftUI e Jetpack Compose usam padrões semelhantes. TypeScript normalizou a tipagem estática em JavaScript; 67% dos desenvolvedores escrevem mais TypeScript do que JavaScript. O Next.js tornou o SSR acessível e o ISR criou um novo paradigma para atualização de conteúdo estático.

Adoção empresarial

Grandes empresas preferem esse stack pela escalabilidade, facilidade de contratação e suporte de longo prazo. Empresas que o utilizam: Netflix, Airbnb, Walmart, TikTok, Spotify, Microsoft, GitHub. A adoção enterprise de TypeScript cresceu 400% desde 2020, impulsionada por compliance, refatoração mais segura e contratos de API.

Direções futuras

React

Server Components estão se tornando mainstream. React Compiler (experimental) fornecendo memoização automática. A React Foundation garante uma governança vendor-neutral. Desafios: Problemas de segurança dos Server Components e satisfação em declínio (83% em 2022 para 46,7% positivo em 2024).

TypeScript

Compilador TypeScript 7 baseado em Go que oferece 10 vezes mais desempenho. Alinhamento contínuo do padrão JavaScript. A proposta TC39 "Types as Comments" poderia eliminar a transpilação, mas o progresso foi interrompido.

Next.js

O Turbopack está se tornando o empacotador padrão. Amadurecimento da pré-renderização parcial. A API Build Adapters oferece flexibilidade de hospedagem além da Vercel. A estrutura deve abordar o declínio da satisfação e, ao mesmo tempo, promover a inovação.

Padrões emergentes

As arquiteturas server-first continuam crescendo. Dan Abramov propôs aposentar termos como "SPA, MPA, SSR, SSG". Edge computing é padrão. 80% dos desenvolvedores agora usam ferramentas de IA (State of JS 2024).

A fadiga da estrutura é real. Os desenvolvedores exploram alternativas mais simples, como HTMX e Svelte. As preocupações com o lock-in da Vercel afetam a adoção do Next.js. Vue e Nuxt ganham terreno com maior satisfação, apesar de ecossistemas menores.

Conclusão

Esse stack transformou o desenvolvimento web da manipulação de DOM da era jQuery para aplicações type-safe renderizadas no servidor. TypeScript é a linguagem top do GitHub. React alimenta 50 milhões de sites.

No entanto, a satisfação está diminuindo à medida que essas ferramentas buscam mudanças ambiciosas. Server Components, App Router, compiladores nativos: cada um adiciona poder ao custo da simplicidade.

Três coisas a observar: a React Foundation equilibrando inovação com interesses corporativos, as velocidades de build 10x do TypeScript 7, e se o Next.js pode reverter a queda de satisfação enquanto impulsiona Server Components.

O stack continua sendo o padrão da indústria. Mas Svelte e Astro, com taxas de satisfação de 90%+, provam que abordagens mais simples ressoam. A questão não é se esse stack funciona. Funciona. A questão é se a complexidade vale a pena para seu próximo projeto.