The Music Player is a Vue.js-based app that offers a simple yet dynamic way to play and switch between audio tracks with a modern UI and smooth user experience. –more– Built using Vue 3 and Vite, this project showcases reactive data handling, component-based architecture, and clean audio control logic. It’s designed to be lightweight, responsive, and user-friendly — ideal for showcasing core Vue skills.

Live Demo: https://mgatus.github.io/musicplayer/

🛠️ Tech Used

• Vue.js 3 (Composition API)
• Vite for fast development and build
• HTML5 <audio> element
• Scoped CSS modules

🎵 Features

• Play, pause, and skip between multiple tracks
• Display of current song title and artist
• Simple playlist management using reactive arrays
• Responsive layout and clean design

💡 How It Works

Each track is defined in a reactive array, and Vue’s reactivity system updates the UI in real-time. The audio element is controlled via refs and event bindings, while each control is wrapped in modular Vue components for maintainability.

---

A smooth and minimalistic Vue.js project that demonstrates how to build a custom music player UI with reactivity and style.