A modern, AI-focused portfolio website showcasing 7+ years of backend-focused full stack development experience.

Deployed URL: https://enyhbp3zwqvnm.ok.kimi.link

• Modern Design: Dark theme with neon lime accents (#c5fb67)
• Smooth Animations: GSAP-powered scroll animations and transitions
• Responsive: Fully responsive design for all devices
• Interactive Elements: 3D card tilts, hover effects, and particle animations
• SEO Optimized: Proper meta tags and semantic HTML

1. Hero: Introduction with animated name, profile image, and social links
2. About: Personal introduction with animated stat counters
3. Skills: Tech stack with 3D hover effects
4. Experience: Timeline of professional journey
5. Projects: Featured projects (TradeJournal AI, Workflow Engine, Supply Chain Suite)
6. Contact: Contact form with social links

• Framework: React + TypeScript + Vite
• Styling: Tailwind CSS
• Animations: GSAP + ScrollTrigger
• Icons: Lucide React
• UI Components: shadcn/ui

# Install dependencies
npm install

# Start development server
npm run dev

# Build for production
npm run build

1. Install Vercel CLI:

   npm i -g vercel

2. Login to Vercel:

   vercel login

3. Deploy:

   cd /path/to/portfolio
   vercel --prod

1. Push to GitHub:

   git init
   git add .
   git commit -m "Initial commit"
   git branch -M main
   git remote add origin https://github.com/YOUR_USERNAME/portfolio.git
   git push -u origin main

2. Connect to Vercel:

   • Go to vercel.com
   • Click "New Project"
   • Import your GitHub repository
   • Framework Preset: Vite
   • Build Command: npm run build
   • Output Directory: dist
   • Click "Deploy"

1. Build the project:

   npm run build

2. Go to vercel.com

3. Click "New Project" → "Upload" → Select the dist folder

4. Click "Deploy"

No environment variables required for basic deployment.

Edit the following files to update your information:

• src/sections/Hero.tsx - Name, title, description
• src/sections/About.tsx - About text, stats
• src/sections/Experience.tsx - Work experience
• src/sections/Projects.tsx - Projects
• src/sections/Contact.tsx - Contact information

Replace public/profile.jpg with your own image.

Replace images in public/images/ folder.

Edit src/index.css to change the color scheme:

--lime: #c5fb67;  /* Primary accent color */
--void: #050505;  /* Background color */

• Lighthouse Score: 95+ (Performance, Accessibility, Best Practices, SEO)
• First Contentful Paint: < 1.5s
• Time to Interactive: < 3s

• Chrome (latest)
• Firefox (latest)
• Safari (latest)
• Edge (latest)

MIT License - feel free to use this template for your own portfolio!

For any questions or feedback, reach out at:

• Email: garora20044@gmail.com
• LinkedIn: https://www.linkedin.com/in/gaganarora2104/
• GitHub: https://github.com/Gagan921