https://github.com/wwwmisla/portfolio
https://github.com/wwwmisla/portfolio
framer-motion react tailwindcss threejs
Last synced: 4 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/wwwmisla/portfolio
- Owner: wwwmisla
- Created: 2025-05-30T21:25:26.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2025-05-30T21:56:39.000Z (4 months ago)
- Last Synced: 2025-05-31T08:17:20.978Z (4 months ago)
- Topics: framer-motion, react, tailwindcss, threejs
- Language: JavaScript
- Homepage: https://portfoliomislawislaine.vercel.app
- Size: 7.71 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🎨 Portfólio ✨
Bem-vindo(a) ao código-fonte do meu portfólio! Um espaço que criei com carinho para apresentar meus projetos, habilidades e um pouco da minha jornada no mundo do desenvolvimento e da tecnologia. Sinta-se à vontade para explorar e interagir! 🚀
🔗 **[Acesse a versão ao vivo AQUI!](https://portfoliomislawislaine.vercel.app)** 🌐
## 🌟 Destaques do Projeto
* **Design Moderno e Responsivo:** Interface elegante construída com TailwindCSS, garantindo uma ótima experiência em desktops, tablets e celulares.
* **Animações Fluidas:** Interações suaves e agradáveis utilizando Framer Motion para dar vida aos componentes.
* **Toque Tridimensional:** Elementos 3D criados com Three.js para uma experiência visual diferenciada e imersiva.
* **Projetos Detalhados:** Uma galeria para apresentar meus principais trabalhos e estudos com descrições e links.
* **Navegação Intuitiva:** Estrutura clara para que você possa encontrar facilmente o que procura.
## 🚀 Tecnologias Utilizadas
Este projeto foi construído com um stack de tecnologias modernas e focadas em performance e experiência do desenvolvedor:
* **Frontend:** React com Vite
* **Estilização:** TailwindCSS
* **Animações:** Framer Motion
* **Elementos 3D:** Three.js
* **Controle de Versão:** Git & GitHub
## 🛠️ Estrutura do Projeto
Para os curiosos de plantão, um vislumbre de como as coisas estão organizadas por baixo dos panos:
Clique para expandir a árvore de diretórios
```bash
📁 portfolio/
├── 📁 public/
│ ├── 📁 assets/
│ │ ├── 📁 logos/ # Ícones de tecnologias (.svg, .png)
│ │ ├── 📁 projects/ # Screenshots/capturas de projetos
│ │ ├── 📁 socials/ # Ícones de redes sociais
│ │ └── (outras imagens complementares) # Imagens complementares soltas aqui
│ ├── 📁 models/ # Modelos 3D
│ └── 🎯 favicon.ico # Ícone do site
│
├── 📁 src/
│ ├── 📁 components/ # Componentes reutilizáveis
│ │ ├── 🧩 OrbitingCircles.jsx # Efeito orbital
│ │ ├── 🧩 Project.jsx # Card de projetos
│ │ └── ... (outros componentes)
│ │
│ ├── 📁 constants/ # Dados estáticos
│ │ ├── 📄 index.js # Lista de projetos, sociais, experiências, etc.
│ │
│ ├── 📁 sections/ # Seções da página
│ │ ├── 🏗️ Hero.jsx # Seção inicial
│ │ ├── 🏗️ Projects.jsx # Seção de projetos
│ │ └── ... (outras seções)
│ │
│ ├── 📄 app.jsx # Componente raiz
│ ├── 📄 main.jsx # Ponto de entrada
│ └── 📄 index.css # Estilos globais
│
├── 📄 .gitignore # Arquivos ignorados pelo Git
├── 📄 .npmrc # Configurações do NPM
├── 📄 index.html # Template HTML principal
├── 📄 package-lock.json # Versões exatas de dependências
├── 📄 package.json # Metadados e scripts do projeto
├── 📄 README.md # Documentação do projeto
├── 📄 tailwind.config.js # Configuração do TailwindCSS
└── 📄 vite.config.js # Configuração do Vite
```