Arquitetura web

Como escolher a stack do seu site sem começar pelo Next.js

Next.js resolve problemas específicos de aplicações React. Para páginas, blogs e APIs, outras estruturas podem ser mais simples de manter. Veja como escolher.

Assistir ao vídeo original no YouTube
Thumbnail do vídeo: Você Não Precisa de Next.js: Escolha a Stack Certa para seu Projeto

Você pede à IA uma página simples e recebe dezenas de arquivos, componentes e dependências que nem conhece. O site abre, mas uma alteração pequena muda um pacote e o deploy quebra. Eu já vi esse caminho se repetir, por isso começo a escolha de uma stack perguntando o que o projeto precisa fazer e quem vai cuidar dele depois.

A primeira stack também define o trabalho de manutenção

Next.js costuma aparecer quando alguém pede à IA um site moderno. Ele funciona e pode ser a escolha certa, mas o projeto talvez ganhe React, configuração de build, bibliotecas e estrutura de aplicação antes de existir uma necessidade para isso. Se você está começando com programação assistida por IA, cada dependência nova vira algo que precisa entender quando aparecer um erro ou uma atualização.

Eu chamo esse acúmulo sem propósito de uma criatura para cuidar: você pede uma mudança, a IA altera uma biblioteca, outra deixa de funcionar e o site que abria localmente falha na publicação. Para evitar esse ciclo, escreva primeiro o que a primeira versão precisa fazer. Uma página com formulário pede uma estrutura diferente de um painel com muitas telas e dados mudando o tempo todo.

React organiza interfaces; Next.js acrescenta uma aplicação em volta

HTML estrutura o conteúdo, CSS define a apresentação e JavaScript cuida das interações. No React, a interface pode ser montada com componentes: um botão, um menu e um cartão de produto podem ser peças independentes. Isso ajuda quando há muitas telas e estados que mudam conforme o usuário interage.

O React se concentra na interface. Rotas, carregamento de dados e renderização no servidor pediam outras escolhas, então o Next.js surgiu em 2016 para reunir esses recursos num framework em torno do React. Naquela época, entregar HTML já renderizado podia melhorar a primeira exibição de uma aplicação e ajudar sistemas que leem o conteúdo da página. Hoje esses recursos ainda têm valor, mas uma página institucional ou um blog simples pode funcionar sem montar uma aplicação React completa.

Pense no Next.js quando os recursos dele resolvem uma necessidade concreta — como renderização no servidor, rotas e lógica de aplicação integradas. Se você só precisa publicar conteúdo ou acrescentar um formulário, essa lista pode ser maior do que o projeto pede.

A popularidade transformou o Next.js em resposta automática

A Vercel tornou direto publicar projetos Next.js, e cursos, tutoriais e modelos prontos espalharam essa combinação. As IAs aprenderam com esse material. Quando recebem um pedido vago como “crie um site moderno”, é comum escolherem o exemplo mais conhecido, mesmo sem saber se você precisa daquela arquitetura.

O Next.js também pode ser publicado em servidores Node.js, em contêineres, como exportação estática ou por integrações de outras plataformas. O suporte a cada recurso depende do modo de publicação; a Vercel é um caminho, não o único. Antes de aceitar um repositório gerado, peça à IA que explique para que serve cada dependência e qual requisito do seu site ela atende.

Mais camadas aumentam os lugares onde um erro pode nascer

Num projeto Next.js, a falha pode estar no código, no React, no framework, numa biblioteca, na configuração de build ou na plataforma de publicação. Cada peça pode ser útil. Quando várias entram sem motivo, porém, fica mais difícil descobrir qual delas causou o problema e se a correção sugerida pela IA resolveu a causa ou apenas escondeu o aviso.

Essa preocupação também aparece nas atualizações. Next.js, React e as dependências têm ciclos de versão próprios. Uma versão principal pode trazer mudanças que exigem revisão, mas não obriga todo site a migrar imediatamente nem significa que cada projeto precise ser refeito do zero. A política oficial de suporte distingue versões ativas e em manutenção; o trabalho real é acompanhar essa janela, testar as mudanças e planejar a atualização antes de deixar o projeto parado por anos.

Eu costumo usar Elixir como contraste porque a linguagem permaneceu na série 1.x por bastante tempo. O número maior, sozinho, não mede estabilidade: cada projeto adota seu próprio ritmo de versões. O que importa para você é saber o que a atualização muda e se a sua aplicação usa aquele recurso. WordPress também pode ser mais simples de cuidar para quem já trabalha com ele, embora plugins e temas tragam suas próprias atualizações.

JavaScript nativo já cobre muitos sites pequenos

Os navegadores atuais aceitam módulos JavaScript. Você pode separar o código em arquivos e conectá-los com `import` e `export`; para buscar dados, usar `fetch`; para organizar tarefas assíncronas, usar `async` e `await`. Um formulário, uma busca simples ou algumas interações não precisam automaticamente de React e Next.js.

“Vanilla” é o nome que muita gente usa para JavaScript sem framework. Isso não obriga você a concentrar tudo num arquivo: pode separar produtos, formulários e interface conforme o site cresce. Uma ferramenta como Vite ajuda a organizar o desenvolvimento e gerar a versão de produção, sem escolher por você um framework completo de aplicação.

Autenticação e área administrativa exigem outro cuidado. A segurança depende de validar permissões no servidor e proteger os dados; esconder um botão no navegador não protege uma rota. Em projetos Cloudflare, por exemplo, Cloudflare Access pode restringir o acesso a um painel, junto das verificações feitas pelo próprio backend.

Escolha a ferramenta pelo tipo de site que vai manter

Para uma página institucional, um formulário ou um site enxuto, eu começaria com HTML, CSS e JavaScript. Se o projeto pede componentes e uma interface que muda bastante, Vue ou Svelte são opções que vale comparar. Quando você escolhe Vue e precisa de uma estrutura completa com renderização no servidor, Nuxt entra na conversa.

Em blog, portal ou site centrado em conteúdo, Astro foi feito para esse tipo de projeto. Para uma API ou uma aplicação nos Workers da Cloudflare, eu uso Hono: ele organiza rotas sem levar junto uma estrutura de front-end que a API não precisa. Em vários projetos meus, combino Hono com D1 e, quando o site pede interface de componentes, Vue ou Astro. São ferramentas que resolvem partes diferentes do trabalho.

Minha preferência é Cloudflare em muitos sites, D1 quando SQLite atende o caso e Codex como ferramenta de programação. Essa combinação funciona no meu fluxo; outra equipe pode preferir Vercel, Supabase ou Next.js por razões válidas. Se você ainda está começando, escolha uma estrutura que consiga explicar e atualizar. Next.js continua sendo uma boa opção quando os recursos dele justificam as camadas e a manutenção que vêm junto.

Quando a dúvida é entre os ambientes de publicação, compare Cloudflare Workers e Vercel em produção. Para decidir o tamanho do banco que seu projeto precisa, veja quando uma base menor resolve.