Modern Developer Portfolio

A professional, responsive, and interactive portfolio website built with modern web technologies. Features a clean design, dark mode support, and dynamic content loading.

🚀 Features

• Modern UI/UX: Glassmorphism effects, smooth animations, and a clean layout.
• Dark Mode: Fully supported dark theme with a toggle switch and persistence.
• Dynamic Projects: Project cards are loaded dynamically from a JSON file for easy updates.
• Interactive Elements: Animated code editor hero section, 3D hover effects on cards.
• Responsive Design: Fully optimized for all device sizes (Mobile, Tablet, Desktop).
• Security: Basic protections against content copying and dev tools access.

🛠️ Technologies Used

• HTML5: Semantic structure.
• Tailwind CSS: Utility-first styling for rapid development.
• JavaScript (ES6+): Dynamic logic, theme switching, and animations.
• Font Awesome: Scalable vector icons.
• Google Fonts: Modern typography (Inter & Fira Code).

📂 Project Structure

modern-portfolio/
├── index.html          # Main entry point
├── projects.json       # Data file for project cards
├── README.md           # Project documentation
└── favicon.ico         # Site icon

🏃‍♂️ How to Run Locally

1. Clone or Download the repository.

2. Open the folder in your terminal.

3. Start a local server (required for fetching projects.json):

   Using Python 3:

   python3 -m http.server 8000

   Using Node.js (http-server):

   npx http-server

4. Open your browser and navigate to: http://localhost:8000

⚙️ Customization

Updating Projects

To add or edit projects, simply modify the projects.json file. No HTML changes needed!

{
  "id": 4,
  "title": "New Project",
  "description": "Description of your awesome project.",
  "tags": ["React", "TypeScript"],
  ...
}

Changing Theme Colors

You can adjust the color palette by modifying the CSS variables in the <style> section of index.html.

🛡️ Protections

The site includes scripts to deter content copying and inspection:

• Right-click disabled
• Text selection disabled (except in forms)
• DevTools shortcuts blocked

---

Designed & Built with ❤️ by Utkarsh