Contato
Plataforma Food Truck & Conceitos Móveis - fabricante francês (alias MCR)

Plataforma Food Truck & Conceitos Móveis - fabricante francês (alias MCR)

Reformulação completa de um site WordPress em uma plataforma moderna Next.js 16 + Payload CMS v3 para um fabricante francês de food trucks - 129K linhas de código, 78 páginas, 1.383 conteúdos SEO, entregue em 41 dias.

Fevereiro - Março 2026
41 dias
Fundador & CTO - Desenvolvedor solo
ACCENSEO
Next.js 16React 19TypeScriptPayload CMS v3PostgreSQL 16Tailwind CSS 4shadcn/uiStripeCloudflare TurnstileTerraformGitHub ActionsDockerDrizzle ORM4 AI APIs

Linhas de código

129.371

TypeScript (modo estrito)

Páginas

78

Next.js App Router

Conteúdos SEO

1.383

Conteúdos indexáveis

Tabelas no banco

133

Incluindo 46 de versionamento

Apresentação

Definição e escopo do projeto

Mon Camion Resto (MCR) é a reformulação completa do site vitrine de uma empresa francesa especializada no design, fabricação e personalização de food trucks, reboques, containers convertidos e conceitos móveis para o setor de alimentação ambulante e eventos. O projeto substitui o antigo site WordPress por uma aplicação web moderna construída com Next.js 16 e Payload CMS v3.

A empresa opera em um mercado de nicho na interseção de vários setores: carroceria/conversão de veículos, alimentação profissional, eventos corporativos e locação de conceitos móveis. Atende clientes prestigiosos como Futuroscope, Sodexo, IKEA, France TV, Elior, Charal e Ralph Lauren, com 3 agências físicas na França (Bordeaux, Paris, Metz).

Uma parte significativa do projeto envolveu o desenvolvimento de numerosas extensões personalizadas para o Payload CMS - particularmente ferramentas dedicadas à geração de conteúdo por IA (artigos, descrições de produtos, criação de imagens) utilizando 4 provedores de IA integrados. Esse trabalho de desenvolvimento personalizado na camada CMS provou ser um dos aspectos mais enriquecedores tecnicamente do projeto.

Domínio

Veículos de alimentação, eventos B2B, conversão de veículos sob medida, locação de conceitos móveis

Usuários-alvo

B2B: agências de eventos, marcas, profissionais de alimentação - B2C: empreendedores iniciando um negócio de alimentação móvel

Escopo funcional
Expertise - Oficinas & Competências
Conceitos - Veículos & Containers
Realizações - Portfolio de projetos
Usados - Marketplace + Stripe
Locação - Frota de eventos B2B
Recursos - Blog, Guias, Glossário, FAQ
Contato & Orçamentos - Formulários multi-etapas
Admin - CMS + ferramentas IA

Objetivos, Contexto, Desafios & Riscos

Visão estratégica e restrições

Objetivos
  • Reformular completamente o site WordPress em uma stack moderna (Next.js + Payload CMS) com gestão autônoma de conteúdo
  • Multiplicar a visibilidade SEO com uma estratégia de conteúdo massiva: 112 artigos, 664 guias, 471 termos de glossário
  • Profissionalizar a imagem da marca com um design system coerente (shadcn/ui, 59 componentes) e visuais de qualidade
  • Automatizar a geração de conteúdo via integração de 4 APIs de IA
  • Estruturar o funil comercial com formulários de orçamento multi-etapas roteados por agência e pagamento Stripe para veículos usados
  • Industrializar o deploy com infraestrutura CI/CD completa (GitHub Actions, Terraform, VPS OVH, 3 ambientes)
Contexto

O site WordPress existente sofria de navegação defeituosa, SEO ruim, visuais desatualizados e formulários de contato genéricos. A empresa estava transicionando de "Mon Camion Resto" para o acrônimo "MCR" enquanto gerenciava 6 domínios (moncamionresto.com/fr, labeglaise.fr, location-foodtruck.fr, food-trucks.fr, mountain-egg.com). Uma migração dos 42 artigos WordPress existentes também era necessária.

Desafios

Visibilidade SEO

