I have seen some buzz around CSS Variables lately and recently had the opportunity to use them as part of the front-end team at Geckoboard. They solved a very specific problem for us while being easy to use, fast, and maintainable. In this post, I’ll describe how and why we used CSS Variables in combination with React to re-style our web app on the fly!
I was thinking about the best way to get a redux app to respond to user keypresses so I built the retro game Snake as a proof of concept. The space bar starts, pauses and resets the game, the arrow keys control the snake and the number keys set the difficulty level.
After some trial and error finding the right deployment for my site I thought I’d share a few of the intricacies and issues I had deploying my static Hugo site to an S3 bucket with Wercker. The basics are fairly simple and explained well in the Hugo Docs but there is not much documentation out there for the little touches like handling cache control and minifying your HTML output to please the Google Page Speed gods.
Hugo is a free and open-source static site generator (SSG) with a beautifully simple setup process, a command line interface and several killer features which I’ll cover in this tutorial. I am going to take you through the entire process of building a production website with Hugo, using GulpJS as an asset pipeline for CSS, JS and images.