|
1 | | -# React + Vite |
| 1 | +# 🚀 React Portfolio — Hammad Meer |
2 | 2 |
|
3 | | -This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. |
| 3 | +A modern, fast, and fully responsive **developer portfolio** built with **React**, **Vite**, and **Tailwind CSS**, featuring smooth animations and SEO optimization. |
4 | 4 |
|
5 | | -Currently, two official plugins are available: |
| 5 | +🔗 **Live Demo:** https://hammadmeer.netlify.app/ |
| 6 | +📦 **Repository:** https://github.com/hammadmeer-dev/react-portfolio |
6 | 7 |
|
7 | | -- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh |
8 | | -- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh |
| 8 | +--- |
9 | 9 |
|
10 | | -## Expanding the ESLint configuration |
| 10 | +## 📌 Features |
11 | 11 |
|
12 | | -If you are developing a production application, we recommend using TypeScript and enable type-aware lint rules. Check out the [TS template](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-react-ts) to integrate TypeScript and [`typescript-eslint`](https://typescript-eslint.io) in your project. |
| 12 | +- ⚡ Super Fast (Powered by Vite) |
| 13 | +- 🎨 Modern UI with Tailwind CSS |
| 14 | +- ✨ Smooth Animations |
| 15 | +- 📱 Fully Responsive Design |
| 16 | +- 🔍 SEO Optimized |
| 17 | +- 🧩 Clean & Modular Code Structure |
| 18 | +- 📬 Contact Section |
| 19 | +- 🌙 Light/Dark Mode Ready (optional) |
| 20 | + |
| 21 | +--- |
| 22 | + |
| 23 | +## 🛠️ Tech Stack |
| 24 | + |
| 25 | +| Technology | Purpose | |
| 26 | +|-----------|---------| |
| 27 | +| **React JS** | Frontend UI | |
| 28 | +| **Vite** | Build & Dev Server | |
| 29 | +| **Tailwind CSS** | Styling | |
| 30 | +| **Framer Motion / AOS** | Animations | |
| 31 | +| **React Icons** | Icons | |
| 32 | +| **SEO Meta Tags** | Search Optimization | |
| 33 | + |
| 34 | +--- |
| 35 | + |
| 36 | +## 📂 Project Structure |
| 37 | + |
| 38 | +react-portfolio/ |
| 39 | +│── public/ |
| 40 | +│── src/ |
| 41 | +│ ├── components/ |
| 42 | +│ ├── pages/ |
| 43 | +│ ├── assets/ |
| 44 | +│ ├── hooks/ |
| 45 | +│ ├── data/ |
| 46 | +│ ├── App.jsx |
| 47 | +│ └── main.jsx |
| 48 | +│── index.html |
| 49 | +│── package.json |
| 50 | +│── tailwind.config.js |
| 51 | +│── vite.config.js |
| 52 | + |
| 53 | + |
| 54 | + |
| 55 | +--- |
| 56 | + |
| 57 | +## ⚙️ Installation & Setup |
| 58 | + |
| 59 | +### Clone the repository |
| 60 | +```bash |
| 61 | +git clone https://github.com/hammadmeer-dev/react-portfolio.git |
| 62 | +//Navigate into the folder |
| 63 | +cd react-portfolio |
| 64 | +//Install dependencies |
| 65 | +npm install |
| 66 | +//Run development server |
| 67 | +npm run dev |
| 68 | +//Build for production |
| 69 | +npm run build |
| 70 | +//Preview production build |
| 71 | +npm run preview |
0 commit comments