🚀 A stylish, responsive, and motion-enhanced personal website built with React, TailwindCSS, and Framer Motion.
"Not just a website. A visual reflection of who I am."
This is my personal portfolio site – a dynamic, modern web app to showcase my skills, experience, and creative projects. From motion-enhanced UI components to animated skill tooltips, it’s designed to speak for me before I speak for myself.
🌟 Features:
- 🧩 Modular, reusable React components
- 💫 Framer Motion animations on scroll & interaction
- 📱 Fully responsive for all devices
- 🔥 Soft skills & technical skills tooltips
- 📰 Dynamic news slider (optional feature for blog updates)
- 🎨 Clean dark-light toggle-ready design
- ✨ Powered by personality & code
📁 src/
├── 📁 components/
│ ├── navbar.jsx
│ ├── Footer.jsx
│ ├── Skills.jsx
│ ├── Projects.jsx
│ ├── About.jsx
│ ├── Hero.jsx
│ └── Contact.jsx
│
├── 📁 assets/
├── App.jsx
├──index.css
└── main.jsx
| Technology | Purpose |
|---|---|
| React | Component-based UI |
| Form & yup | Control and register form data |
| EmailJS | Contact me by API |
| TailwindCSS | Utility-first styling |
| Framer Motion | Smooth animations |
| React Icons | Stylish icons |
| Custom Tooltip | Skill-level hover details |
git clone https://github.com/MahdiJDS/personal-portfolio.git
cd personal-portfolio
npm install
npm run dev- Then open your browser and navigate to http://localhost:5173
If you found something inspiring or want to collaborate:
Thanks to all open-source projects and creators who inspire me to build, learn, and share freely with the world