A modern, fully responsive personal portfolio built with React 18 + Vite 5 and Tailwind CSS, featuring smooth animations, a real-time GitHub integration, smart search, and complete SEO optimization. Designed to showcase my skills, projects, and experience as a Full Stack Developer.
| Feature | Description |
|---|---|
| 🎨 Dark Theme | Sleek dark UI with subtle 3D background and gradient accents |
| 📱 Fully Responsive | Optimized for mobile, tablet and desktop |
| ⚡ Vite Powered | Lightning-fast HMR development and optimized production builds |
| 🔍 Smart Search | Real-time search across all portfolio sections |
| 🎭 Framer Motion | Smooth scroll animations and page transitions |
| 🐙 GitHub Live Data | Real-time repo count fetched from GitHub API via SWR |
| 🤖 SEO Optimized | Per-page meta tags, OG image, JSON-LD structured data, sitemap |
| 📲 PWA Ready | Installable on mobile with full manifest and favicon set |
| Category | Technologies |
|---|---|
| Frontend | React 18, Vite 5, Tailwind CSS 3, Framer Motion 11 |
| Routing | React Router DOM 6 |
| Data Fetching | SWR (GitHub API) |
| Icons | Lucide React |
| Backend/DB | Node.js, Express.js, MongoDB, MySQL |
| Auth | JWT |
| Cloud | AWS, Render, Vercel |
| Tools | Git, GitHub, Postman, VS Code |
├── public/
│ ├── favicon.ico
│ ├── favicon-16x16.png
│ ├── favicon-32x32.png
│ ├── favicon-192.png
│ ├── favicon-512.png
│ ├── apple-touch-icon.png
│ ├── og-image.png
│ ├── manifest.json
│ ├── robots.txt
│ └── sitemap.xml
└── src/
├── assets/
├── components/
│ ├── Background3D.jsx
│ ├── Footer.jsx
│ ├── Loading.jsx
│ ├── Navbar.jsx
│ ├── ScrollAnimation.jsx
│ ├── SearchDialog.jsx
│ └── TechLogos.jsx
├── pages/
│ ├── Home.jsx
│ ├── About.jsx
│ ├── Projects.jsx
│ ├── Skills.jsx
│ ├── Experience.jsx
│ ├── Education.jsx
│ ├── Certificates.jsx
│ ├── Contact.jsx
│ └── NotFound.jsx
├── config/
│ └── contact.js
├── App.jsx
├── main.jsx
└── index.css
# Clone the repository
git clone https://github.com/niladri-1/niladri-1/Personal-portfolio
# Navigate to project
cd Personal-portfolio
# Install dependencies
npm install
# Start development server
npm run dev
# Build for production
npm run build
# Preview production build
npm run preview| Section | Description |
|---|---|
| 🏠 Home | Introduction, live GitHub stats, social links |
| 👨💻 About | Background, achievements, areas of interest |
| 📂 Projects | Full stack projects with tech stack details |
| 💼 Experience | Internships and professional work history |
| 🎓 Education | B.Tech Computer Science — 8.48 CGPA |
| 🛠️ Skills | Categorized technical skills with icons |
| 🏆 Certificates | Professional certifications |
| 📞 Contact | Email, WhatsApp, LinkedIn, GitHub |
This portfolio is fully SEO-optimized:
- ✅ Per-page dynamic
<title>and<meta description>viaSEOUpdatercomponent - ✅ Open Graph + Twitter Card tags for rich link previews
- ✅ JSON-LD structured data (
Personschema) - ✅ XML sitemap with all pages
- ✅
robots.txtcorrectly configured - ✅ PWA manifest with correct icons
- ✅ Google Search Console verified
- ✅ Custom
og-image.png(1200×630) for social sharing - ✅ Full favicon set (16, 32, 192, 512, ICO, Apple Touch)
This project is licensed under the MIT License — see the LICENSE file for details.
