Nuxt e Vue
Trabalho com Vue e Nuxt em produção há anos, quase sempre em bases grandes de e-commerce, onde uma decisão estrutural ruim custa meses. Estes artigos saem desse contexto: o que funcionou, o que quebrou e o que eu faria de novo.
Se você está migrando para o Nuxt 4, comece pelos guias de estrutura de diretórios e type safety. Se a aplicação está crescendo para os lados, os artigos de layers e da camada de abstração com Pinia mostram como isolar features sem brigar com o framework.
Comece por aqui
-
Nuxt 4: Nova Estrutura de Diretórios e Guia de Migração
Descubra a nova estrutura de diretórios do Nuxt 4 com o diretório app/ e aprenda como migrar seus projetos do Nuxt 3 de forma segura e sem quebrar nada.
-
Arquitetura Modular com Nuxt Layers em Projetos Vue
Descubra como o Nuxt Layers organiza projetos Vue.js com arquitetura modular. Crie aplicações front-end escaláveis e manuteníveis com conceitos do backend.
-
Composable Abstraction Layer: o pattern que faltava entre Pinia e seus componentes Vue
Aprenda como o Composable Abstraction Layer elimina o acoplamento entre Pinia e Vue 3, centralizando lógica, side-effects e garantindo testabilidade por camada.
Séries deste guia
Todos os artigos (11)
-
React é uma biblioteca de Views, não uma arquitetura
Seu componente começou inocente, mas hoje faz tudo. Entenda por que React é uma biblioteca de Views, não uma arquitetura, e como separar domínio da UI.
-
Como reorganizamos o checkout de um grande e-commerce sem parar de vender
Como reorganizamos o checkout de um grande e-commerce com Nuxt Layers, padrão CAL e linting automático para escalar — sem parar de vender em produção.
-
Composable Abstraction Layer: o pattern que faltava entre Pinia e seus componentes Vue
Aprenda como o Composable Abstraction Layer elimina o acoplamento entre Pinia e Vue 3, centralizando lógica, side-effects e garantindo testabilidade por camada.
-
Arquitetura Modular com Nuxt Layers em Projetos Vue
Descubra como o Nuxt Layers organiza projetos Vue.js com arquitetura modular. Crie aplicações front-end escaláveis e manuteníveis com conceitos do backend.
-
Nuxt 4: TypeScript e Type Safety - Guia Completo
Explore o TypeScript no Nuxt 4: auto-generated types, type safety nativo e inferência inteligente para desenvolvimento Vue.js mais seguro e produtivo.
-
Nuxt 4: Nova Estrutura de Diretórios e Guia de Migração
Descubra a nova estrutura de diretórios do Nuxt 4 com o diretório app/ e aprenda como migrar seus projetos do Nuxt 3 de forma segura e sem quebrar nada.
-
Armazenamento Persistente no Nuxt com Unstorage
Aprenda a usar o Unstorage no Nuxt para persistir dados server-side com Redis e Cloudflare KV. Guia completo com exemplos práticos de armazenamento no Nuxt 3.
-
Reatividade: SolidJS vs React vs Vue
Compare os sistemas de reatividade de React, Vue e SolidJS: re-renderização, proxies e signals. Entenda as diferenças e o impacto na performance front-end.
-
Componentes para Debug e Renderização com DevOnly e ClientOnly no Nuxt 3
Aprenda a usar DevOnly e ClientOnly no Nuxt 3 para renderização condicional, debug seguro em desenvolvimento e builds de produção mais eficientes e otimizadas.
-
Como Preservar o Estado dos Componentes entre Rotas com KeepAlive no Nuxt 3
Aprenda a usar o KeepAlive no Nuxt 3 para preservar o estado dos componentes entre mudanças de rota e garantir uma experiência mais fluida e performática.
-
Como adicionar a análise de pacotes do webpack em seu projeto nuxt
Aprenda a configurar a análise de pacotes webpack no Nuxt com um mapa de árvore interativo para visualizar e otimizar o tamanho do bundle da sua aplicação.