Skip to content
View lib.js
export default function foo() {
return 'foo';
export function bar() {
return 'bar';
View form-save.js
// NOTE: the '#form-id' selector below will most certainly be different
// for whatever page you're on. Remember to change it in both instances!
// run this in the terminal to save the state of your form
// in your browser's LocalStorage:
[]'#form-id').elements, function(el) {
localStorage.setItem(, el.value);
// then refresh the page and run this to restore your form values:
View data.yaml
# fields is a map, the keys of which are the output columns
# the simplified form just maps an output column to an input column
# internally, this should still be represented as a hash with
# the minimum set of useful metadata with reasonable defaults
name: CITNM
# the more descriptive form provides column metadata:
View index.html
<!DOCTYPE html>
<html lang="en">
<script src=""></script>
<script src=""></script>
body {
margin: 0;
padding: 1em;

This is a fork of the Mike Bostock's World Tour with an additional bitmap for doing point-in-polygon lookups with unique colors, as described in this stackoverflow answer.

Move your mouse over the countries to highlight them with their corresponding bitmap color.


ASCII California

  1. If you don't have Node yet, get it.
  2. Run npm install to get geotype.
  3. Run this to get your own ASCII California:

Stateful Checkboxes

This quick little hack creates a global function named checkboxes() that uses [localStorage] to remember the state of checkboxes on the host page. Usage:

var boxes = checkboxes({
    // the checkbox selector (always prefixed with 'input[type=checkbox]')
    selector:   '.stateful',
    // the storage engine (only 'localStorage' is supported here)
    storage:    'localStorage',
    // the prefix for all storage keys
View charts.html
{% macro series(bars, value_key, tooltip=None) %}
<div class="chart-series chart-series--vertical">
{% for bar in bars %}
<div class="chart-series__bar" data-value="{{ bar[value_key] }}">
{% if tooltip %}
<div class="chart-series__bar__tooltip">
<div class="chart-series__bar__tooltip__content">
{{ tooltip(bar) }}
View async.js
function noreallygimmeasyncdammit(sync) {
return function() {
var args = [],
next = args.pop();
try {
var value = sync.apply(this, args);
} catch (err) {
return next(err);
next(null, value);


This document is largely superceded by the swagger-static repo, where I'm now planning a project. GitHub won't notify me of comments here, so if you want to get in touch please comment on or file an issue. Thanks!


At 18F we're implementing [Swagger]-compliant APIs to make them more accessible and facilitate simpler documentation. Unfortunately, the only generally accepted way of exposing human-readable Swagger API documentation is [SwaggerUI], a client-side JavaScript library with some serious issues:

  1. Because all SwaggerUI-based documentation is rendered at runtime, search engines are [theoretically] unable to crawl their contents.
  2. Tight coupling with jQuery and a [long list of dependencies](
Something went wrong with that request. Please try again.