Visão geral
Este portfólio foi construído como produto de apresentação profissional: cada seção comunica competências técnicas de forma objetiva para recrutadores e tech leads, com cases detalhados, SEO otimizado, dark mode e pipeline de qualidade automatizado.
- Portfólio como produto
- Componentização reutilizável
- Dark Mode e responsividade
- Open Graph e Twitter Cards
- Build estático otimizado
Problema resolvido
Recrutadores e tech leads avaliam candidatos em poucos minutos. Era necessário um portfólio que comunicasse projetos reais, decisões técnicas e boas práticas de engenharia de forma clara e performática.
Regras de negócio
- Conteúdo orientado a decisões técnicas, não apenas lista de tecnologias.
- Cada projeto deve ter case study acessível por URL própria.
- SEO e metadata dinâmica em todas as páginas de projeto.
- Formulário de contato com validação client-side.
- Layout responsivo e acessível em mobile e desktop.
Arquitetura
Next.js App Router com componentes desacoplados
Dados em src/data, UI em components/ui e sections, páginas estáticas geradas via generateStaticParams. Server Components por padrão, client apenas onde necessário.
- Visitante
- Next.js App Router
- Server Components
- Dados em projects.ts
- Metadata dinâmica
- Deploy Vercel + CI
Desafios técnicos
- Performance
- Acessibilidade
- SEO técnico
- Manutenibilidade
Decisões técnicas
App Router + SSG
Páginas de projeto geradas estaticamente para performance e SEO, com rotas dinâmicas por slug.
Separação dados/UI
Case studies em arquivo tipado facilitam manutenção e evolução sem acoplar conteúdo aos componentes.
Pipeline de qualidade
Husky, lint-staged, commitlint e GitHub Actions garantem padrão corporativo desde o desenvolvimento.
Qualidade de Software
Ferramentas, testes automatizados, CI/CD e padrões de engenharia aplicados neste portfólio.