Hot JAMS(tack): Building a Music Discovery App with Drupal and React


Learn from one developer’s experience building a music discovery app with Drupal 8 and React, soundtracked by the hottest jams of 2017 (Remember that year? Yikes!)

On an annual basis, The Album of the Year Project follows a painstaking Process to compile all of the best of the year lists into one massive google spreadsheet that crowns a definitive musical critical consensus (DAMN.) While an intriguing dataset is practically the American Dream, how could a curious developer take the Plunge and go from a Google Spreadsheet to a JavaScript application while gaining A Deeper Understanding of Decoupled Drupal and React along the way?

Your awesome mixtape will include:

  • A Common Sense approach to choosing a decoupled architecture - progressively decoupled vs. fully decoupled and why a fully decoupled approach was most appropriate for this project.
  • CTRL your API with the right flavor of Drupal - Contenta vs. Reservoir, vs no distribution, and why Reservoir was chosen for this project.
  • Migrate to the rescue - getting data from a Google spreadsheet and the Spotify API into Drupal without resorting to getting Drunk.
  • 4:44 worth of React basics (actual time may vary)
    • Quickly bootstrapping a project with Create React App
    • Components, Props and State - oh my!
    • Go Fetch! - getting data from JSON API into your app.
  • CSS in JS (aka Nothing Feels Natural) - How I avoided a Crack-Up and learned to love styled components.
  • Take Me Apart and deploy me back together - a look at the JAMstack and efficient ways to build and deploy your application.
  • The rest of The OOZ - the things I conveniently avoided, the things I’d do differently next time around, and why I threw away the first version of this app and started over.


Last but not least, we'll wrap up with some Melodrama and ask the question 'did this project really need Drupal'?
By the time the mixtape fades out, you’ll have a clearer picture of what it takes to go from compelling dataset to decoupled app, and may even be itching to join the Party and do something similar yourself. You’ll also know beyond a shadow of a doubt that critics really, really loved Kendrick Lamar’s latest album.

This talk is for people who are are interested in decoupled Drupal but unsure where to start, people who find it helpful to learn from real world decoupled projects, or even just people taking a Slowdive into decoupled Drupal concepts who want to avoid some poor developer's rookie mistakes.  Experienced React developers are unlikely to learn something new about React here, but will better understand how Drupal could be a viable option to serve their front end work. 

Live app:
Full slides available here: (or PDF version - doesn't contain all dynamic content)

Session Track

Front End Development

Experience Level


Drupal Version

When & Where

Wednesday, 11 April, 2018 - 15:45 to 16:45
204 | Mediacurrent