Sites, sistemas e SaaS para vender, operar e crescer.
Portfólio bilíngue e orientado a conversão de Jean Carlos Vargas / JE4NDEV. Apresenta produtos reais, estudos de caso, provas visuais revisadas e o processo de entrega founder-led.
O projeto foi construído para responder quatro perguntas de um potencial cliente:
- O que a JE4NDEV entrega?
- Quais produtos já foram construídos?
- Qual é a evidência disponível para cada case?
- Como iniciar uma conversa com escopo e expectativas claras?
O catálogo atual reúne 12 projetos, com 6 produtos públicos e 7 provas visuais revisadas. Cada projeto declara seu nível de prova para diferenciar produto público, demonstração privada, case editorial e ferramenta interna.
| Produto | Entrega | Evidência principal |
|---|---|---|
| ArchScene | Plataforma de renders arquitetônicos com IA | Produto público + case visual |
| NexPanel | SaaS multi-tenant para operações de revenda | Produto público + dashboard revisado |
| Vultrix 3D | Custos, precificação, estoque e financeiro | Produto público + dashboard revisado |
| Stop Ultimate | Jogo multiplayer com juiz de IA | Jogo público + interface atual |
| Alchemix Auditor | Checklist público de auditoria Web3 | Interface pública; não substitui auditoria independente |
| Ethena Scanner | Demonstração de scanner de segurança | Fluxo público; não comprova segurança independente |
Cases com operação ou prova parcialmente privada — como Gestão ML, Hermes Agentes e OpenClaw Gateway — são apresentados com esse limite explícito no site.
|
Universo de projetos 
|
Mobile — 390 px 
|
- Rotas localizadas e indexáveis em
/pte/en. - 24 páginas estáticas de projetos, além das duas homes localizadas.
- Catálogo pesquisável por produto, tecnologia e categoria.
- Estudos de caso com problema, entrega, resultado, stack e prova visual.
- CTAs contextuais para produto público, código, demonstração ou contato.
- Analytics first-party para page view, conversão, profundidade de leitura e engajamento.
- SEO técnico com canonical,
hreflang, Open Graph, Twitter cards, JSON-LD, sitemap e robots. - Animações com fallback para
prefers-reduced-motion, Save-Data e conexões lentas. - Headers básicos de segurança e endpoint de captura desativado em produção.
| Camada | Tecnologias |
|---|---|
| Frontend | Next.js 16, React 19, TypeScript, Tailwind CSS |
| Motion | Framer Motion, GSAP, Lenis |
| Conteúdo | Dados tipados em TypeScript + validação com Zod |
| Imagens | next/image, WebP e assets versionados por projeto |
| SEO | Metadata API, JSON-LD, sitemap, robots e páginas SSG |
| Qualidade | ESLint, TypeScript strict, auditor de projetos e GitHub Actions |
| Deploy | Build standalone, preparado para VPS ou plataforma compatível com Next.js |
src/
├── app/
│ ├── [locale]/
│ │ ├── page.tsx
│ │ └── projects/[slug]/page.tsx
│ ├── api/
│ │ ├── analytics/route.ts
│ │ ├── health/route.ts
│ │ └── save-screenshot/route.ts
│ ├── robots.ts
│ └── sitemap.ts
├── components/
│ ├── analytics/
│ ├── layout/
│ ├── projects/
│ ├── sections/
│ └── ui/
├── data/
│ ├── project-schema.ts
│ └── projects.ts
├── i18n/
├── types/
└── proxy.ts
public/projects/
├── captures/
├── covers/
└── gallery/
O catálogo é a fonte de verdade. Cada entrada possui status, nível de prova, CTAs, métricas verificáveis, tecnologias e revisão de assets. O script audit:projects impede prioridades duplicadas, arquivos ausentes e provas inconsistentes.
Requisitos recomendados:
- Node.js 22
- npm 10+
git clone https://github.com/JE4NVRG/jeanvargas.dev.git
cd jeanvargas.dev
npm ci
npm run devAcesse http://localhost:3000/pt.
| Comando | Objetivo |
|---|---|
npm run dev |
Servidor local com Turbopack |
npm run lint |
Validação ESLint |
npm run typecheck |
Tipos de rotas + TypeScript |
npm run audit:projects |
Integridade do catálogo e dos assets |
npm run audit:links |
Verificação dos links públicos dos projetos |
npm run test:analytics |
Testes de atribuição, schema, privacidade e relatório semanal |
npm run validate:campaign-links |
Validação das URLs UTM do pacote comercial |
npm run funnel:lead -- <comando> |
Ledger server-only dos estágios comerciais |
npm run report:weekly -- --days 7 |
Relatório de analytics, leads e Search Console opcional |
npm run build |
Build otimizado de produção |
npm run validate |
Gate completo: lint, tipos, testes, catálogo, campanhas e build |
O workflow .github/workflows/portfolio-quality.yml executa em pull requests:
npm ci
npm run validate
npm audit --omit=dev --audit-level=highControles adicionais:
- payloads de analytics validados com Zod e limitados a 4 KB;
- upload de screenshots limitado a imagens JPEG/PNG de até 8 MB e desativado em produção;
- filenames e subdiretórios validados antes de qualquer escrita local;
- headers
nosniff,DENY, política de referência e bloqueio de câmera/microfone/localização; - nenhuma chave, cookie ou arquivo
.envdeve ser versionado.
O portfólio utiliza um endpoint first-party sem cookies para registrar page views, engajamento e CTAs. O endpoint sempre mantém fallback em logs estruturados e pode persistir no Supabase quando as variáveis server-only estiverem configuradas. O schema rejeita campos não declarados e não armazena IP, user-agent, URL completa de referrer, texto de formulário/WhatsApp nem identificador estável de visitante.
As migrations de analytics e do ledger comercial ficam em supabase/migrations/. Elas não são aplicadas automaticamente pelo build. O relatório semanal combina os eventos, os estágios reais dos leads e um CSV agregado opcional do Search Console; veja o runbook antes de configurar produção ou agendamento.
- Design e critérios visuais
- Auditoria geral — performance, SEO, segurança e GitHub
- Auditoria de captação de clientes
- Pacote de distribuição e prospecção
- Loop semanal de medição
- Especificação do sistema de apresentação
- Plano de captura de assets
- Backlog de entrada de novos projetos
- Portfólio: je4ndev.com
- E-mail: jean@je4ndev.com
- GitHub: @JE4NVRG
- LinkedIn: linkedin.com/in/je4ndev
- WhatsApp: iniciar conversa
Distribuído sob a licença MIT.
Construído e mantido por Jean Carlos Vargas — JE4NDEV.