🎵 Advanced Spotify Wrapped Dashboard

Advanced Spotify Wrapped Dashboard is a fully interactive and responsive dashboard built with Node.js and the Spotify API.
It provides a personalized analytics experience of your Spotify account, visualizing your listening habits, top tracks, artists, and current activity in real-time.

---

🌟 Features

• 🎶 Displays Top 5 Songs with album art and play preview
• 👨‍🎤 Shows Top 5 Artists with profile images and follower counts
• 🔊 Real-time Currently Playing Song with progress bar
• 🕒 Lists Recently Played Tracks with timestamps
• 📊 Interactive charts and graphs showing listening trends
• 🌍 Fully responsive design for desktop, tablet, and mobile
• ⚡ Fast, dynamic updates using Spotify API and WebSocket-like refresh
• 🛠️ Optional: Dark mode toggle for better UX

---

🛠️ Tech Stack

• Backend: Node.js, Express.js
• API: Spotify Web API (OAuth 2.0)
• Frontend: HTML, CSS, JavaScript, Chart.js/D3.js for visualizations
• Responsive Design: CSS Grid & Flexbox, mobile-first approach
• Optional Enhancements: Dark mode, animations with GSAP or CSS

---

📦 Installation & Setup

1. Clone the repository

   git clone https://github.com/samarthags/Spotify-Api.git
   cd Spotify-Api
   

2. Install dependencies

npm install

3. Configure Spotify API Credentials

Create a Spotify Developer App here

Get your Client ID, Client Secret, and set a Redirect URI

Add them to a .env file:

SPOTIFY_CLIENT_ID=your_client_id SPOTIFY_CLIENT_SECRET=your_client_secret REDIRECT_URI=http://localhost:3000/callback

4. Start the server

npm start

By default, the server runs at 👉 http://localhost:3000.

5. Open in browser

http://localhost:3000

Log in with your Spotify account to authorize the app

Experience live updates and detailed analytics

---

🌍 Deployment

Deploy this project on any Node.js hosting platform:

Heroku

Render

Railway

Vercel (with Node.js backend)

---

🤝 Contributing

Enhance this dashboard with new analytics, charts, or visual features:

1. Fork the repository

2. Create a new branch (git checkout -b feature-new)

3. Commit your changes (git commit -m "Added new feature")

4. Push to your branch (git push origin feature-new)

5. Open a Pull Request

---

👨‍💻 Author

Developed with ❤️‍🔥 by Samarthags

---

https://samarthags.in