5 Examples of React Applications Build on Open-Source Media APIs #javascriptEverywhere

Roy Derks (@gethackteam)
Hackteam
Published in
3 min readMar 18, 2018

As a big fan of movies/music and React, this post will show some examples of applications I found online that share these both interests. All projects are build on open source api’s and the source code is openly available, meaning everyone can easily run these applications by themselves. How cool would it be to start building your own movie database or custom SoundCloud music player as a side project? Let’s have a look!

TMDB Movie Database (source code, demo)

I really like IMDb, but their biggest downside for me is not having a public api. That’s where TMDB steps in, which has a great api containing the most relevant information for almost every movie and tv show. This project by Stephen Kempin shows how you can build your own movie database on top of this api, using React and the typeahead.js library from Twitter.

TMDB Netflix Look-a-Like (source code, demo)

The UI of Netflix is almost just as popular as the media streaming service the company offers. This makes it a good learning experience to get better at React, for example during a 100 Days of Coding challenge. This particular project was created for the Fullstack React newsletter by Jack Oliver, using the TMDB api.

SoundCloud clone (source code, demo)

One great benefit of the SoundCloud api is the degree to which their data is available. It allows you to develop a fully functional clone of their own applications, that fits all of your specific needs. This projects uses React in combination with Redux and Redux Saga, and is created by Richard Park.

Spotify Artist Discovery (source code, demo)

Having trouble finding new music or artists? This project uses the Spotify api to find artists that are similar to the ones you already like. Real fan of Michael Jackson? Fork and clone this project to build your own application to discover related artists with this project build in React, Redux, Redux Saga and RethinkDB. Thanks to Josh Comeau!

Magic Playlist — Spotify Playlist Discovery (source code, demo)

This final application helps you creating awesome playlists based on just one single song. Just search for your all time favorite song and a playlist will be created within seconds. You can listen to previews of all results and save the playlist directly on Spotify. Magic Playlist is created by Joel Lovera in React and designed by Agustín Schelstraete.

Do you like this post or have any suggestions? Please let me know! Below this post, on Twitter or by email.

Make sure to follow me on Twitter to keep notified of all things related to #javacript and #javascriptEverywhere

--

--

Roy Derks (@gethackteam)
Hackteam

Roy is an entrepreneur, speaker and author from The Netherlands. Most recently he wrote the books Fullstack GraphQL and React Projects.