O site é o principal canal de aquisição - a reformulação deve manter ou melhorar as posições existentes enquanto cria massivamente novo conteúdo

Conversão de leads

Os formulários de orçamento e contato são a espinha dorsal comercial - cada lead deve ser corretamente roteado para a agência certa (Bordeaux, Paris, Metz)

Imagem da marca

A empresa trabalha com clientes como IKEA, France TV e Ralph Lauren - o site deve refletir esse nível de qualidade

Riscos identificados

Risco SEO

Perda potencial de posicionamento durante a migração - mitigado pela implementação de redirecionamentos e preservação das URLs legadas via Nginx.

Qualidade do conteúdo IA

Volume massivo de conteúdo gerado por IA (664 guias, 471 termos) necessitando verificação humana - um sistema de status foi implementado (not-verified, ai-verified, human-verified).

Restrições de infraestrutura

Hospedagem em um único VPS OVH com 3 ambientes, limitado a 8 GB de RAM para toda a stack.

Complexidade multi-API

Integração de 4 APIs de IA diferentes com modelos de cobrança e limites de taxa variáveis.

As Etapas - O que eu fiz

Fases cronológicas e contribuições pessoais

Cronograma do projeto
Phase 1
Fundações
10-12 fev.
  • Arbitrei a stack para um monolito Next.js 16 + Payload CMS v3: zero latência CMS-front, superfície de ataque reduzida, um único modelo tipado
  • Modelei o domínio CMS em 15 coleções + 24 content blocks, isolando entidades estruturantes dos blocos composicionais
  • No lado do banco, defini um schema PostgreSQL tipado via Drizzle ORM, com restrições SEO antecipadas (canônicas, versionamento, verificação)
  • Travei a base de dev: TypeScript estrito + noUncheckedIndexedAccess, Docker Compose para paridade dev/prod, CLI de seed determinística
Phase 2
Conteúdo & SEO
14-27 fev.
  • Industrializei um design system de 24 content blocks em Server Components: LCP abaixo do alvo Core Web Vitals, composição livre para o marketing
  • No SEO, entreguei cobertura semântica (artigos, guias, glossário, FAQ) com URLs canônicas, linkagem interna auto-gerada e ISR calibrada para 1.383 conteúdos
  • Construí uma camada de abstração IA multi-provedores (4 APIs): fallback, circuit breaker, controle de cotas
  • Modelei um workflow de verificação editorial (not-verified → ai-verified → human-verified) para rastrear a governança
  • No back-office, estendi o Payload CMS: custom fields Lexical, plugins IA (geração, reescrita, tradução) via Server Actions, permissões granulares
Phase 3
Infraestrutura & Migração
2-9 mar.
  • Codifiquei a gestão DNS dos 6 domínios em Terraform (provider OVH): módulos reutilizáveis, state remoto criptografado, cutover sem downtime, rollback pronto
  • Na migração WordPress, escrevi um importer idempotente: 42 artigos normalizados, redirecionamentos 301 e mapeamento de permalinks para preservar a autoridade SEO
  • Projetei uma arquitetura informacional em 4 níveis orientada à exploração B2B: breadcrumbs server-rendered, schema.org, 24 páginas de locação/eventos templatizadas
  • Nos 3 ambientes (teste, staging, produção), scriptei a promoção com health checks, confirmações interativas e logging auditável
Phase 4
CI/CD & Produção
12-22 mar.
  • Montei um pipeline GitHub Actions em 5 jobs (lint, typecheck, build, testes, deploy) com cache remoto e auto-deploy controlado: lead time abaixo de 8 min
  • Na observabilidade, instrumentei GA4 + GTM com um schema de eventos alinhado aos KPIs de negócio (views de produto, orçamentos, funis do marketplace)
  • Para o marketplace de usados, integrei o Stripe Checkout: webhooks assinados, pagamentos idempotentes, reconciliação server-side, blast radius isolado
  • Blindei os formulários de contato e orçamento com Turnstile server-side, rate limiting por IP e honeypots, sem fricção de CAPTCHA
  • Na produção visual, construí um pipeline IA de imagens de produto: validação manual, fallback estático, pós-processamento WebP/AVIF nas dimensões canônicas

