🎤 Miku Contact List 🎶

A vibrant, Hatsune Miku-themed contact directory created for a WebDev1 project. This application combines fundamental web development practices with a fun, Vocaloid-inspired aesthetic, featuring fully functional contact management logic! 💙

Experience the Live Site Here!

✨ Project Features

This isn't just a static page; it includes fully custom Vanilla JavaScript functionality:

• CRUD Operations: Users can Create, Read, Update, and Delete contacts seamlessly.
• Live Search: A dynamic search bar that filters contacts in real-time.
• Custom CSS Animations: Features a scrolling VT323-style ticker, a heartbeat footer, and floating elements.
• Toast Notifications: Custom-built pop-up alerts for user actions (adding, editing, deleting).
• The "Miku Ad" Overlay: A custom, fully styled "fake advertisement" pop-up complete with a countdown timer and a redirect feature.

🎧 Technologies Used

• HTML5 - Semantic structure and layout
• CSS3 - Advanced styling, grid/flexbox layouts, and keyframe animations
• Vanilla JavaScript - DOM manipulation, array filtering, and interactive state management

💻 Local Setup

If you want to view or edit the code locally on your machine:

1. Clone the repository via terminal:

   git clone [https://github.com/ZRayce/Miku_Contact_List_Page-WebDev1-Project.git](https://github.com/ZRayce/Miku_Contact_List_Page-WebDev1-Project.git)