SHIVAM CHAUHAN — Portfolio

A responsive, high-performance developer portfolio application featuring an interactive split-screen navigation layout, full-stack project showcases, an interactive Mini Projects Vault, architectural Case Studies modal, dynamic theme switching, and smooth animations powered by GSAP.

---

Overview

This project is a modern, modular web portfolio designed for full-stack developers. It combines clean UI design with interactive features, such as split-panel layout modes, filterable project archives, competitive coding profile highlights, and a interactive case studies dossier.

---

Key Features

• Interactive Split-Panel Navigation: Dual-pane interface enabling seamless desktop and mobile navigation across sections.
• Featured Projects Showcase: Standard project cards featuring deep-dive technical overviews and live/repo links.
• Mini Projects Vault & Interactive Demos: A filterable sandbox grid showcasing utility tools, ASCII art generators, and web applications.
• Coding Profile Integrations: Highlights metrics across LeetCode, GitHub, GeeksforGeeks, CodeChef, and Codeforces.
• Dark & Light Mode: High-contrast, theme-aware CSS custom properties for comfortable viewing in any environment.

---

Tech Stack

• Frontend: HTML5, CSS3 (Custom Variables & Modern Flex/Grid), JavaScript (ES6+)
• Animations: GSAP (ScrollTrigger & ScrollToPlugin), AOS (Animate on Scroll)
• Backend / Server: Node.js, Express.js
• Tooling: npm, Vite / Static Server setup

---

Usage Guide

• Navigating Sections: Click any sidebar item or tab to switch between About, Projects, Experience, Skills, and Contact views.
• Opening Vault Demos: Click on the Mini Projects Vault cards to open interactive modal previews.
• Theme Toggle: Use the theme toggle button in the header bar to switch between Dark and Light modes.

---

Project Structure

├── index.html         # Main HTML layout and component markup
├── styles.css         # CSS styles, design tokens, and media queries
├── script.js          # Main JavaScript logic, modal engine, and GSAP animations
├── server.js          # Express static server configuration
├── package.json       # Project dependencies and script declarations
├── metadata.json      # Applet metadata configuration
├── .env.example       # Example environment variables
└── README.md          # Project documentation

---

Contribution / reference / inspired own project Guidelines

Contributions, issues, and feature requests are welcome!

1. Fork the repository.
2. Create a feature branch:

   git checkout -b feature/AmazingFeature

3. Commit your changes:

   git commit -m "Add some AmazingFeature"

4. Push to the branch:

   git push origin feature/AmazingFeature

5. Open a Pull Request.

done ----