Os Atores - As Interações

Como colaborei com as partes interessadas e orquestrei a IA

Equipe de desenvolvimento

Nuance importante: embora a IA tenha gerado ~75% do volume de código (mega-commits >10K inserções = 79% do total), conduzi ~70% da produção intelectual do projeto - assumi todas as decisões de arquitetura, as escolhas de stack técnica, a modelagem de dados (15 coleções, 133 tabelas), o design de infraestrutura, a estratégia SEO, o relacionamento com o cliente, o prompt engineering e a validação final.

Distribuição do volume de código (linhas produzidas)
Valor intelectual e decisório
Partes interessadas externas com quem interagi
  • Pierre-Olivier P.Meu interlocutor principal - proprietário e admin do CMS, com quem eu enquadrava os requisitos e validava cada entrega
  • GeoffroyDialogava com ele no lado comercial para a agência de Bordeaux
  • StripeIntegrei o checkout deles para os pagamentos do marketplace
  • CloudflareApoiei-me no Turnstile para o anti-spam
  • Provedores de IAOrquestrei-os em modo multi-provedor para a geração de conteúdo e imagens
  • OVHOperava o VPS, SMTP e a resolução DNS deles no dia a dia

Os Resultados

Impacto para mim e para a empresa

Para a empresa - Impacto nos negócios

1.383

Conteúdos SEO

Páginas indexáveis criadas (vs 42 no WordPress)

78

Páginas

Site completo com 7 layouts e navegação 4 níveis

15

Coleções CMS

Gestão autônoma de conteúdo via admin Payload CMS

3

Ambientes

Teste (auto-deploy), Staging, Produção

Métricas do código
Distribuição do conteúdo SEO (1.383 conteúdos)
WordPress vs Next.js+Payload CMS
Composição do design system (203 componentes)
Velocidade de desenvolvimento (commits por semana)
Para mim - Competências adquiridas e reforçadas graças a este projeto

Competências técnicas que adquiri graças a este projeto

  • Next.js 16 + Payload CMS v3: entreguei uma aplicação full-stack em escala de produção (129K linhas)
  • Extensões Payload CMS sob medida: desenvolvi ferramentas dedicadas à geração de conteúdo por IA
  • Modelagem PostgreSQL: projetei um schema de 133 tabelas pilotado via Drizzle ORM
  • Integração IA multi-provedores: conectei e orquestrei 4 APIs de fornecedores diferentes
  • Terraform IaC: codifiquei a gestão DNS de 6 domínios
  • CI/CD: construí o pipeline GitHub Actions com 5 jobs cobrindo 3 ambientes
  • Arquitetura SEO: estruturei 1.383 conteúdos indexáveis com renderização ISR

Competências funcionais & humanas reforçadas graças a este projeto

  • Traduzi as gravações de voz do cliente em especificações executáveis
  • No lado do conteúdo, defini a estratégia SEO e a linkagem interna
  • Conduzi o desenvolvimento assistido por IA e refinei o prompt engineering
  • Enfim, assumi a gestão de projeto solo, da análise à entrega final. Este projeto mudou minha forma de trabalhar: agora combino IA e decisões humanas desde o primeiro dia, sustentando velocidades x3-x4 mantendo a ownership completa da arquitetura.

Os Desdobramentos do Projeto

O que aconteceu após a entrega e estado atual

Futuro imediato: A plataforma foi implantada em um ambiente de produção (production.moncamionresto.com) com dois ambientes adicionais (teste, staging). O ambiente de teste é auto-implantado a cada push no main. O admin CMS está acessível e operacional para a equipe.

A médio prazo: O site está no ar sob um subdomínio temporário enquanto a migração DNS final do antigo site WordPress está pendente. O conteúdo gerado por IA está em revisão humana progressiva, apoiado pelo status de verificação já implementado no CMS. As coleções de negócios críticas (realizações, veículos usados, frota de locação) estão estruturadas e prontas para serem populadas com dados reais.

Estado atual: A plataforma representa um aumento de 33x no conteúdo indexável em comparação ao site WordPress original. A infraestrutura está pronta para produção com SSL, backups automatizados, CI/CD e monitoramento. A plataforma de automação n8n está implantada para orquestrar os workflows.

