Eric Yancey Dauenhauer
Musings from my desk


Musings from my desk

Loop Supreme, part 4: Adding a Scene

Loop Supreme, part 4: Adding a Scene

Eric Yancey Dauenhauer's photo
Eric Yancey Dauenhauer
ยทNov 7, 2022ยท

2 min read

Table of contents

  • Goal
  • Implementation
  • Status of app
  • Next time
  • Time log

This is part 4 in a series:


Add a basic Scene component, which should be a container for all the Tracks in the loop. A Scene should be able to add Tracks, and the Track component should be able to delete itself from the Scene track list.


This was a pretty boring task, mostly some simple React components. I refactored the "Container" styles into a new component so the Metronome and Scene would look the same. I'm not totally sure I'll keep this styling but for quick iteration I wanted it to be visually consistent.

The only thing that held me up on this task was forgetting to put the key prop in the right place ๐Ÿคฆ๐Ÿป. Initially, I added it to the top-level div in the Track component, rather than on the actual Track component rendered in the Scene. This caused the "remove" functionality to break and I was scratching my head until I realized my silly mistake.

Status of app

Loop Supreme Scene

Next time

  • Adding "record" functionality to the Track component!!! ๐Ÿ™Œ๐Ÿป So pumped for this, when this is working I think we'll officially have a proof-of-concept.

Time log

  • probably an hour and a half?
Share this