Table of Contents
- Elm Piano Teacher
- Lilypond in Markdown
- Popcorn Cove Subscriptions
- Lemmings Clone
- Dr Doug's Pediatrics
This is the music learning platform I have been working on since fall of 2018. The front end is all in Elm.
I gave a talk at Elm Conf 2019 about how I built this app.
I am currently working and planning out the backend. My current plan is the following:
- netlify identity for authorization and authentication
- PouchDB/CouchDB for storing user data using IBM's cloudant
- netlify functions for glueing everything together
And here are some of my ideas for my next features.
Elm Piano Teacher
This little app is built in Elm to demonstrate music concepts for my Elm Conf 2019 talk.
I needed an audio and visual way to talk about music stuffs with a keyboard. It uses the WebMIDI api available in Chrome. It also uses a lot of the tooling like note and keyboard rendering I have built up for app.knowyourtheory.com.
The things I added were
I then added decoders and encoders for all the midi messages so I could handle everything else in Elm.
Lilypond in Markdown
This projects generates music SVG from a markdown file using GNU Lilypond. I made a custom Nunjucks tag to process the markup and inject Lilypond's SVG output into the resulting HTML file.
More about the process can be found in this blog post
I also extended this to generate music files and play them in the browser using the output MIDI from Lilypond.
- LilyPond markup and compiler to generate music SVG
- TiMidity++ to transform the midi files
- FFmpeg to process the audio for the web
- Howler.js to manage the audio in the browser
Popcorn Cove Subscriptions
I built an app to help manage subscription boxes for a popcorn candy store my sister and brother-in-law run in Washington.
The app is built with the following
- deployed on Heroku
- python flask
- VueJS with Vuetify for the UI
The levels that you see in the game were described in CSV. My goal for this was to have users be able to create their own levels and upload them. I never got that far.
Dr Doug's Pediatrics
The website: https://drdougspediatrics.com/
This was my first freelance web project. My kid's dentist's old website was broken for mobile so I built them a new website.
The dependecies are really minimal for this project. I didn't use a framework. I stitched together some things to make it work.