rtkg12 / remixr Goto Github PK

View Code? Open in Web Editor NEW

59.0 5.0 29.0 2.71 MB

Discover new music based on the Spotify playlists you know and love!

Home Page: https://www.remixr.ml

License: MIT License

JavaScript 92.66% HTML 2.39% CSS 0.43% Shell 0.19% Less 4.33%

spotify spotify-api spotify-web-api music discovery playlists playlist-generator mixtapes

remixr's Introduction

Smart playlist generator for Spotify

Features - Spotify login

Generate playlists based on artist, track or playlist seeds
Generate playlists based on personal playlist as a seed
Tune parameters like popularity, mood, energy, etc. to further customize the playlist

Algorithm to generate similar playlists

Feature range calculation
1. Get all tracks in the playlist from the Spotify API
2. Query Spotify for different track features
3. Calculate the 0.1 and 0.9 quantile range for each feature
4. Use these as min and max targets for each feature
Extract most relevant artists and tracks as seeds
1. Find the frequency of artists and tracks in:
  - Playlist
  - User profile / listening history: short, medium, long term
2. Select most frequently appearing artists and tracks that exist in the playlist
Query Spotify API with the calculated seeds and parameter values

Installation

Clone

 git clone https://github.com/rtkg12/remixr.git

Pre-requisites

Make a developer account at https://developer.spotify.com and obtain the Client ID and Client Secret
Update client/.env and server/app.env accordingly.

Property	Description
REACT_APP_API_URL	Use `/api` for default configuration. Replace with backend server address for custom deployment
REACT_APP_TRACKING_ID	`optional` Google Analytics Tracking Id
CLIENT_URL	Address of the client application
REDIRECT_URI	Callback endpoint for Spotify authentication. `Note` Make sure this matches the Redirect URL in the Spotify API console

Installation

yarn install

Building and developing locally

Configuration

Environment variable	Value
REACT_APP_API_URL	`http://localhost:8080/api`
CLIENT_URL	`http://localhost:3000`
REDIRECT_URI	`http://localhost:8080/api/callback`

Running the project

yarn develop

The React app should start running in port 3000 and the Node.js app will be running in 8080

Deploying to Production

Configuration

Environment variable	Value
REACT_APP_API_URL	`/api`
CLIENT_URL	`http://PUBLIC_URL`
REDIRECT_URI	`http://PUBLIC_URL/api/callback`

Deploying

yarn deploy

This will build the React app and serve the build folder from Express. Express should be running in port 8080

Future Areas of Improvement

Add support for greater than five seeds using random sampling from generated playlists
Functionality to add individual songs to library directly from the app
Regenerate, re-order and edit the playlist dynamically before saving
Session-wide playlist building. Add songs from multiple queries, save in the end
Algorithm improvements - different statistical measures, collaborative filtering

Contribute

Please feel free to open an issue/pull request if you wish to work on any of the above features, or if you have any other suggestions for improvement.

remixr's People

Contributors

Stargazers

Watchers

remixr's Issues

Add icons to parameter sliders

The sliders for the parameters could use icons or text to provide some more information about them. For example, less energetic, more energetic or other labels. This should be a very low effort PR so please feel free to assign it to yourself and discuss any suggestions that you have.

Generate playlist out of liked/saved songs from user

Add the opportunity to generate a playlist out of liked/saved songs from the user.
The API should provide the possibillity to get these data.

Would take on this task to implement this feature, my first PR on Hacktoberfest :P
Please share your opinion on this idea.

Website is down

I tried to open the website www.remixr.ml but I get a timeout error. Is the site still online or is this project down?

Feature: Re-order/ edit songs in generated playlist

Add support for

re-ordering songs in the generated playlist
removing some songs from the playlist (and possibly, automatically adjusting parameters)
Generate more songs without losing current playlist (infinite scroll/ button)

Can we turn off the auto play feature?

Once I type in an artist/song/playlist, hovering over the track plays the audio. I find it a little distracting when the song preview plays on its own. There are pause and play buttons that merely indicate to the user what state the playback is at instead of controlling it. Maybe this is because I'm using Ubuntu 20.04.

I'm trying to contribute to more projects and would love to work on this feature.

Feature: Like/save songs to Spotify Library

Add a like button to each song in the results page which would allow users to directly save songs to their library without saving the entire playlist.

INVALID_CLIENT: Invalid redirect URI

When clicking the Log in button and log in with Spotify appears 'INVALID_CLIENT: Invalid redirect URI' error.

Adding TypeScript support

It might be a good idea to start adding TypeScript support to the React and Node.js code as more people are starting to contribute to the repo. I'm just creating this issue to gauge interest in this. This would probably require at least a few people working on it since there are a lot of different files, so please feel free to indicate if you'd be interested in working on it.

This should be a straightforward PR and would help you to get acquainted with the codebase in case you're interested in contributing.

If you are interested in working on this, check off a file that isn't being worked on currently and submit a PR before starting work on the next item in the list. I have put a few files that should be easy to start with and I'll keep adding more as these ones get done.

Checklist:

React:

client/src/modules/Spotify.js
client/src/components/SeedTag.js
client/src/components/SongList.js
client/src/components/SavePlaylist.js
client/src/components/PlaylistSuccessPage.js
client/src/components/PlaylistCard.js

Feature: Support for more than 5 seeds

Add support for more than 5 artist/track seeds. One possible algorithm could be to sample 5 seeds from the input seeds to work with the Spotify API. This process could be repeated a set number of times and the playlist can be generated by processing all the responses for frequency or some other metric.

Can't perform login in local server

Hey, I tried to run the project locally, but the login doesn't seem to work. I noticed that the access_token and refresh_token cookies are not present in the local storage after login. It seems to be related to this option added to the cookies:
secure: true (apiRoutes.js:48)

When I removed it, the login worked fine

rtkg12 / remixr Goto Github PK

remixr's Introduction

Features - Spotify login

Algorithm to generate similar playlists

Installation

Clone

Pre-requisites

Installation

Building and developing locally

Configuration

Running the project

Deploying to Production

Configuration

Deploying

Future Areas of Improvement

Contribute

remixr's People

Contributors

Stargazers

Watchers

Forkers

remixr's Issues

Recommend Projects

Recommend Topics

Recommend Org