HTML5 Audio with React

The HTML5 audio tag provides a great way to work with simple audio in a web app, but when you’re using React’s nice pattern in the rest of your app, it can be a pain to go back to messing directly with DOM objects. The ReactAudioPlayer module provides a thin wrapper to the audio tag that fits right into a React app. ReactAudioPlayer is something I wrote while working on an audio project.

Setting up HTTPS on Node for Free with Let's Encrypt

Given how vitally important running your site in HTTPS is, it's disappointing how high the barrier to entry is. Some services like Heroku do make it easy to set up, but you will have to pay for that simplicity. Recently, the EFF and several other organizations put together a project called Let's Encrypt, which hopes to lower this barrier to entry. Let's Encrypt is a free certificate authority and collection of software that makes it easy to obtain and autorenew certificates for any site.

Using ES6 Generators to Manage Dialog Flow in a Game

Remember how great it was when you first started using promises to combat javascript callback hell? Your code was much more concise, easier to understand, and didn't nest a million levels deep... Well EcmaScript 6 generators promise (no pun intended) to bring about a similar revolution in the way we deal with asynchronous code. We've been hearing about how complex code dealing with API calls and user interactions will be able to look just like synchronous code, with everything happening in one flow and being much easier to follow.

Getting a Distributed Static Website Running with Maelstrom

BitTorrent's Project Maelstrom is a web browser for the decentralized web that downloads assets via torrent instead of web server. It was recently released to the public as a beta, and with it a simple Python tool to create torrents optimized for Maelstrom from static websites. That got me really excited, so I went through the simple process of serving up my own static site via torrent. What better content to serve this way than Multitasq, a backend-less HTML5 app I wrote awhile back.

SVG viewBox sandBox

Awhile back I wrote an article about SVG viewBox after being confused by it for so long. Just recently I went back and wrote a live updating sandbox app in React that allows you to quickly play around with different viewBox setups and see the result instantly. Check out the live demo here and see if you can follow how different changes to viewBox and preserveAspectRatio affect the SVG. The source code is also available on Github.

Formatting Currency in Javascript

I just had more trouble than I should have trying to figure out how to properly format currency, so it's going up as a blog post. Intl, the new feature available in modern browsers for internationaliztion, is actually really great for localizing and formatting things like currency, but here's to hoping this saves someone time digging through the spec. Here's the code you want for USD: var nf = new Intl.NumberFormat(‘en-US’, { style: ‘currency’, currency: ‘USD’, minimumFractionDigits: 2, maximumFractionDigits: 2 }); nf.format(123456.789); // ‘$123,456.79’ The minimumFractionDigits and maximumFractionDigits options are what took me so long to find.

A Starting Point for Routed Meteor Apps

There are a lot of really cool demos out there for simple, single page Meteor apps. When you want to get a bit more practical and add a few different states with routes, Meteor still works great, but the initial work for getting this running can be a bit more strenuous. This post and my open source boilerplate project Meteorplate aim to help get you up and running in the shortest time possible.

Announcing Mentorthing

Today marks the soft launch of a project I've been working on with some friends called Mentorthing. I work on a lot of side projects for fun and for a technical challenge, but this one I'm really hoping can make a difference for a few people. The idea behind Mentorthing is to create an open platform where anyone can put themselves out there as a mentor, and anyone else can seek their help as a mentee.

Sharing JavaScript Between the Front and Back End

There are a lot of advantages to running Nodejs, but one that's not taken advantage of as much as it could be is sharing code between the front and back ends. You're running the same language on both sides of the stack, so why rewrite code that's run on both? You can get pretty fancy with this. If you're familiar with Meteor, you know how easy this platform makes it to forget the distinction between frontend and backend altogether.

Write Your Commit Message First and Code Second

It hit me the other day at work. I've been using git wrong all along. The workflow for using version control shouldn't be to write a hacked together summary of all the code changes I just made every time I get the project in a sane state. It should be to write a contract with myself describing the state of the project after some incremental improvement, and then to write that improvement.