Desenvolvimento com Next.js para produtos e sites de marketing

O que nosso desenvolvimento com Next.js inclui#

Um projeto Next.js com a Dardo cobre a construção e as decisões que definem a velocidade e o custo de operação mais adiante. A proposta lista quais destes itens estão incluídos e como cada um é aprovado.

• Um inventário de rotas que marca cada uma como estática, em cache ou renderizada a cada requisição
• Uma aplicação com App Router em TypeScript, com Server Components por padrão e código de navegador só onde a interface precisar
• Regras de cache, incluindo o que é atualizado quando seu time publica conteúdo
• Verificações de permissão no código de servidor que lê os dados, com testes que tentam contorná-las
• Hospedagem na Vercel, no Cloudflare Workers ou em um servidor Node.js, com deploys de prévia e uma estimativa do custo mensal
• Orçamentos de JavaScript, monitoramento de erros e eventos de analytics conferidos antes do lançamento

Quando o Next.js é a escolha certa, e quando o Astro é melhor?#

Escolha o Next.js quando boa parte do que você está construindo se comporta como uma aplicação: as pessoas fazem login, veem seus próprios dados, alteram registros ou recebem páginas montadas para elas a cada requisição.

Escolha o Astro quando a maioria das páginas é igual para todos os visitantes, como em sites de marketing e publicações; o site da Dardo roda em Astro, e nossa página de desenvolvimento com Astro explica quando ele vence. Se o fluxo do produto ainda não está definido, comece delimitando-o com o desenvolvimento de aplicativos web, que cobre contas, papéis e pagamentos. E se o marketing precisa publicar sem desenvolvedores, a escolha do CMS headless importa tanto quanto a do framework.

Estática, em cache ou renderizada sob demanda: como cada rota deve funcionar?#

Cada rota deve fazer o mínimo de trabalho que ainda mostre o conteúdo certo. Uma página igual para todos é gerada uma vez, uma que muda de vez em quando fica em cache e é atualizada quando o conteúdo é publicado, e só uma página que depende de quem a pede é renderizada a cada requisição. No App Router, as páginas são Server Components por padrão, então o HTML vem do servidor e menos JavaScript chega ao navegador.

Em outubro de 2026, a versão atual é o Next.js 16.4, publicado em 6 de outubro. Ele recomenda o Cache Components, o modelo de cache construído em torno da diretiva use cache, para todos os apps, o ativa em projetos novos e diz que ele será o padrão no Next.js 17. Assim, uma página pode misturar um layout em cache com partes renderizadas por visitante, como o menu da conta em uma página de preços estática. A versão 16.4 também traz uma configuração que faz o build falhar quando conteúdo de requisição escapa para uma rota feita para ser estática, para que um componente perdido não acrescente custo de servidor às páginas de marketing sem ninguém perceber.

Onde hospedar um app Next.js, e quanto custa operá-lo?#

Qualquer hospedagem que rode Node.js consegue rodar todos os recursos do Next.js, então a hospedagem é uma escolha sobre custo, operação e dependência do fornecedor. Em outubro de 2026, a documentação do Next.js lista a Vercel e o Bun como adaptadores verificados; a Cloudflare e a Netlify estão construindo os seus e, enquanto isso, oferecem integrações próprias. Uma exportação estática roda em qualquer lugar, mas perde todo recurso que precise de servidor.

Já rodamos Next.js nas duas opções gerenciadas. O A medio tono começou na Vercel e passou para o Cloudflare Workers em 30 de setembro de 2026, com Next.js 16 via OpenNext e um Worker na frente que serve as páginas pré-renderizadas e guarda em cache as imagens otimizadas.

Os custos de operação mudam conforme as decisões de renderização. Além do crédito incluído, a Vercel lista as invocações de função a USD 0,60 por milhão e as transformações de imagem a USD 0,05 por mil, então uma página que poderia ser estática mas é renderizada por visitante custa dinheiro a cada visita. Antes do lançamento, estimamos a conta mensal a partir do tráfego esperado e configuramos alertas de gasto na sua conta.

Um único código para o produto e suas páginas de marketing#

