Hot JAMS(tack): Lessons from Building a Music Discovery App with Drupal and React
summary
A decoupled music discovery app built with Reservoir distribution + Drupal 8 exposes a JSON:API endpoint that a React front end bootstrapped with Create React App consumes. Data migrates from a published Google Spreadsheet via Drupal Migrate and a custom source plugin, then augments records with the Spotify Web API; the production bundle serves as a JAMstack site showing 50 results by default with table, cover and heatmap views, client-side filtering, styled-components for CSS-in-JS, and a working live deploy.
AI-written summary · about
chapters (13)
- 0:00Introduction to Hot JAMS(tack)
- 1:48Why build a music discovery app
- 5:43Decoupled Drupal architecture choices
- 9:41Choosing Drupal distributions
- 15:42Migrating data from Google Sheets
- 23:22React basics and project setup
- 28:24Fetching data from Drupal API
- 34:30Building React components
- 40:06Managing state in React
- 47:16Styling React components
- 52:14Deploying with the JAMstack
- 56:08Do you really need Drupal?
- 57:52Q&A and closing thoughts
related talks
07mReact and the Music Industry | Jameyel "J. Dash" Johnson
23mReact & the JAMstack
45mBuilding Modern Web Applications with @Remix-Run
15mBuilding world-class web apps using Frappe and React
25mUsing Node.js and React with Drupal CMS at Edutopia
17mHow I Used React, Vue, & Node to Build a Single JAMstack App
22mMusic of React
27mJSON Streaming and React