Portfólio pessoal desenvolvido com React, TypeScript e Vite, apresentando projetos, habilidades e experiência profissional como desenvolvedor full-stack. O projeto utiliza Tailwind CSS para estilização e Radix UI para componentes acessíveis.

• React 18.3 - Biblioteca JavaScript para interfaces
• TypeScript 5.8 - JavaScript com tipagem estática
• Vite 7.3 - Build tool ultrarrápido
• React Router DOM 6.30 - Roteamento SPA

• Tailwind CSS 3.4 - Framework CSS utility-first
• Radix UI - Componentes primitivos acessíveis
  • Accordion, Dialog, Dropdown, Tooltip, Select, e mais
• Framer Motion 12.29 - Animações fluidas
• Lucide React - Ícones SVG modernos
• next-themes - Sistema de temas claro/escuro
• Tailwind Merge & CVA - Utilitários para classes CSS

• React Hook Form 7.61 - Gerenciamento de formulários
• Zod 3.25 - Validação de schemas
• TanStack Query 5.90 - Gerenciamento de estado servidor
• date-fns 3.6 - Manipulação de datas
• Recharts 2.15 - Gráficos e visualizações
• Embla Carousel - Carroséis responsivos
• Sonner - Toast notifications elegantes

• Vitest 3.2 - Framework de testes unitários
• Testing Library - Testes de componentes React
• ESLint 9.32 - Linter JavaScript/TypeScript
• TypeScript ESLint - Regras de lint para TypeScript

Portifolio/
├── public/              # Arquivos estáticos públicos
├── src/
│   ├── assets/         # Imagens, ícones e recursos
│   ├── components/     # Componentes React reutilizáveis
│   │   └── ui/         # Componentes Radix UI customizados
│   ├── hooks/          # Custom hooks
│   ├── lib/            # Utilitários e helpers
│   ├── pages/          # Páginas da aplicação
│   ├── App.tsx         # Componente raiz com rotas
│   ├── main.tsx        # Ponto de entrada
│   ├── index.css       # Estilos globais e Tailwind
│   └── App.css         # Estilos do componente App
├── components.json     # Configuração shadcn/ui
├── tailwind.config.ts  # Configuração Tailwind CSS
├── vite.config.ts      # Configuração Vite
├── vitest.config.ts    # Configuração Vitest
├── tsconfig.json       # Configuração TypeScript
└── package.json        # Dependências e scripts

• Node.js 18+
• npm, yarn ou pnpm

# Clone o repositório
git clone https://github.com/EricksonDutra/Portifolio.git

# Entre no diretório
cd Portifolio

# Instale as dependências
npm install

# Inicia servidor de desenvolvimento
npm run dev

# Build para produção
npm run build

# Build para desenvolvimento
npm run build:dev

# Pré-visualiza build de produção
npm run preview

# Executa linter
npm run lint

# Executa testes
npm run test

# Executa testes em modo watch
npm run test:watch

• ✅ Design Responsivo - Totalmente adaptável (mobile-first)
• ✅ Modo Claro/Escuro - Alternância de temas com next-themes
• ✅ Animações - Transições suaves com Framer Motion
• ✅ Roteamento SPA - Navegação fluida com React Router
• ✅ Componentes Acessíveis - Baseados em Radix UI
• ✅ Formulários Validados - React Hook Form + Zod
• ✅ Testes Unitários - Cobertura com Vitest
• ✅ TypeScript - Tipagem forte em todo código
• ✅ Performance - Build otimizado com Vite
• ✅ Gerenciamento de Estado - TanStack Query para dados remotos

• Apresentação pessoal
• Links para redes sociais e contato

• Showcase de projetos desenvolvidos
• Links para repositórios GitHub
• Demos e deploys ao vivo

• Biografia profissional
• Stack de tecnologias
• Experiência e formação

• Formulário de contato validado
• Links para e-mail e redes sociais

• Accordion, Alert Dialog, Avatar
• Dialog, Dropdown Menu, Popover
• Tabs, Toast, Tooltip
• Select, Slider, Switch
• Navigation Menu, Scroll Area

• Hooks personalizados para lógica reutilizável
• Integração com TanStack Query

• Vercel - Deploy automático com GitHub
• Netlify - Deploy contínuo
• GitHub Pages - Hospedagem gratuita
• VPS com Nginx - Controle total

# Gera build otimizado na pasta dist/
npm run build

# Testa o build localmente
npm run preview

O projeto utiliza Vitest para testes unitários:

# Executa todos os testes
npm run test

# Modo watch (desenvolvimento)
npm run test:watch

Este projeto é de código aberto e está disponível para uso pessoal e educacional.

Erickson Dutra

• GitHub: @EricksonDutra
• Email: [email protected]
• Localização: Ponta Porã, MS, Brasil

Desenvolvedor Full-Stack com experiência em React, Django e tecnologias modernas de web. Instrutor técnico no SENAC MS, especializado em manutenção de software e testes. Apaixonado por criar soluções tecnológicas para o agronegócio e educar novos desenvolvedores.

Stack Principal:

• Frontend: React, Next.js, TypeScript, Tailwind CSS
• Backend: Django, Django REST Framework, Python
• DevOps: Nginx, Docker, VPS, Vercel
• Banco de Dados: PostgreSQL, MySQL, SQLite

Contribuições, issues e feature requests são bem-vindos!

Sinta-se à vontade para abrir uma issue ou enviar um pull request.

⭐ Se este projeto te inspirou ou ajudou de alguma forma, considere dar uma estrela no repositório!

• Documentação React
• Documentação Vite
• Documentação Tailwind CSS
• Documentação Radix UI
• Documentação TanStack Query