A cutting-edge, production-ready personal portfolio website built with modern web technologies. This project showcases my journey, skills, projects, and academic achievements in a highly interactive and visually stunning format.
- 🎨 Design System — Built on Shadcn/UI with customized Tailwind CSS variables for smooth theme transitions.
- ⚡ Frontend Engine — Powered by Vite for lightning-fast HMR and optimized production builds.
- 📩 Email Server — A decoupled Vercel Serverless Function using Nodemailer to handle secure, rate-limited email delivery.
- 🔄 State & Validation — Uses React Hook Form for efficient user inputs and Zod for schema-based validation.
- ♿ Standardized UI — Implements Radix UI primitives to ensure full keyboard accessibility and screen reader support.
- 🎯 Dynamic Hero Section — Interactive animations and a professional summary with typing effects.
- 👤 Interactive About Me — Deep dive into my background with accordion-style panels.
- 💼 Project Showcase — Beautifully animated gallery with live demos and repository links.
- 🏆 Achievement Hub — 230+ certificates and awards with smart filtering and light-box previews.
- 🛠️ Skills Matrix — Over 40 technical skills categorized for easy navigation.
- 📚 Research & Materials — Academic publications and study resources repository.
- 📧 Enhanced Contact Form — Functional contact form with name extraction and styled email notifications.
- 🌙 Dark/Light Themes — Seamless theme switching with system preference detection.
- 🎨 Particle Backgrounds — Dynamic particle animations powered by tsparticles.
- 📊 Interactive Charts — Data visualization components using Recharts.
- 🎭 3D Elements — Three.js integration for immersive experiences.
- 📱 Mobile-First Design — Fully responsive and optimized for all screen sizes.
- ♿ Accessibility — WCAG compliant with keyboard navigation and screen reader support.
| 📋 Category | 🔧 Technologies |
|---|---|
| Frontend | React 18, TypeScript, Vite, React Router |
| Styling | Tailwind CSS, Shadcn/UI, Radix UI, Framer Motion |
| State Management | TanStack Query, React Hook Form, Zod |
| Icons & UI | Lucide React, React Icons, Radix UI Components |
| Backend | Nodemailer, Vercel Serverless Functions |
| Animations | Framer Motion, Three.js, TSParticles |
| Charts & Data | Recharts, React Intersection Observer |
| Build Tool | Vite, ESLint, TypeScript |
| Deployment | Vercel, GitHub Pages |
For detailed information on how to clone, set up, and customize this portfolio, please refer to our dedicated guide:
- 🌐 Live Demo: Babin.Portfolio
- 👔 LinkedIn: Babin Bid
This project is licensed under the MIT License - see the LICENSE file for details.
Made with ❤️ by Babin Bid