Back
project image

Words

A tool for quickly creating songsheets with chords and lyrics.

  • Next.js
  • chord-mark
  • GCP
  • Docker

Summary

Words is a chord sheet generator using Chord-Mark for rendering and WeasyPrint for generating PDFs of the rendered HTML

Purpose

Putting together chord sheets quickly for rehearsals or open mic nights can be a very time consuming process. I put this together over the course of a week to simplify the process.

The UI was built with NextJS (which I absolutely adore), and while there is currently no save functionality, as I'm still learning backend, User can generate a PDF file generated from a pre-built WeasyPrint Docker container.

The mobile UI could use some work still. It switches to a tabbed view based on CSS breakpoints, but as the text input requires extensive usage of underscore characters to align chords in the rendered output with lyrics: I'm going to add a button to insert underscores at the cursor's current location and mitigate a lot switching between alphabet and special character keyboard layouts on mobile.

Deployment

A GCP project containing two services: the UI (available on the 'words' subdomain of my personal site), and the WeasyPrint instance. Both are Dockerized and deployed via Cloud Run