Um único código em Next.js pode atender as páginas públicas de um SaaS e seu produto com login, mantendo consistentes os componentes, o estado de login e o analytics. O custo é o acoplamento: corrigir um erro de digitação na página de preços sai na mesma versão que o código do produto, então mantemos as rotas de marketing estáticas e o conteúdo delas em um CMS.

No Hyper, um único front end em Next.js 16 sustenta a história do produto com scroll e o fluxo de pesquisa paga que vem depois; um webhook confirma cada pagamento e a pesquisa roda em um serviço Python separado. Se seus clientes vão usar o produto em domínios próprios, planeje isso cedo com nosso guia de domínios personalizados para SaaS.

Separar às vezes é melhor: um site de marketing em Astro ou Webflow no www e o app em um subdomínio próprio, quando o marketing publica todo dia e o time de produto lança no seu próprio ritmo. Projetar esse site de marketing é o nosso serviço de site para SaaS.

Segurança e atualizações vêm com o framework#

Um app Next.js executa o seu código em um servidor, então a versão do framework é uma dependência de segurança que precisa de um responsável depois do lançamento. Em 3 de dezembro de 2025, o Next.js publicou o aviso CVE-2025-66478, com nota CVSS 10.0: uma falha no protocolo do React Server Components podia permitir a execução remota de código em apps com App Router rodando Next.js 15 ou 16. Não havia solução alternativa: era preciso atualizar, e o Next.js recomendou trocar os segredos.

Pela política de suporte do Next.js, a 16.x está em LTS ativo e a 15.x em LTS de manutenção, que traz apenas correções críticas e de segurança, por dois anos após o lançamento inicial de uma versão principal. O Next.js 15 foi lançado em 21 de outubro de 2024, então essa janela se encerra em outubro de 2026; a 14.x e as anteriores não têm suporte.

Verificamos as permissões no código de servidor que lê cada registro, e não só na camada de rotas, e tratamos cada Server Action como um endpoint público. Cada entrega diz quem aplica as versões de segurança; num plano de manutenção de sites, somos nós.

Assumir ou atualizar um app Next.js existente#

Assumimos apps Next.js depois de uma auditoria de versões, roteadores, hospedagem e faturas recentes, cache, verificações de permissão, tamanhos de JavaScript e testes, que termina em uma lista priorizada de correções e um orçamento.

Sair do Pages Router não precisa ser uma reescrita: o Next.js projetou o diretório app para conviver com o diretório pages e permitir uma migração página a página, e os codemods cuidam de parte de cada atualização. Se um site público muda de plataforma no caminho, redirecionamentos e busca vêm primeiro, como no nosso processo de migração de site.

As atualizações recebem os mesmos testes que os recursos novos. No Janus Observatory, um laço de prefetch especulativo no stack de Next.js e OpenNext fez 11.704 requisições em um único registro de navegador com falha; nós o removemos, e agora os testes exigem zero requisições especulativas.

Quanto custa o desenvolvimento com Next.js?#

O preço acompanha o que as rotas fazem, não quantas páginas existem: vinte páginas de marketing com três modelos podem custar menos do que cinco telas com login, papéis e dados ao vivo. A hospedagem é cobrada a você pelo provedor, fora dos nossos honorários. As faixas de orçamento do formulário de contato vão de menos de USD 5.000 a mais de USD 60.000; a página de preços as lista. Isto é o que mais move a estimativa:

• Rotas renderizadas por visitante ou por conta, em comparação com páginas estáticas
• Login, papéis e os testes de permissão que os acompanham
• Integrações: pagamentos, CRM, busca, um CMS ou suas próprias APIs
• Idiomas, cada um com suas URLs e sua revisão
• Um código existente a auditar, atualizar ou migrar antes

Dúvidas antes de escolher#

Do blog#

• Sanity vs Contentful vs Payload: o melhor CMS headless para sua equipe em 2026

  Sanity, Contentful, Payload, Strapi e Storyblok comparados em hospedagem, pré-visualização, traduções, exportação e custo mensal real para equipes de 5 e 12.

• Astro vs Next.js: qual escolher para um site de marketing ou um produto em 2026

  Astro para sites iguais para todos os visitantes, Next.js para produtos com login: renderização, JavaScript, hospedagem e suporte comparados.