What's Spotifights?

Spotifights is a side project from clupes.com and is made for fun.
I wanted to use the API Spotify and thought that the best way to made it was this solution.

What's a side project?

In a conference from Tobias Van Schneider that I assited in Barcelona, he talked about creativity, talks about the benefits about made a side project (a stupid one) on your own.
I think that he explains better in this article.
Theorically the development from your side project has to be short, and I've been thinking about this one too much time. But at the end on the execution I've made it fast (one week and a half, more or less).

How does Spotifights work?

It's very simple:

  • in the homepage you can see some musical fights between two artists or bands
  • you enter using the spotify login
  • you'll see a list of the top 10 songs from each artist mixed and faced
  • drag the fists to the song you prefer in each row
  • press button Vote
When the fight ends you'll see the results in the same page also you'll see a list of the top songs voted and a graph about the votation in each row.

Why do we use Spotify api to login

Firstly because I wanted fast Login, one click if is possible. Laravel includes a login system by default but this one I think that is easier for the user.
Secondly because at first time I thought that users could create it's own fights (maybe in the future).
Thirdly because it permets the user to save the fights as playlists in it's own Spotify library.

Who creates the fights?

Currently me, myself and I

What technologies does spotifights use?

Mainly: Laravel, Spotify API, Tailwindcss, libraries like Guzzle for the OAuth
And more technologies that I'm used to work with it like bootstrap and jquery (that i want to remove it to leave the project cleaner), but sometimes you have to choose between finishing the work and to improve it more and more.

COOKIES and personal information

What cookies do we use?

  • laravel_session: for maintaining the user session when he/she is logged in
  • _ga: for google analytics, just for having the information about how many users visit the page and where do they come from