Tables & Waves

Tables & Waves » Experiments » Grid+Electron+Live Tutorial

Monome Grid + Electron + Live Tutorial

Posted: July 8, 2023

This is a tutorial for writing an Electron JavaScript app that acts as a bridge between a monome grid and Ableton Live.

  1. Overview & Prerequisites
  2. Stub Out the Initial Electron App
  3. Connect the Electron App to the monome grid
  4. Connect the Electron App to the Ableton Live
  5. Electron Sequencer UI
  6. Ableton Live Note Sequence Integration
  7. Multitrack Sequencer & Melodies
  8. Musical Algorithms
  9. Epilogue: What Next & Parting Thoughts

Overview

How to Use the Tutorial

Experienced Developers

If you have experience with the skill sets listed below, consider just using the companion git repository for this tutorial:

https://github.com/tablesandwaves/grid-electron-live

At the time of writing, this repository has both a commit per tutorial step and tag per tutorial step. You can use the commit diffs to review the changes from one step to another. You can also simply use the repository HEAD to run the final version of the app, but note that you will need to configure your monome grid serial number in a YAML file. See the README for the brief details.

For Those That Want to Take it One Step at a Time

If you are new to this particular development environment, this tutorial is designed to provide you with cut-and-paste versions of all the code you need to update throughout the tutorial.

At the end of the web page for each step is a section, Code Updates for Step N. For most of the code examples, you will update an entire file of code, replacing the file's entire contents. Occassionally, when the updates are simple enough, a small snippet of code is provided. The heading beneath each file being updated will note whether it is a partial update.

Prerequisites

Hardware & Software Requirements

Basic Skills Assumed

While the tutorial is intended to be a cut-n-paste set of instructions, it is beyond the scope of this tutorial to teach all the skillsets required. If you are completely new to intermediate computer programming, especially web development, here are a few areas worth investigating: