Swaroop Jadhav — Full-Stack Developer Portfolio

A cinematic, high-performance personal portfolio built with Next.js 16, Tailwind CSS and Framer Motion — designed to stand out from every template-based portfolio in the market.

• 🎬 Cinematic intro — iris wipe boot animation on every load
• 🌀 Orbit system — 8 tech icons orbit around the hero content
• 🎨 Dual theme — dark sections alternate with cream light sections
• 🖱️ Custom cursor — gradient dot with animated trailing ring
• 📝 Auto blog sync — Hashnode GraphQL API fetches posts automatically
• 🔍 Active nav — navbar highlights current section while scrolling
• 📊 Real projects — actual screenshots, not placeholder mockups
• 📧 Working contact — Nodemailer sends real emails via Gmail

Frontend

Backend & APIs

Deployment

01  Hero        Cinematic hero with particle canvas and orbiting tech icons
02  About       Dark profile card with location, social links and animated stats
03  Projects    Bento grid with real screenshots and category filter system
04  Skills      Tabbed categories with hover proficiency bars
05  Hobbies     Personal interests and passions beyond coding
06  Blog        Live Hashnode integration with sort and tag filter
07  Contact     Working email form with Gmail delivery

node  v18 or higher
npm   v9 or higher

# Clone the repo
git clone https://github.com/Swappy514/swaroop-portfolio.git

# Install dependencies
cd swaroop-portfolio
npm install

# Set up environment variables
cp .env.example .env.local
# Fill in EMAIL_USER and EMAIL_PASS

# Start development server
npm run dev

Open http://localhost:3000

EMAIL_USER=your.gmail@gmail.com
EMAIL_PASS=your_16_char_app_password

To get your Gmail App Password:

1. Google Account → Security → 2-Step Verification → ON
2. Security → App Passwords → type any name → Create
3. Copy the 16-character password

.env.local is in .gitignore — your credentials are never uploaded to GitHub.

1. Click the button above
2. Add EMAIL_USER and EMAIL_PASS in Vercel Environment Variables
3. Deploy — done in 2 minutes

git add .
git commit -m "your update"
git push
# Vercel rebuilds automatically

swaroop-portfolio/
├── app/                    # Next.js App Router pages and API routes
├── components/             # 14 React components
├── content/                # MDX blog post files
├── lib/                    # Hashnode API client and MDX reader
├── public/projects/        # Project screenshots and resume PDF
├── next.config.ts          # Image domains and config
└── tailwind.config.ts      # Design tokens

Swaroop Jadhav — BTech CSE 2025 · Full-Stack Developer · Maharashtra, India

• 🌐 swaroop-portfolio-rouge.vercel.app
• 💼 linkedin.com/in/swaroopjadhav514
• 🐙 github.com/Swappy514
• 📝 swaroopdev.hashnode.dev
• 📧 swaroopjadhav5@gmail.com