Spotify web player using latest technologies, including React, Node, Express, and Spotify playback SDK
Spotty is a web player for Spotify built using the latest technologies, including React, Node, Express, and the Spotify playback SDK. With Spotty, you can stream your favorite music from Spotify right in your browser.
I made Spotty because I wanted to explore APIs and learn how to build a web player for one of my favorite music streaming services, Spotify. As someone who loves music and coding, I saw this as an exciting opportunity to combine my interests and create something that I would personally use.
My inspiration for Spotty also came from my frustration with the official Spotify desktop and mobile apps. While they offer a great user experience, I often found myself wishing for a more lightweight and customizable way to access my music. With Spotty, I aimed to create a simple and intuitive web player that allows users to stream their music seamlessly without any distractions.
My goal with Spotty was to create a web player that offers all the core functionalities of Spotify, such as browsing and searching for music, creating and managing playlists, and streaming songs, albums, and playlists. At the same time, I wanted to use modern web technologies such as React, Node.js, and the Spotify Web API to build a fast and responsive player that would work on any device.
Another important goal for me was to make Spotty accessible to as many people as possible. That's why I made sure to design the player with a clean and minimalistic user interface that is easy to use even for those who are not tech-savvy.
- Secure login with your Spotify account
- Browse and search for songs, albums and artists
- Switch between themes (Dark, Light, City Lights, and Spotify Green)
- Stream songs, albums, and playlists with the Spotify playback SDK
- View song lyrics
- Censor profanity in song lyrics
To build Spotty, I used a range of modern web technologies, including:
- React
- Node.js
- Express
- Spotify Premium API
- Spotify Playback SDK
- Google Lyrics API
To install Spotty, you will need to clone the repository to your local machine and install the necessary dependencies. Here are the steps:
Clone the repository: git clone https://github.com/r-chong/spotty.git
Navigate to the project directory: cd spotty
Install dependencies: npm install
Create a .env file with your Spotify API credentials:
CLIENT_ID=your-client-id
CLIENT_SECRET=your-client-secret
REDIRECT_URI=http://localhost:3000/callback
Start the development server: npm start
References: