Skip to content
rapid prototyping with d3.js
JavaScript HTML CSS CoffeeScript Python Handlebars Other
Latest commit f2c32ac Aug 26, 2015 @enjalot fix inlet and update it



Tributary allows you to share live-editable code snippets. These snippets will most likely use d3.js and allow a user to play with code in a very responsive way.

Tributary is innovation on principle, taking the excellent work of Gabriel Florit which was in turn inspired by Bret Victor's genius and making it sharable.

Tributary is a labor of love by Ian '@enjalot' Johnson and EJ '@mrejfox' Fox.


Start typing into the code editor and watch your code come to life! If you want to save your work you can click the fork button and it will save into a gist. The url in your browser will update to something like:

where the number: 2958568 is the gist id (you can see it here: )


On the backend tributary only depends on node and mongodb: To deploy locally run

git clone
cd ./tributary
npm install
node server.js

If you want to have github authentication working you will need to setup a github app ( ) and fill out the settings.js (see example-settings.js) The github app should have the following settings:
full URL: http://localhost:8888
callback URL: http://localhost:8888/github-authenticated

Right now you will also need to setup an imgur app and set the authentication details in settings.js as well

Frontend JS src file compilation with make to static requires node.js, uglify-js and browserify

npm install

You need to compile the frontend code and templates using make:


You can check the Makefile to see how it's done with uglify and handlebars. there is also a bash script which will recompile the frontend code when any files change.

To run the server you need to modify your /etc/hosts file and add sandbox.localhost

this is because tributary uses a separate subdomain to execute unsafe code in an iframe.

Some 3rd party libraries are minified and catted together for convenience. The result is found in /static/3rdparty.js To see what those are and how they are bundled look at this repository:

Reserved properties of the tributary object: tributary.initialize

Usage as a node module


I'm using latest CodeMirror from git (updating every-so often)
I have customized the JSHINT options in addons/lint/javascript-lint.js to be:

  asi: true,
  laxcomma: true,
  laxbreak: true,
  loopfunc: true,
  smarttabs: true,
  sub: true


Editor UI:

  • re-enable vim and emacs mode (add ui for those selections somewhere)
  • re-enable local storage backups per editor (need it so you can load code back but not execute it)

File UI:

  • open file from disk (file dialog)
  • edit filename
  • delete files

  • Embedding example (simpler UI, assemble from fewer pieces)

  • Make BV button work for any of the renders (not just svg)


  • enable number scrubbing for text mode (csv and tsv files)
Something went wrong with that request. Please try again.