Personal Portfolio Website - Aravind P

This repository contains the source code for my personal portfolio website. It is a fully responsive single-page application designed to showcase my skills, projects, and professional background as a Computer Science student.

➡️ Live Demo: aravindp602.github.io/portfolio/

---

✨ Key Features

This portfolio is more than just a static page; it's a demonstration of modern front-end development techniques.

• Interactive Custom Cursor: A smooth, interactive cursor that provides a premium browsing experience.
• Draggable Project Carousel: An intuitive, app-like carousel to browse projects with both button navigation and drag-to-scroll functionality.
• Light/Dark Theme: A theme toggle that respects user preference and saves the choice in local storage.
• Dynamic Animations:
  • Hero section features a "typing" effect using Typed.js.
  • Elements gracefully fade and slide in on scroll, powered by the IntersectionObserver API.
  • Project cards feature a 3D tilt effect on hover using Vanilla-Tilt.js.
• AJAX Contact Form: A contact form that submits data asynchronously to Formspree, providing instant feedback without a page reload.
• Professional Polish: Includes a preloader, "Back to Top" button, "Email Copied" micro-interaction, and full accessibility for keyboard navigation.
• Fully Responsive: A mobile-first design that adapts seamlessly to all screen sizes, from mobile phones to desktops.

---

🛠️ Technology Stack

This project was built from the ground up using core web technologies, demonstrating a strong command of the fundamentals without relying on heavy frameworks.

• Structure: Semantic HTML5
• Styling:
  • Advanced CSS3 with Flexbox and Grid
  • CSS Variables for easy theming and maintenance
• Interactivity:
  • Vanilla JavaScript (ES6+)
  • Libraries: Typed.js for typing animations and Vanilla-Tilt.js for 3D effects.
• Deployment: GitHub Pages
• Form Handling: Formspree

---

💡 Key Learnings & Challenges

• Performance-Driven Animations: Implementing animations with IntersectionObserver and requestAnimationFrame to ensure they are smooth and don't degrade performance.
• Complex State Management with Vanilla JS: Building features like the theme toggle and active nav link highlighting required careful management of state without a larger framework.
• Creating a Seamless User Experience: Integrating multiple interactive elements (custom cursor, preloader, animations) to work together harmoniously without feeling cluttered was a key focus.

---

✉️ Get In Touch

• LinkedIn: linkedin.com/in/aravind-p-5b1110256
• Email: aravindpadmanabhan71@gmail.com