#Codebox

A general purpose coding utility with live rendering and autosaving to a mongo backend.

HTML/JS mode

Markdown Mode (also shows the document sidebar)

To use:

$ npm install
$ npm install -g uglify-js
$ npm install -g component
$ component build -v && uglifyjs build/build.js -o build/build.min.js
$ git submodule update --init
$ cd assets/ace && npm install && node ./Makefile.dryice.js
$ Spin up a local, un-auth'd mongod (you can change those settings in server/server.js)
$ node server/server.js

Then open index.html in Chrome, Safari, FF (, Opera, IE?)

##About

I first built this because I was doing a lot of interviews and they wanted to see how I worked with JavaScript. So rather than do the Edit->Save->Switch Window->Hard Refresh workflow, I simply built a tool to live-inject my javascript into an iFrame.

After I landed a job (yay!) I decided to make it a bit more advanced by auto-saving every change to MongoDB and providing a document extension model so more types of live rendererd documents could be handled. At the time of this writing it handles HTML/JS and Markdown.

##Architecture

I used TJ's component for the UI foundation (and sloppyily found myself using it as the foundation for my controllers, which eventually I'd like to put into its own folder). At least for the UI stuff I found it to be quite a brilliant solution. In particular Tim Caswell's flexbox and splitbox implementations were tremendously useful.

Ultimately I needed to modify Tim's components for some functional and aesthetic reasons and so I'll likely put those changes in my own component repos. One of the many todos :-). For now though, I simply committed all the component repos as-is and omit component install from the installation instructions.

Editor component is Ace.

Node.js runs the websocket server. It's not very robust nor secure (limited message validation, no reconnection logic, only websocket support, no alternate protocols).