Portfólio pessoal bilíngue (PT/EN) desenvolvido com Next.js 16. Apresenta projetos, experiência profissional, habilidades técnicas e um chat com IA integrado.
| Camada | Tecnologia |
|---|---|
| Framework | Next.js 16 (App Router) |
| UI | React 19, Tailwind CSS v4, Framer Motion, Lucide Icons |
| Idiomas | Context API (i18n customizada) |
| Tema | Dark/Light com Context API + localStorage |
| Banco | PostgreSQL + Prisma 7 (ORM) |
| IA | Google Gemini (chat primário) + Anthropic Claude (fallback) |
| Testes | Jest 30 + React Testing Library |
| Deploy | Vercel (recomendado) |
- 🌐 Bilíngue — Português e Inglês com alternância por contexto
- 🌙 Modo escuro — Dark/Light com persistência e fallback para preferência do sistema
- 🤖 Chat com IA — Gemini + Claude com fallback automático
- 📝 Formulário de contato — Envio com PostgreSQL via Prisma
- 📄 Páginas de projeto — Rotas dinâmicas
/projects/[slug]com geração estática - 🔍 SEO — OpenGraph, JSON-LD (Person Schema), sitemap.xml, robots.txt
- ♿ Acessibilidade — Skip link, focus-visible, prefers-reduced-motion
- ✅ Testes — 43 testes unitários, 41% de cobertura
- Node.js 20+
- PostgreSQL 16 (local ou Docker)
- Chaves de API (Gemini e/ou Claude) — opcional para chat
cp .env.example .env.local
# edite .env.local com suas chaves de API (opcional)
docker compose up -d
docker compose exec app npx prisma db pushAcesse http://localhost:3000
# 1. Configure o banco PostgreSQL e crie o .env
cp .env.example .env.local
# edite DATABASE_URL no .env.local
# 2. Instale dependências
npm install
# 3. Gere o cliente Prisma e crie as tabelas
npx prisma generate
npx prisma db push
# 4. Inicie o servidor
npm run devAcesse http://localhost:3000
| Comando | Descrição |
|---|---|
npm run dev |
Servidor de desenvolvimento |
npm run build |
Build de produção |
npm start |
Servidor de produção |
npm run lint |
ESLint |
npm test |
Testes unitários |
npm run test:watch |
Testes em modo watch |
npm run test:coverage |
Relatório de cobertura |
npx prisma studio |
Interface do banco de dados |
src/
├── app/
│ ├── api/chat/ # Chat com IA (Gemini + Claude)
│ ├── api/contact/ # Formulário de contato
│ ├── projects/[slug]/ # Páginas dinâmicas de projeto
│ ├── robots.txt/ # Robots dinâmico
│ ├── sitemap.xml/ # Sitemap dinâmico
│ ├── globals.css # Estilos globais + dark mode
│ ├── layout.js # Layout raiz (SEO, providers)
│ └── page.js # Página inicial
├── components/
│ ├── sections/ # Seções da página (Hero, About, etc.)
│ └── ui/ # Componentes reutilizáveis
├── context/ # ThemeContext + LanguageContext
├── data/ # Conteúdo bilíngue (PT/EN)
├── lib/ # Utilitários (projetos, prisma)
└── generated/prisma/ # Cliente Prisma (gerado)
tests/ # Testes unitários (Jest + RTL)
prisma/ # Schema do banco de dados
npm test # 43 testes, 11 suites
npm run test:watch # Modo watch
npm run test:coverage # Relatório completoVariáveis de ambiente necessárias:
DATABASE_URL— URL de conexão PostgreSQL (ex: Neon, Supabase)GEMINI_API_KEY— Chave da API Gemini (opcional)ANTHROPIC_API_KEY— Chave da API Claude (opcional)
MIT © Giovani Feitosa
Bilingual (PT/EN) personal portfolio built with Next.js 16. Showcases projects, professional experience, technical skills, and an integrated AI chatbot.
| Layer | Technology |
|---|---|
| Framework | Next.js 16 (App Router) |
| UI | React 19, Tailwind CSS v4, Framer Motion, Lucide Icons |
| i18n | Custom Context API |
| Theming | Dark/Light with Context API + localStorage |
| Database | PostgreSQL + Prisma 7 (ORM) |
| AI | Google Gemini (primary) + Anthropic Claude (fallback) |
| Testing | Jest 30 + React Testing Library |
| Deploy | Vercel (recommended) |
- 🌐 Bilingual — Portuguese/English toggle via React Context
- 🌙 Dark mode — Persistent dark/light with system preference fallback
- 🤖 AI Chat — Gemini + Claude with automatic fallback
- 📝 Contact form — PostgreSQL persistence via Prisma
- 📄 Project pages — Dynamic routes
/projects/[slug]with static generation - 🔍 SEO — OpenGraph, JSON-LD (Person Schema), sitemap.xml, robots.txt
- ♿ Accessibility — Skip link, focus-visible outlines, prefers-reduced-motion
- ✅ Testing — 43 unit tests, 41% coverage
- Node.js 20+
- PostgreSQL 16 (local or Docker)
- API keys (Gemini and/or Claude) — optional for chat
cp .env.example .env.local
# edit .env.local with your API keys (optional)
docker compose up -d
docker compose exec app npx prisma db push# 1. Set up PostgreSQL and create .env
cp .env.example .env.local
# edit DATABASE_URL in .env.local
# 2. Install dependencies
npm install
# 3. Generate Prisma client and create tables
npx prisma generate
npx prisma db push
# 4. Start dev server
npm run dev| Command | Description |
|---|---|
npm run dev |
Development server |
npm run build |
Production build |
npm start |
Production server |
npm run lint |
ESLint |
npm test |
Unit tests |
npm run test:watch |
Watch mode |
npm run test:coverage |
Coverage report |
npx prisma studio |
Database GUI |
src/
├── app/
│ ├── api/chat/ # AI chat (Gemini + Claude)
│ ├── api/contact/ # Contact form handler
│ ├── projects/[slug]/ # Dynamic project pages
│ ├── robots.txt/ # Dynamic robots.txt
│ ├── sitemap.xml/ # Dynamic sitemap
│ ├── globals.css # Global styles + dark mode
│ ├── layout.js # Root layout (SEO, providers)
│ └── page.js # Home page
├── components/
│ ├── sections/ # Page sections (Hero, About, etc.)
│ └── ui/ # Reusable components
├── context/ # ThemeContext + LanguageContext
├── data/ # Bilingual content (PT/EN)
├── lib/ # Utilities (projects, prisma)
└── generated/prisma/ # Prisma client (generated)
tests/ # Unit tests (Jest + RTL)
prisma/ # Database schema
npm test # 43 tests, 11 suites
npm run test:watch # Watch mode
npm run test:coverage # Full coverage reportRequired environment variables:
DATABASE_URL— PostgreSQL connection string (e.g., Neon, Supabase)GEMINI_API_KEY— Gemini API key (optional)ANTHROPIC_API_KEY— Claude API key (optional)
MIT © Giovani Feitosa