Minha perspectiva crítica

Como julgo este projeto com o recuo

Pontos fortes
  • Velocidade de desenvolvimento excepcional

    Com o recuo, continuo impressionado com a velocidade - 3.000 linhas/dia em média por 6 semanas, uma produtividade x3 a x4 que sustentei graças ao dev assistido por IA.

  • Stack técnica moderna e coerente

    Defendo a escolha arquitetural: assumi um monolito full-stack com CMS embutido no Next.js e tipagem TypeScript de ponta a ponta.

  • Estratégia SEO ambiciosa e bem executada

    Levei a estratégia longe: uma malha interna densa entre guias, artigos e glossário para saturar a cobertura semântica do tema food truck.

  • Infraestrutura profissional

    No lado da infraestrutura, entreguei um pipeline industrial: IaC, scripts robustos, confirmações de segurança antes da produção.

  • Design system completo

    Com meus 24 tipos de blocos, dei à equipe de marketing uma real liberdade de composição sem nunca quebrar a consistência visual.

Pontos de melhoria
  • Cobertura de testes insuficiente

    Produzi apenas 8 arquivos de testes para 129K linhas. Rotas API críticas (contato, orçamentos, Stripe) merecem melhor - identifico isso claramente como meu ponto fraco.

  • Sem versionamento semântico

    Não criei nenhuma tag git nem release - com o recuo, lamento essa lacuna que impede rastrear as versões implantadas em produção.

O que eu faria diferente

Com os padrões e o recuo de hoje, eis as escolhas que eu faria diferente:

  • Estratégia de conteúdo em lotes: em vez de gerar 664 guias de uma vez, validaria por lotes para garantir a qualidade
  • Feature flags: lançaria progressivamente em produção em vez de tudo ou nada
Os ensinamentos duradouros que este projeto me trouxe

IA como multiplicador de força

Levo como aprendizado que a IA absorve o volume, mas o humano - eu neste caso - deve manter o controle da arquitetura e das decisões estruturantes.

CMS headless integrado > CMS desacoplado

Vivenciei que nesta escala, o CMS dentro da app vence o desacoplado: menos latência, um único deploy, um único modelo tipado.

Infrastructure as Code desde o dia 1

Levo como aprendizado que DNS, deploy e ambientes devem ser codificados desde o primeiro dia - o esforço se paga já na primeira alteração a enviar.

Conteúdo SEO é um ativo estratégico

Mensurei que cada novo conteúdo indexável amplia de forma duradoura a superfície de aquisição orgânica - é um ativo que continua trabalhando ao longo do tempo.

Architecture

Trajetória relacionada

Experiência profissional ligada a está realização

Competências aplicadas

Competências técnicas e humanas aplicadas

Galeria de imagens

Capturas e visuais do projeto

Página inicial Mon Camion Resto com food truck vintage, serviços de customização sob medida e menu de navegação
Página inicial - Serviços de customização food truck
Página de customização food truck mostrando adaptação sob medida, conformidade com normas e opções de estilo
Customização - Food truck sob medida
Marketplace de food trucks usados com grade de veículos recondicionados à venda de vários modelos e estilos
Anúncios - Food trucks usados e recondicionados
Blog Mon Camion Resto com artigos sobre locais para food truck, formação e tendências do setor
Blog - Artigos e estudos de caso do setor
Página de contato com formulário, escritórios em Paris, Bordeaux e Metz e números de telefone
Contato - Escritórios multi-cidade (Paris, Bordeaux, Metz)
Página de glossário food truck com definições alfabéticas dos termos da alimentação ambulante
Glossário - Léxico food truck de A a Z
Footer com chamada para ação para lançar conceito móvel, pedido de orçamento e cartões de contato multi-cidade
Footer - CTA e contato multi-cidade

Precisa de uma plataforma React sob medida ?

Projeto plataformas Next.js + React com um CMS totalmente sob medida e ferramentas de geração de conteúdo por IA (artigos, descrições de produtos, imagens) integradas diretamente ao seu back-office. Vamos conversar sobre seu projeto.

Entrar em contato