https://github.com/francoborrelli/spotify-react-web-client

A spotify web client using React, React Redux, Spotify Web API and Spotify Playback SDK.
https://github.com/francoborrelli/spotify-react-web-client

javascript music-player react react-redux reactjs redux sass spotify spotify-api spotify-application spotify-clone spotify-clone-with-react spotify-clone-with-reactjs spotify-connect spotify-sdk spotify-web spotify-web-api spotify-web-playback-sdk spotify-web-player spotify-web-sdk

Last synced: 4 months ago
JSON representation

A spotify web client using React, React Redux, Spotify Web API and Spotify Playback SDK.

• Host: GitHub
• URL: https://github.com/francoborrelli/spotify-react-web-client
• Owner: francoborrelli
• License: mit
• Created: 2018-09-28T15:47:02.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2024-04-25T01:42:04.000Z (8 months ago)
• Last Synced: 2024-05-23T02:38:25.433Z (7 months ago)
• Topics: javascript, music-player, react, react-redux, reactjs, redux, sass, spotify, spotify-api, spotify-application, spotify-clone, spotify-clone-with-react, spotify-clone-with-reactjs, spotify-connect, spotify-sdk, spotify-web, spotify-web-api, spotify-web-playback-sdk, spotify-web-player, spotify-web-sdk
• Language: JavaScript
• Homepage: https://spotify-react-web-client.onrender.com/
• Size: 9.81 MB
• Stars: 79
• Watchers: 1
• Forks: 43
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        


  



# Spotify React Web Client

![Spotify](https://img.shields.io/badge/Spotify-1ED760?style=for-the-badge&logo=spotify&logoColor=white) ![React](https://img.shields.io/badge/react-%2320232a.svg?style=for-the-badge&logo=react&logoColor=%2361DAFB) ![Redux](https://img.shields.io/badge/redux-%23593d88.svg?style=for-the-badge&logo=redux&logoColor=white)

> [!IMPORTANT]  

> Spotify Playback requires users to authenticate with a valid Spotify Premium subscription.



  ⚡ Spotify Web Client using Spotify Web API and Spotify Playback SDK. 





  ⚡ This project was bootstrapped with Create React App.



## 🎹 Features

🎵 Play full audio tracks.

🎵 Control playback (pause, volume, shuffle, etc).

🎵 Add or edit your playlists.

🎵 See your recently played tracks and your top artists.

🎵 Follow and unfollow playlists and artists.

🎵 Add or remove tracks from your library.

🎵 Change the device in which you are currently playing.

🎵 Search tracks, albums, artists and playlists.

## 🖥️ Screenshots

More in images folder.



    

     

       

         

         

       

             

         

          

       

                 

         

          

       

     

    

    


## 👨‍💻 How to Run locally

1️⃣ First you need a [Spotify Client ID](https://developer.spotify.com/dashboard/applications).

```bash

$ git clone https://github.com/francoborrelli/spotify-react-web-client.git

$ cd spotify-react-web-client

$ yarn install

```

2️⃣ You will have to define a `.env` file and set the following variables:

```bash

REACT_APP_CLIENT_ID="YOUR_CLIENT_ID"

REACT_APP_REDIRECT_ID=http://localhost:3000/

```

3️⃣ Now run:

```bash

$ yarn install

$ yarn start

```

and visit http://localhost:3000.

## 🐳 Use Docker!

```bash

docker-compose up -d

```