Portfolio Website - Vishnu Vardhan Reddy

Modern, premium portfolio website built with React, Vite, and Tailwind CSS v4.

🚀 Quick Start

# Install dependencies
npm install

# Start development server
npm run dev

# Build for production
npm run build

# Preview production build
npm run preview

The app will run at http://localhost:5173

🛠️ Tech Stack

• React 18 - UI library
• Vite 7 - Lightning-fast build tool
• Tailwind CSS v4 - Modern utility-first CSS
• JavaScript (ES6+) - Programming language

✨ Features

• ✅ Fully responsive design (mobile, tablet, desktop)
• ✅ Dark theme with glassmorphism effects
• ✅ Smooth scroll navigation
• ✅ Interactive animations & transitions
• ✅ Form validation
• ✅ SEO optimized
• ✅ Fast performance with Vite

🎨 Sections

1. Hero - Introduction with availability status and CTAs
2. Tech Stack - Skills categorized by Frontend, Backend, Databases, Tools
3. Journey Timeline - Growth milestones from 2021 to present
4. Projects - Featured work (Contact Manager, CGPA Analyzer, Cricket Tracker)
5. Resume - Education & certifications
6. Skills - Technical proficiency with progress bars
7. Contact - Contact form & social links

📁 Project Structure

portfolio/
├── src/
│   ├── App.jsx          # Main application component
│   ├── main.jsx         # Application entry point
│   └── index.css        # Global styles & Tailwind
├── public/              # Static assets
├── index.html           # HTML template
├── tailwind.config.js   # Tailwind configuration
├── postcss.config.js    # PostCSS configuration
├── vite.config.js       # Vite configuration
└── package.json         # Dependencies & scripts

🎯 Customization

Update Personal Information

Edit src/App.jsx and search for:

• "Vishnu Vardhan" - Replace with your name
• Email, phone, social links
• Project descriptions
• Skills and technologies

Change Primary Color

Edit tailwind.config.js:

colors: {
  primary: '#0f6df0', // Change to your brand color
}

📦 Deployment

Build for Production

npm run build

This creates an optimized build in the dist/ folder.

Deploy to Netlify

1. Run npm run build
2. Drag dist folder to netlify.com/drop
3. Or connect your Git repository for automatic deployments

Deploy to Vercel

npm run build
# Deploy via Vercel CLI or dashboard

Deploy to GitHub Pages

npm run build
# Push dist folder to gh-pages branch

🌐 Browser Support

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

📧 Contact

• Email: vishnu.k@spcjr.edu.in
• LinkedIn: kasireddy-vishnu-vardhan-reddy
• GitHub: kasireddyvishnuvardhanreddy

📝 License

This project is open source and available for personal use.

---

Built with ❤️ using React, Vite & Tailwind CSS v4