🚀 Portfolio Pessoal - Davyd Willian

Portfolio moderno e responsivo construído com as tecnologias mais recentes

🌐 Ver Demo • 📧 Contato • 💼 LinkedIn

📸 Screenshots

Desktop

Mobile

---

✨ Features

• 🎨 Design Moderno - Interface limpa e profissional
• 🌓 Dark/Light Mode - Tema escuro e claro com persistência
• 📱 Totalmente Responsivo - Funciona perfeitamente em todos os dispositivos
• ⚡ Performance Otimizada - Build rápido e carregamento instantâneo
• 🎭 Animações Suaves - Transições elegantes com Framer Motion
• 📧 Formulário de Contato - Integração com EmailJS para envio de mensagens
• 🎯 Single Page App - Navegação suave entre seções
• ♿ Acessível - Seguindo as melhores práticas de acessibilidade

🛠️ Tecnologias

Frontend

• React 19.1 - Biblioteca JavaScript para construção de interfaces
• TypeScript 5.9 - Superset JavaScript com tipagem estática
• Tailwind CSS 4.1 - Framework CSS utility-first moderno
• Vite 7.1 - Build tool extremamente rápida

Bibliotecas

• Framer Motion - Animações fluidas e interativas
• Lucide React - Ícones SVG modernos e customizáveis
• EmailJS - Envio de emails sem backend

Dev Tools

• ESLint - Linting e análise de código
• TypeScript ESLint - Regras específicas para TypeScript

📁 Estrutura do Projeto

portfolio/
├── src/
│   ├── components/        # Componentes reutilizáveis
│   │   ├── Header.tsx    # Cabeçalho com navegação
│   │   ├── Hero.tsx      # Seção principal
│   │   ├── About.tsx     # Sobre mim
│   │   ├── Projects.tsx  # Portfolio de projetos
│   │   └── Contact.tsx   # Formulário de contato
│   ├── types/            # Definições TypeScript
│   │   └── index.ts      # Interfaces e tipos
│   ├── App.tsx           # Componente principal
│   ├── main.tsx          # Entry point
│   └── index.css         # Estilos globais + Tailwind
├── public/               # Arquivos estáticos
├── index.html           # HTML base
├── package.json         # Dependências
├── tsconfig.json        # Configuração TypeScript
├── vite.config.ts       # Configuração Vite
└── tailwind.config.js   # Configuração Tailwind (opcional)

🚀 Como Executar

Pré-requisitos

• Node.js 18+
• npm ou yarn

Instalação

# Clone o repositório
git clone https://github.com/JezzXL/seu-repositorio.git

# Entre no diretório
cd seu-repositorio

# Instale as dependências
npm install

# Execute em modo desenvolvimento
npm run dev

O projeto estará disponível em http://localhost:5173

Build para Produção

# Gera build otimizado
npm run build

# Preview do build
npm run preview

🎨 Personalização

Cores e Tema

As cores podem ser personalizadas no arquivo src/index.css:

@theme {
  --color-primary: #3b82f6;
  --color-secondary: #8b5cf6;
}

Conteúdo

Edite os seguintes arquivos para personalizar o conteúdo:

• Hero.tsx - Nome, título e descrição principal
• About.tsx - Informações sobre você e habilidades
• Projects.tsx - Seus projetos e portfolio
• Contact.tsx - Links de contato e redes sociais

Configuração EmailJS

1. Crie uma conta em EmailJS.com
2. Configure um Email Service
3. Crie um Email Template
4. Adicione suas credenciais em Contact.tsx:

await emailjs.send(
  'YOUR_SERVICE_ID',
  'YOUR_TEMPLATE_ID',
  formData,
  'YOUR_PUBLIC_KEY'
);

📊 Scripts Disponíveis

npm run dev       # Inicia servidor de desenvolvimento
npm run build     # Cria build de produção
npm run preview   # Preview do build
npm run lint      # Executa ESLint

🌐 Deploy

Vercel (Recomendado)

Netlify

GitHub Pages

npm run build
# Configure GitHub Pages para servir da pasta dist/

📝 Seções do Portfolio

🏠 Home (Hero)

Apresentação principal com nome, título e CTAs para projetos e contato.

👨‍💻 Sobre

Informações profissionais, educação, experiência e habilidades técnicas organizadas por nível.

💼 Projetos

Showcase de projetos desenvolvidos com tecnologias, descrições e links para repositório/demo.

📧 Contato

Formulário de contato integrado com EmailJS e links para redes sociais.

🤝 Contribuindo

Contribuições são bem-vindas! Sinta-se à vontade para:

1. Fork o projeto
2. Crie uma branch para sua feature (git checkout -b feature/AmazingFeature)
3. Commit suas mudanças (git commit -m 'Add some AmazingFeature')
4. Push para a branch (git push origin feature/AmazingFeature)
5. Abra um Pull Request

📄 Licença

Este projeto está sob a licença MIT. Veja o arquivo LICENSE para mais detalhes.

👤 Autor

Davyd Willian

• GitHub: @JezzXL
• LinkedIn: Davyd Willian
• Email: davydsantos.gt@gmail.com
• Localização: São Luís, Maranhão - Brasil 🇧🇷

🙏 Agradecimentos

• React - Biblioteca base
• Tailwind CSS - Framework CSS
• Framer Motion - Animações
• Lucide Icons - Ícones
• EmailJS - Serviço de email
• Unsplash - Imagens de alta qualidade

📈 Status do Projeto

✅ Completo e em produção

---

⭐ Se este projeto te ajudou, considere dar uma estrela!

Feito com ❤️ e ☕ por Davyd Willian