My solution to the Splice Frontend Challenge. The drum machine was built with Jekyll. Here's how to run it locally:
$ gem install jekyll bundler
$ bundle install
$ jekyll serveVoilà! Open it up on http://localhost:4000
The brief for this project says to showcase what you love about frontend with this challenge. I love HTML and CSS. I love architecting how CSS should be organized, and I love spending time thinking about what is the most semantic way of marking something up.
I don't know the JavaScript necessary to create a working drum machine. I really wish I did. But you'll find other cool things in this repo. For example, I used CSS Grid to layout most of the drum machine. I've been using CSS Grid in production for a few months now and it's really awesome. It's changing the way we do layout for the web. I used High Contrast colors straight from Random A11Y because accessibility is important to me. I made sure focus states were clear, and if I had more time, I'd think of something even better.
You'll also notice a meticulous organization of CSS files. This is a pretty small project, but that type of stuff matters to me. I'm always thinking of how to make the lives of my coworkers easier, and I think well-organized code is just one of the ways I try to do my part.
Thank you so much for considering me. Please feel free to give me feedback.