<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom" ><generator uri="https://jekyllrb.com/" version="3.9.5">Jekyll</generator><link href="https://jgoodall.me/feed.xml" rel="self" type="application/atom+xml" /><link href="https://jgoodall.me/" rel="alternate" type="text/html" /><updated>2024-06-24T18:01:47+00:00</updated><id>https://jgoodall.me/feed.xml</id><title type="html">John Goodall</title><subtitle>John Goodall is Research Scientist at Oak Ridge National Laboratory.</subtitle><author><name>johnrgoodall</name></author><entry><title type="html">Useful Go Packages</title><link href="https://jgoodall.me/2017/12/08/golang-packages.html" rel="alternate" type="text/html" title="Useful Go Packages" /><published>2017-12-08T00:00:00+00:00</published><updated>2017-12-08T00:00:00+00:00</updated><id>https://jgoodall.me/2017/12/08/golang-packages</id><content type="html" xml:base="https://jgoodall.me/2017/12/08/golang-packages.html"><![CDATA[<p>Below is a list of packages we use for various projects. <a href="https://awesome-go.com/">Awesome Go</a> is a great list, but it includes a lot of options. Below are the packages we have standardized on in the <a href="https://www.ornl.gov/division/csed/cyber-security">Cyber &amp; Information Security Research Group (CISR)</a> at <a href="https://www.ornl.gov/">ORNL</a>.</p>
<h2 id="tools">Tools</h2>
<ul>
<li>Editor: <a href="https://atom.io/">atom</a> with <a href="https://atom.io/packages/go-plus">go-plus</a></li>
<li>Package management: <a href="https://github.com/golang/dep">dep</a> - dep is the official experiment, but not yet the official tool</li>
<li>Development/deployment platform: <a href="https://www.docker.com/">docker</a> with <a href="https://docs.docker.com/engine/swarm/">swarm</a></li>
</ul>
<h2 id="packages">Packages</h2>
<ul>
<li>Command line/configuration: <a href="https://github.com/urfave/cli">urfave/cli</a> - package for building command line apps in Go</li>
<li>RPC: <a href="https://github.com/grpc/grpc-go">gRPC</a> - HTTP/2 based RPC</li>
<li>Serialization: <a href="https://github.com/golang/protobuf">protobuf</a> and <a href="https://github.com/gogo/protobuf">gogoprotobuf</a> (for faster marshalling and unmarshalling)</li>
<li>JSON: <a href="github.com/mailru/easyjson">easyjson</a> - faster JSON marshalling and unmarshalling</li>
<li>Logging: <a href="https://github.com/uber-go/zap">zap</a> or <a href="https://github.com/rs/zerolog">zerolog</a> - zero allocation logging (<a href="https://github.com/grpc-ecosystem/go-grpc-middleware/tree/master/logging/zap">gRPC zap middleware</a>)</li>
<li>Performance monitoring: <a href="https://github.com/prometheus/prometheus">prometheus</a> - metrics and alerting (<a href="https://github.com/grpc-ecosystem/go-grpc-prometheus">gRPC prometheus middleware</a>)</li>
<li>Diagnostics: <a href="github.com/google/gops">gops</a></li>
<li>Testing: <a href="github.com/stretchr/testify">testify</a></li>
<li>Embedded data store: <a href="https://github.com/dgraph-io/badger">badger</a> - fast key-value store</li>
<li>HTTP framework: <a href="https://github.com/labstack/echo">echo</a></li>
<li>Embedding resources: <a href="https://github.com/GeertJohan/go.rice">go.rice</a></li>
<li>Communications: <a href="https://github.com/go-mangos/mangos">mangos</a> - a pure Go implementation of <a href="http://nanomsg.org/">nanomsg</a></li>
<li>Configuration: <a href="https://github.com/BurntSushi/toml">BurntSushi/toml</a> - TOML parser</li>
<li>Console progress bar: <a href="https://github.com/cheggaaa/pb/tree/v2">pb</a></li>
</ul>
<h2 id="integrations">Integrations</h2>
<ul>
<li><a href="https://www.elastic.co/products/elasticsearch">Elasticsearch</a>: <a href="https://github.com/olivere/elastic/">elastic</a></li>
<li><a href="https://kafka.apache.org/">Apache Kafka</a>: <a href="https://github.com/Shopify/sarama">sarama</a> and <a href="https://github.com/bsm/sarama-cluster">sarama-cluster</a></li>
</ul>]]></content><author><name>johnrgoodall</name></author><category term="golang" /><summary type="html"><![CDATA[Below is a list of packages we use for various projects. Awesome Go is a great list, but it includes a lot of options. Below are the packages we have standardized on in the Cyber &amp; Information Security Research Group (CISR) at ORNL.]]></summary></entry><entry><title type="html">Go Resources</title><link href="https://jgoodall.me/2015/11/17/golang-resources.html" rel="alternate" type="text/html" title="Go Resources" /><published>2015-11-17T00:00:00+00:00</published><updated>2015-11-17T00:00:00+00:00</updated><id>https://jgoodall.me/2015/11/17/golang-resources</id><content type="html" xml:base="https://jgoodall.me/2015/11/17/golang-resources.html"><![CDATA[<p>This is a list of resources for getting started with the <a href="https://golang.org/">go programming language</a>.</p>
<h2 id="official-docs">Official Docs</h2>
<ul>
<li><a href="https://golang.org/doc/install">Installation Guide</a></li>
<li><a href="https://golang.org/doc/code.html">How to Write Go Code</a> - an overview of organizing a project and using the <code>go</code> tool.</li>
<li><a href="https://golang.org/doc/effective_go.html">Effective Go</a> - tips for writing go code.</li>
<li><a href="https://golang.org/ref/spec">The Go Programming Language Specification</a> - surprisingly readable spec.</li>
</ul>
<h2 id="beginner-books">Beginner Books</h2>
<ul>
<li><a href="http://openmymind.net/The-Little-Go-Book/">The Little Go Book</a>, by <a href="https://twitter.com/karlseguin">Karl Seguin</a>. Available as epub, mobi, pdf, or as <a href="https://github.com/karlseguin/the-little-go-book">markdown source</a>.</li>
<li><a href="http://www.golang-book.com/">An Introduction to Programming in Go</a>, by <a href="http://www.doxsey.net/about">Caleb Doxsey</a>. Available online, or <a href="http://www.golang-book.com/public/pdf/gobook.0.pdf">pdf</a>.</li>
<li><a href="https://www.miek.nl/go/">Learning Go</a>, by <a href="https://twitter.com/miekg">Miek Gieben</a>. Available online, or as <a href="https://github.com/miekg/learninggo">markdown source</a>.</li>
<li><a href="http://www.golangbootcamp.com/">Go Bootcamp</a>, by <a href="https://twitter.com/mattetti">Matt Aimonetti</a>. Available online, or epub, mobi, or pdf.</li>
</ul>
<p>There are <a href="https://github.com/dariubs/GoBooks">many other books on go</a>, but these are the ones I have read.</p>
<h2 id="cheat-sheets">Cheat Sheets</h2>
<ul>
<li><a href="https://devhints.io/go">devhints.io's Go cheat sheet</a></li>
<li><a href="https://gobyexample.com/">Go By Example</a> - excellent overview and reference.</li>
<li><a href="http://golang-examples.tumblr.com/">Golang Examples</a> - lots of simple code snippets for common operations (e.g. <a href="http://golang-examples.tumblr.com/post/99458329439/get-local-ip-addresses">get your IP address</a> or <a href="http://golang-examples.tumblr.com/post/97848675424/read-from-stdin-or-file">reading from stdin or a file</a>).</li>
</ul>
<h2 id="blogs">Blogs</h2>
<ul>
<li><a href="https://blog.golang.org/">Go Blog</a> - lots of good articles (e.g. <a href="http://blog.golang.org/json-and-go">json</a>, <a href="http://blog.golang.org/godoc-documenting-go-code">documenting go</a>, and <a href="http://blog.golang.org/laws-of-reflection">reflection</a>), links to conference videos and slides, and release notes. (Mostly written by <a href="https://twitter.com/enneff">Andrew Gerrand</a>.)</li>
<li><a href="https://dave.cheney.net/">Dave Cheney</a> - he develops a lot of tools and is a prolific writer on go.</li>
</ul>
<h2 id="packages">Packages</h2>
<ul>
<li><a href="https://golang.org/pkg/">official packages</a> - go standard library and sub-repositories.</li>
<li><a href="https://godoc.org/">godoc</a> - documentation for go packages on github and other sites.</li>
<li><a href="http://awesome-go.com/">Awesome Go</a> - curated list of go libraries.</li>
</ul>]]></content><author><name>johnrgoodall</name></author><category term="golang" /><summary type="html"><![CDATA[This is a list of resources for getting started with the go programming language.]]></summary></entry><entry><title type="html">Tell git to use https instead of git protocol</title><link href="https://jgoodall.me/2013/05/29/git-use-https.html" rel="alternate" type="text/html" title="Tell git to use https instead of git protocol" /><published>2013-05-29T00:00:00+00:00</published><updated>2013-05-29T00:00:00+00:00</updated><id>https://jgoodall.me/2013/05/29/git-use-https</id><content type="html" xml:base="https://jgoodall.me/2013/05/29/git-use-https.html"><![CDATA[<p>Many corporate firewalls blocks the <a href="http://git-scm.com/book/ch4-1.html#The-Git-Protocol">git protocol</a>, causing tools like <a href="http://bower.io/">bower</a> to fail without jumping through some hoops. But pretty much every firewall allows web traffic through, so you can always use <code>https</code> if your tools know about it. The solution is to tell <a href="http://git-scm.com/">git</a> to always use <code>https</code> instead of <code>git</code> by running the following command:</p>
<figure class="highlight"><pre><code class="language-bash" data-lang="bash">  git config <span class="nt">--global</span> url.<span class="s2">"https://"</span>.insteadOf git://</code></pre></figure>
<p>This adds the following to your <code>~/.gitconfig</code>:</p>
<pre><code>[url &quot;https://&quot;]
  insteadOf = git://
</code></pre>
<p>All git commands will perform a substitution of <code>git://</code> to <code>https://</code>. Thanks <a href="http://stackoverflow.com/questions/tagged/git">StackOverflow</a>!</p>
<p><a href="http://stackoverflow.com/a/10729634">Reference</a></p>]]></content><author><name>johnrgoodall</name></author><category term="tools" /><category term="git" /><summary type="html"><![CDATA[Many corporate firewalls blocks the git protocol, causing tools like bower to fail without jumping through some hoops. But pretty much every firewall allows web traffic through, so you can always use https if your tools know about it. The solution is to tell git to always use https instead of git by running the following command:]]></summary></entry><entry><title type="html">Vagrant, Chef, and Berkshelf</title><link href="https://jgoodall.me/2013/05/21/vagrant-chef-berkshelf.html" rel="alternate" type="text/html" title="Vagrant, Chef, and Berkshelf" /><published>2013-05-21T00:00:00+00:00</published><updated>2013-05-21T00:00:00+00:00</updated><id>https://jgoodall.me/2013/05/21/vagrant-chef-berkshelf</id><content type="html" xml:base="https://jgoodall.me/2013/05/21/vagrant-chef-berkshelf.html"><![CDATA[<p><a href="http://www.vagrantup.com/">Vagrant</a> is a tool to create portable, sharable development and testing environments. It is used to build, provision, and configure a virtual machine (by default, <a href="https://www.virtualbox.org/">VirtualBox</a>). Here we will configure Vagrant with <a href="http://nodejs.org/">nodejs</a> and <a href="http://redis.io/">redis</a>. <a href="http://www.opscode.com/chef/">Chef</a> and <a href="http://berkshelf.com/">berkshelf</a> are used for provisioning.</p>
<p>The complete setup is available at <a href="https://github.com/jgoodall/vagrant-node">https://github.com/jgoodall/vagrant-node</a>.</p>
<h2 id="install-and-configure-vagrant">Install and configure Vagrant</h2>
<p>First, <a href="https://www.virtualbox.org/wiki/Downloads">download VirtualBox</a> and install.</p>
<p><a href="http://downloads.vagrantup.com/">Download a Vagrant installer</a> for Mac OS, Windows, and Linux and install it.</p>
<p>To create an initial Vagrant file, run the command:</p>
<pre><code>	vagrant init
</code></pre>
<p>The <code>init</code> command creates a sample <code>Vagrantfile</code>, which is the main configuration.</p>
<p>The first thing we need to do is add a <em>box</em>. Vagrant has a couple of preconfigured Ubuntu boxes (referred to in the <a href="http://docs.vagrantup.com/v2/boxes.html">Vagrant Docs</a>), but there is a <a href="http://www.vagrantbox.es/">large list of available boxes</a>. We are just going to use one of the available Ubuntu boxes, <code>precise64</code> (<a href="http://releases.ubuntu.com/precise/">Ubuntu 12.04</a>). Edit the <code>Vagrantfile</code>, near the top:</p>
<pre><code># Every Vagrant virtual environment requires a box to build off of.
config.vm.box = &quot;precise64&quot;

# The url from where the 'config.vm.box' box will be fetched if it
# doesn't already exist on the user's system.
config.vm.box_url = &quot;http://files.vagrantup.com/precise64.box&quot;
</code></pre>
<p>To access the guest VM from the host OS, set up <em>port forwarding</em>. To set forwarding to access port 8000 on the guest VM from <a href="http://localhost:8000">http://localhost:8000</a> on the host OS:</p>
<pre><code>config.vm.network :forwarded_port, guest: 8000, host: 8000
</code></pre>
<p>For the <a href="https://www.virtualbox.org/">VirtualBox</a> <em>provider</em>, we can <a href="http://docs.vagrantup.com/v2/providers/configuration.html">customize the provider settings</a> by modifying this section, for example to set the VM memory to 2GB:</p>
<pre><code>config.vm.provider :virtualbox do |vb|
  vb.customize [&quot;modifyvm&quot;, :id, &quot;--memory&quot;, &quot;2048&quot;]
end
</code></pre>
<p>Here is a <a href="http://www.virtualbox.org/manual/ch08.html#vboxmanage-modifyvm">full list of the settings for VirtualBox</a>.</p>
<h2 id="configure-provisioning">Configure provisioning</h2>
<p>We will use <a href="http://www.opscode.com/chef/">Chef</a> for provisioning, but <a href="https://puppetlabs.com/">Puppet</a> works too. Ops people undoubtedly have a preference, but for our purposes either works. One of the main differences is that Chef configuration is written in <a href="http://www.ruby-lang.org/">Ruby</a>, while Puppet uses its own <a href="http://docs.puppetlabs.com/puppet/3/reference/lang_summary.html">domain specific language</a>.</p>
<h3 id="cookbooks">Cookbooks</h3>
<ul>
<li><a href="http://community.opscode.com/cookbooks">Chef cookbooks</a></li>
<li><a href="http://forge.puppetlabs.com/">Puppet forge</a></li>
</ul>
<h3 id="docs">Docs</h3>
<ul>
<li><a href="http://docs.opscode.com/">Chef docs</a></li>
<li><a href="http://docs.puppetlabs.com/puppet/">Puppet docs</a></li>
</ul>
<h3 id="chef-solo">Chef Solo</h3>
<p>While either Puppet or Chef will work, but we are going to use Chef Solo with our Vagrant setup. The <a href="http://docs.vagrantup.com/v2/provisioning/chef_solo.html">Vagrant documentation on Chef Solo</a> has more information.</p>
<p>First, let's update the packages already installed:</p>
<pre><code># Update the list of packages
config.vm.provision :shell, :inline =&gt; &quot;sudo apt-get update -y&quot;
</code></pre>
<p>This will not actually do the upgrades, for that you will need to run <code>sudo apt-get upgrade -y</code>, but <code>grub</code> seemed to be giving me errors when trying doing that automatically from the <code>Vagrantfile</code>.</p>
<p>You can download cookbooks into your Vagrant repository and configure in the Vagrantfile, or you can use one of the cookbook management tools, such as <a href="http://berkshelf.com/">berkshelf</a>:</p>
<pre><code>gem install berkshelf
</code></pre>
<p>Create the file <code>Berksfile</code> and add the following:</p>
<pre><code>cookbook &quot;git&quot;
cookbook &quot;nodejs&quot;
cookbook &quot;redisio&quot;
</code></pre>
<p>Add the following line to your <code>Vagrantfile</code>:</p>
<pre><code># Use [berkshelf](http://berkshelf.com/)
config.berkshelf.enabled = true
</code></pre>
<p>Install <a href="http://nodejs.org/">nodejs</a>, setting the version to the latest stable or what version you need, <a href="http://redis.io/">redis</a>, and <a href="http://yeoman.io/">yeoman</a>, <a href="https://github.com/isaacs/node-supervisor/">node-supervisor</a>, and <a href="https://github.com/nodeapps/http-server">http-server</a>:</p>
<pre><code>config.vm.provision :chef_solo do |chef|
  chef.json = {
    &quot;nodejs&quot; =&gt; {
      &quot;version&quot; =&gt; &quot;0.10.7&quot;
    }

  }

  chef.add_recipe &quot;git&quot;
  chef.add_recipe &quot;nodejs&quot;
  chef.add_recipe &quot;redisio::install&quot;
  chef.add_recipe &quot;redisio::enable&quot;

end

# install global node modules
config.vm.provision :shell, :inline =&gt; &quot;npm install -g yo grunt-cli bower supervisor http-server&quot;
</code></pre>
<p>Note, there are several cookbooks for node.js and redis; this uses the <a href="https://github.com/brianbianco/redisio/">redisio</a> and the <a href="http://community.opscode.com/cookbooks/nodejs">nodejs</a> cookbooks.</p>
<h2 id="conclusion">Conclusion</h2>
<p>At this point, you probably want to install your own software. You can do this from your <code>Vagrantfile</code> using <code>git</code>, but then you will have to do a <code>git pull</code> after all your changes. Another approach is to clone everything inside your vagrant directory and it will then be mounted within the guest VM automatically. Anything that is in the same directory as the <code>Vagrantfile</code> will be mounted within the VM in <code>/vagrant</code>.</p>
<p>If you have multiple sub-projects, another approach is to put all of your sub-projects under one project-root directory. One way to configure things if you have multiple projects and a separate repo for your vagrant configuration is to set up your directory structure like this:</p>
<pre><code>- project-root
  - vagrant-config
  - sub-project1
  - sub-project2
</code></pre>
<p>And then symlink your <code>Vagrantfile</code> to the <code>project-root</code> (<code>ln -s vagrant-config/Vagrantfile .</code>). Using this approach, you can edit your code in your host OS using <a href="http://www.sublimetext.com/">Sublime Text</a>, or whatever editor you like, and it is automatically changed in the <code>/vagrant</code> directory. Alternately, everything will be under your vagrant configuration repo.</p>
<p>To create the VM, run: <code>vagrant up</code>. This will take a few minutes as it downloads the <a href="http://docs.vagrantup.com/v2/boxes.html">box</a>, configures the VM, <a href="https://help.ubuntu.com/12.04/serverguide/apt-get.html">updates install packages</a>, and installs the packages listed in the <code>Vagrantfile</code>.</p>
<p>Redis should be running already (that is what the <code>redisio::enable</code> does). Because port forwarding for the redis port is configured, you can use <code>redis-cli</code> from the host OS to connect to the guest (assuming you don't also have redis running on the host).</p>
<p>If you have a nodejs process server set up and running on port 8000 (or if you have it set to start on a different port, change the mapping in the <code>Vagrantfile</code>), you can open a browser or use <code>curl</code> to access the server from the host OS by going to <a href="http://localhost:8000/">http://localhost:8000/</a></p>
<p>To log into the VM, from the directory that has your <code>Vagrantfile</code>, do: <code>vagrant ssh</code>. Here is <a href="http://docs.vagrantup.com/v2/cli/index.html">a list of all Vagrant commands</a>.</p>]]></content><author><name>johnrgoodall</name></author><category term="tools" /><category term="vagrant" /><summary type="html"><![CDATA[Vagrant is a tool to create portable, sharable development and testing environments. It is used to build, provision, and configure a virtual machine (by default, VirtualBox). Here we will configure Vagrant with nodejs and redis. Chef and berkshelf are used for provisioning.]]></summary></entry><entry><title type="html">HTML presentation frameworks</title><link href="https://jgoodall.me/2013/01/17/html-presentation-frameworks.html" rel="alternate" type="text/html" title="HTML presentation frameworks" /><published>2013-01-17T00:00:00+00:00</published><updated>2013-01-17T00:00:00+00:00</updated><id>https://jgoodall.me/2013/01/17/html-presentation-frameworks</id><content type="html" xml:base="https://jgoodall.me/2013/01/17/html-presentation-frameworks.html"><![CDATA[<p>There are loads of HTML5/CSS/JavaScript presentation frameworks out there. I had seen a couple of these in action and was kind of impressed. While <a href="http://www.macuser.com/people/keynote_er_al_gore_wins_nobel.php">Keynote</a> is not as bad as <a href="http://www.wired.com/wired/archive/11.09/ppt2.html">PowerPoint</a>, they both force you to think about design and content simultaneously. Because the design and layout is right in front of you, it can be hard to focus just on content, and I often find myself tweaking design when I should be thinking about content. So that led me to think, hey, wouldnt it be great if I could create my presentations with <a href="http://daringfireball.net/projects/markdown/">markdown</a> or something similar?</p>
<p>Here are the presentation frameworks I found and took a look at, in order of github stars:</p>
<ul>
<li>
<p><strong>impress.js</strong> (<a href="https://github.com/bartaz/impress.js/">github</a> / <a href="http://bartaz.github.com/impress.js/">demo</a>) is essentially a clone of <a href="http://prezi.com/">prezi</a>, allowing for really crazy presentations that use all sorts of transformations on an infinite canvas. This isnt the kind of thing I was looking for, but it does live up to its name (in the same way that the first time you see a 3D globe does). Documentation seems to be lacking, but it seems very popular (~13,000 stars).</p>
</li>
<li>
<p><strong>reveal.js</strong> (<a href="https://github.com/hakimel/reveal.js">github</a> / <a href="http://lab.hakim.se/reveal-js/#/">demo</a>) includes  nested slides, markdown contents, PDF export (using Chrome via a special style sheet), and speaker notes. Content can be created in html or <em>markdown</em> (yay), and there is even an online editor, <a href="http://www.rvl.io/">rvl.io</a>. Navigation by keyboard or touch events (swipe) or an overview hotkey that zooms you out (press ESC). There are lots of different transitions and default themes. Code highlighting is included by way of <a href="http://softwaremaniacs.org/soft/highlight/en/description/">highlight.js</a>.</p>
</li>
<li>
<p><strong><a href="http://imakewebthings.com/deck.js/">deck.js</a></strong> (<a href="https://github.com/imakewebthings/deck.js">github</a> / <a href="http://imakewebthings.com/deck.js/introduction/">demo</a>) seems mature and has a whole ecosystem around it. Content is created in HTML. Navigation by keyboard or touch events (swipe) or an overview hotkey (or touch double tap). Deck.js supports extensions, and beyond the default ones, there appears to be a whole bunch of contributed ones on the <a href="https://github.com/imakewebthings/deck.js/wiki">project wiki</a>, including lots of options for writing content in <a href="http://jade-lang.com/">Jade</a> or markdown.</p>
</li>
<li>
<p><strong>flowtime.js</strong> (<a href="https://github.com/marcolago/flowtime.js">github</a> / <a href="http://flowtime-js.marcolago.com/">demo</a>) is a relative newcomer, but seems pretty nice. Content is created in HTML. Navigation by keyboard or touch events or clicking on the overview. The one thing that sets flowtime apart is the overview, which displays all slides in a grid. The flowtime.js demo crashed both Chrome and Safari on my iPad, so not sure if mobile is really an option.</p>
</li>
<li>
<p><strong><a href="http://markdalgleish.com/projects/fathom/">fathom.js</a></strong> (<a href="http://github.com/markdalgleish/fathom">github</a> / <a href="">demo</a>) is a jquery plugin that is limited in terms of features, but looks easy to get started with. Content is created in HTML. Navigation by keyboard or mouse. The demo is a bit awkward on an iPad, you can scroll but it is more like scrolling a web page than flipping through slides. You can sync the video of your presentation, although that wasnt important for me.</p>
</li>
</ul>
<p>The ability of reveal.js to export to PDF and write slides in markdown are two features that set it apart. The export to PDF feature seems to only be available in reveal.js; I would like to see more support for that as there are times when I can only bring a pdf or ppt file to a presentation. Deck.js also seems solid, especially when all of the contributed plugins are considered.</p>]]></content><author><name>johnrgoodall</name></author><category term="presentations" /><summary type="html"><![CDATA[There are loads of HTML5/CSS/JavaScript presentation frameworks out there. I had seen a couple of these in action and was kind of impressed. While Keynote is not as bad as PowerPoint, they both force you to think about design and content simultaneously. Because the design and layout is right in front of you, it can be hard to focus just on content, and I often find myself tweaking design when I should be thinking about content. So that led me to think, hey, wouldnt it be great if I could create my presentations with markdown or something similar?]]></summary></entry><entry><title type="html">Git backed wiki - Gollum</title><link href="https://jgoodall.me/2012/11/14/git-backed-wiki.html" rel="alternate" type="text/html" title="Git backed wiki - Gollum" /><published>2012-11-14T00:00:00+00:00</published><updated>2012-11-14T00:00:00+00:00</updated><id>https://jgoodall.me/2012/11/14/git-backed-wiki</id><content type="html" xml:base="https://jgoodall.me/2012/11/14/git-backed-wiki.html"><![CDATA[<p>I just noticed, via <a href="http://onethingwell.org/post/35638422041/commonplace">onethingwell</a>, a new tool called <a href="http://helloform.com/projects/commonplace/">Commonplace</a> that acts as a server for your markdown files, basically providing pretty markdown rendering and basic editing functionality. Kind of like a wiki. I use <a href="http://markedapp.com/">marked</a> for viewing <a href="http://daringfireball.net/projects/markdown/">markdown</a> files. marked a great mac app developed by <a href="http://brettterpstra.com/">Brett Terpestra</a>, creator of <a href="http://brettterpstra.com/project/nvalt/">nvAlt</a>, a Notational Velocity fork. From <a href="https://github.com/textmate/textmate">TextMate 2</a>, or from other common text editors, you can install a bundle to integrate easily with marked, and you can add your own custom styles for viewing the markdown. I <a href="https://github.com/jgoodall/markedapp-solarized">created a style</a> inspired by the great <a href="http://ethanschoonover.com/solarized">solarized</a> color palette.</p>
<h2 id="wikis">Wikis</h2>
<p>Anyway, Commonplace got me thinking of serving markdown files, and more generally in wikis. I have hated almost every wiki that I have ever tried: <a href="https://www.mediawiki.org/wiki/MediaWiki">MediaWiki</a>, <a href="https://www.dokuwiki.org/dokuwiki">DokuWiki</a>, and the rest that I have played with. (Ward Cunningham has a list of <a href="http://c2.com/cgi/wiki?TopTenWikiEngines">popular wiki engines</a> that is a good starting point for finding wikis).</p>
<h2 id="golum">Golum</h2>
<p>This brings me to <a href="https://github.com/github/gollum">gollum</a>, a wiki built on top of <a href="http://git-scm.com/">Git</a> from <a href="https://github.com/">github</a>. It is the same engine that powers github project wiki pages. It supports lots of different formats for source files, including markdown, mediawiki, org mode, and textile. It is easily customizable with simple files for a sidebar, header and footer. Syntax highlighting is included via <a href="http://pygments.org/">Pygments</a>;  mathematical equations via <a href="http://docs.mathjax.org/en/latest/index.html">Mathjax</a>. Installation is surprisingly easy, via <a href="https://rubygems.org/">RubyGems</a>:</p>
<figure class="highlight"><pre><code class="language-bash" data-lang="bash">    gem <span class="nb">install </span>gollum</code></pre></figure>
<p>There is a built in web editor, but we prefer to use git for all our edits. This provides a history of who is editing the files, and at one point we had a git corruption issue when editing from the web server itself (although I suspect this has been fixed). Since our team uses git regularly for all our source code, everyone is already familiar with the workflow, and I much prefer to edit markdown files in TextMate, while other members of our team use <a href="http://orgmode.org/">org mode</a> with Emacs. Having a wiki where all editing is done locally, rather than through a web interface, while using any format you want is actually pretty awesome. We have taken care to keep things organized in a structured hierarchy, so navigating the wiki from the terminal is easy, and there is a built-in search in the web interface. Although not perfect, it is the best wiki I have used. Thanks github, for making me not hate wikis any more.</p>]]></content><author><name>johnrgoodall</name></author><category term="git" /><category term="github" /><category term="tools" /><summary type="html"><![CDATA[I just noticed, via onethingwell, a new tool called Commonplace that acts as a server for your markdown files, basically providing pretty markdown rendering and basic editing functionality. Kind of like a wiki. I use marked for viewing markdown files. marked a great mac app developed by Brett Terpestra, creator of nvAlt, a Notational Velocity fork. From TextMate 2, or from other common text editors, you can install a bundle to integrate easily with marked, and you can add your own custom styles for viewing the markdown. I created a style inspired by the great solarized color palette.]]></summary></entry><entry><title type="html">Keep gh-pages in sync with master</title><link href="https://jgoodall.me/2012/10/26/keep-gh-pages-in-sync-with-master.html" rel="alternate" type="text/html" title="Keep gh-pages in sync with master" /><published>2012-10-26T00:00:00+00:00</published><updated>2012-10-26T00:00:00+00:00</updated><id>https://jgoodall.me/2012/10/26/keep-gh-pages-in-sync-with-master</id><content type="html" xml:base="https://jgoodall.me/2012/10/26/keep-gh-pages-in-sync-with-master.html"><![CDATA[<p>I wanted to add the source for a web site to the <code>master</code> branch of a <a href="http://ornl-visual-analytics.github.com/stucco-data/">project</a>, build static html from that, and keep those changes in sync with the <code>gh-pages</code> branch to automatically deploy to <a href="http://pages.github.com/">github pages</a> on each commit.</p>
<p>Here are the steps to set this up. This assumes you dont have a gh-pages branch already (if you do, <a href="http://stackoverflow.com/questions/2003505/how-do-i-delete-a-git-branch-both-locally-and-in-github">delete it</a>). I was using the <code>deploy</code> directory in <code>master</code> branch as the source for the <code>gh-pages</code> branch, so modify that directory as needed. Here are the steps (you should be in the root of your project when you start this sequence):</p>
<figure class="highlight"><pre><code class="language-bash" data-lang="bash">    git checkout <span class="nt">-b</span> gh-pages
    <span class="nb">ls</span> | <span class="nb">grep</span> <span class="nt">-v</span> deploy | xargs <span class="nb">rm</span> <span class="nt">-rf</span>
    git <span class="nb">mv </span>deploy/<span class="k">*</span> <span class="nb">.</span>
    <span class="nb">rmdir </span>deploy
    git add <span class="nb">.</span>
    git ls-files <span class="nt">--deleted</span> | <span class="k">while </span><span class="nb">read </span>FILE<span class="p">;</span> <span class="k">do </span>git <span class="nb">rm</span> <span class="s2">"</span><span class="nv">$FILE</span><span class="s2">"</span><span class="p">;</span> <span class="k">done
    </span>git commit <span class="nt">-a</span> <span class="nt">-m</span> <span class="s2">"Initial commit in pages branch"</span>
    git push origin master gh-pages
    git checkout master</code></pre></figure>
<p><em>Update: you may have to do <code>git mv -k deploy/* .</code> if you have empty directories in your <code>deploy</code> directory</em></p>
<p>First, this creates and checks out the new <code>gh-pages</code> branch. Then remove all of the directories and files except the directory containing the web site (i.e. <code>deploy</code>). Move those files into the root directory and commit. Push the changes and go back to master.</p>
<p>Now, when you edit the files in <code>master</code>, you can merge them into the <code>gh-pages</code> branch by doing this (you should be in the root of your project when you start this sequence):</p>
<figure class="highlight"><pre><code class="language-bash" data-lang="bash">    git checkout gh-pages
    git merge <span class="nt">-s</span> subtree master
    git push origin master gh-pages</code></pre></figure>
<p>This will <a href="http://schacon.github.com/git/git-checkout.html">checkout</a> the <code>gh-pages</code> branch, <a href="http://schacon.github.com/git/git-merge.html">merge</a> using the subtree strategy, then <a href="http://schacon.github.com/git/git-push.html">push</a> both back to the <code>origin</code> remote repository.</p>
<h2 id="git-hooks">Git hooks</h2>
<p>Since we dont want to do all that every time, we can automate the process using <a href="http://git-scm.com/book/en/Customizing-Git-Git-Hooks">git hooks</a> in the <code>master</code> branch, so that the workflow is:</p>
<ol>
<li>edit a file in <code>master</code></li>
<li>add and commit the changes</li>
<li><code>git push --all</code></li>
</ol>
<p>A simple git pre-commit hook that uses <a href="http://gruntjs.com/">grunt</a> builds the static web site:</p>
<figure class="highlight"><pre><code class="language-bash" data-lang="bash">    <span class="c">#!/bin/sh</span>
    ./node_modules/.bin/grunt
    git add deploy</code></pre></figure>
<p>The git post-commit hook will merge the changes with the gh-pages branch for deployment on <a href="http://pages.github.com/">github pages</a>:</p>
<figure class="highlight"><pre><code class="language-bash" data-lang="bash">    <span class="c">#!/bin/sh</span>
    git checkout gh-pages
    git merge <span class="nt">-s</span> subtree master
    git checkout master</code></pre></figure>
<p>To use the hooks, create them in your project root and then create the symlinks:</p>
<figure class="highlight"><pre><code class="language-bash" data-lang="bash">    <span class="nb">ln</span> <span class="nt">-s</span> ../../pre-commit.sh .git/hooks/pre-commit
    <span class="nb">ln</span> <span class="nt">-s</span> ../../post-commit.sh .git/hooks/post-commit</code></pre></figure>
<p>Now, every time you do a <code>git push --all</code> in the <code>master</code> branch, the hooks will first build the static site and add the deploy directory to the commit, then will merge the changes to the <code>gh-pages</code> branch.</p>
<h2 id="references">References</h2>
<ul>
<li>
<p><a href="http://lea.verou.me/2011/10/easily-keep-gh-pages-in-sync-with-master/">Easily keep gh-pages in sync with master</a></p>
</li>
<li>
<p><a href="http://oli.jp/2011/github-pages-workflow/">GitHub Pages Workflow and deleting git’s master branch</a></p>
</li>
<li>
<p><a href="http://rafeca.com/2012/01/17/automate-your-release-flow/">Automate your release flow</a></p>
</li>
<li>
<p><a href="http://nicolasgallagher.com/git-checkout-specific-files-from-another-branch/">Quick tip: git checkout specific files from another branch</a></p>
</li>
</ul>]]></content><author><name>johnrgoodall</name></author><category term="git" /><category term="github" /><summary type="html"><![CDATA[I wanted to add the source for a web site to the master branch of a project, build static html from that, and keep those changes in sync with the gh-pages branch to automatically deploy to github pages on each commit.]]></summary></entry><entry><title type="html">Tako web framework</title><link href="https://jgoodall.me/2012/09/20/tako-web-framework.html" rel="alternate" type="text/html" title="Tako web framework" /><published>2012-09-20T00:00:00+00:00</published><updated>2012-09-20T00:00:00+00:00</updated><id>https://jgoodall.me/2012/09/20/tako-web-framework</id><content type="html" xml:base="https://jgoodall.me/2012/09/20/tako-web-framework.html"><![CDATA[<p>There are a bunch of <a href="http://nodejs.org/">node.js</a> web frameworks. They provide support for routing, templating, and  <a href="http://expressjs.com/">Express</a> is probably the most common and mature. It uses <a href="http://www.senchalabs.org/connect/">Connect</a> for its middleware component. It is pretty awesome, with lots of middleware available (try <code>npm search connect-</code> and <code>npm search express-</code>). It has been around for a while, is probably the most heavily used, and is under current development. It is flexible in terms of the <a href="http://expressjs.com/guide.html#template-engines">template engines</a> that you use, but using <a href="">jade</a>, which makes writing html not suck nearly as much as usual, is installed by default. (There is also another library, <a href="https://github.com/visionmedia/consolidate.js">consolidate</a>, from the same <a href="http://tjholowaychuk.com/">ridiculously prolific developer</a> of express and jade for hooking into a whole bunch of other template engines in express.)</p>
<p>There are other frameworks out there too:</p>
<ul>
<li>
<p><a href="http://geddyjs.org/">Geddy</a> is a monolithic solution from the folks at <a href="http://yammer.com/">yammer</a>.</p>
</li>
<li>
<p><a href="http://flatironjs.org/">Flatiron</a>, from the awesome folks at <a href="http://nodejitsu.com/">nodejitsu</a>, is a bunch of small libraries that can be composed to make web or CLI apps. Pretty cool that you can use the same components to build both web and CLI apps. I've used their logger, <a href="http://flatironjs.org/#logging">winston</a>, before and it just works.</p>
</li>
<li>
<p><a href="http://mcavage.github.com/node-restify/">Restify</a> is a libray with a similar feel to express for building RESTful APIs.</p>
</li>
<li>
<p><a href="http://kilianc.github.com/node-apiserver/">ApiServer</a> is a	another library for building an API server.</p>
</li>
</ul>
<p>A recent <a href="http://nodeup.com/fourteen">nodeup</a> podcast covered some of these. Frankly, I dont have time to try them all, and dont have any real complaints with express. All the same, I decided to give <a href="https://github.com/mikeal/tako">tako</a> a few hours and see what it was all about.</p>
<h2 id="tako">Tako</h2>
<p><a href="http://www.mikealrogers.com/">Mikeal Rogers</a>, <a href="https://twitter.com/#!/mikeal">@mikeal</a>, and <a href="http://www.maxogden.com/">Max Ogden</a>, <a href="https://twitter.com/#!/maxogden">@maxogden</a>, recently released a <a href="http://www.mikealrogers.com/posts/open-source.html">bunch of open source libraries for node</a>. One of these projects is a web framework, called <a href="https://github.com/mikeal/tako">tako</a>. It is really small, a single 24k file (compared to express, which looks like it is ~96k based on the files in lib). It is simple by design. From the author:</p>
<blockquote>
<p>tako includes all the features we needed from a web framework to build our app. It’s not a middleware or plugin system and doesn’t include one. It’s a tool for handling HTTP requests in a sensible way.</p>
</blockquote>
<blockquote>
<p>It has a composable API around routes. A route is an object and based on what kinds of handlers you add and conditions you might set tako can respond properly to various HTTP methods and content-type requests in an appropriate manner.</p>
</blockquote>
<blockquote>
<p>It can also serve files sensibly using filed which already streams and returns/responds to proper etag and if-modified headers.</p>
</blockquote>
<blockquote>
<p>It already includes socket.io. It includes JSON support. It can serve buffers from cache.</p>
</blockquote>
<p>The first thing you notice is that there is not a lot of documentation, basically just a minimal readme. The next thing is that it is pretty straightforward to get started. Here is a simple example for a single page app:</p>
<figure class="highlight"><pre><code class="language-javascript" data-lang="javascript">    <span class="kd">var</span> <span class="nx">fs</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="dl">'</span><span class="s1">fs</span><span class="dl">'</span><span class="p">)</span>
      <span class="p">,</span> <span class="nx">path</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="dl">'</span><span class="s1">path</span><span class="dl">'</span><span class="p">)</span>
      <span class="p">,</span> <span class="nx">tako</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="dl">'</span><span class="s1">tako</span><span class="dl">'</span><span class="p">)</span>
      <span class="p">,</span> <span class="nx">gzip</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="dl">'</span><span class="s1">tako-gzip</span><span class="dl">'</span><span class="p">)</span>

    <span class="c1">// global variables</span>
    <span class="kd">var</span> <span class="nx">app</span> <span class="o">=</span> <span class="nx">tako</span><span class="p">()</span>
      <span class="p">,</span> <span class="nx">indexHtml</span> <span class="o">=</span> <span class="nx">fs</span><span class="p">.</span><span class="nx">readFileSync</span><span class="p">(</span><span class="nx">path</span><span class="p">.</span><span class="nx">join</span><span class="p">(</span><span class="nx">__dirname</span><span class="p">,</span> <span class="dl">'</span><span class="s1">./html/index.html</span><span class="dl">'</span><span class="p">)).</span><span class="nx">toString</span><span class="p">()</span>
      <span class="p">,</span> <span class="nx">notfoundHtml</span> <span class="o">=</span> <span class="nx">fs</span><span class="p">.</span><span class="nx">readFileSync</span><span class="p">(</span><span class="nx">path</span><span class="p">.</span><span class="nx">join</span><span class="p">(</span><span class="nx">__dirname</span><span class="p">,</span> <span class="dl">'</span><span class="s1">./html/notfound.html</span><span class="dl">'</span><span class="p">)).</span><span class="nx">toString</span><span class="p">()</span>

    <span class="c1">// static files</span>
    <span class="nx">app</span><span class="p">.</span><span class="nx">route</span><span class="p">(</span><span class="dl">'</span><span class="s1">/public/*</span><span class="dl">'</span><span class="p">).</span><span class="nx">files</span><span class="p">(</span><span class="nx">path</span><span class="p">.</span><span class="nx">join</span><span class="p">(</span><span class="nx">__dirname</span><span class="p">,</span> <span class="dl">'</span><span class="s1">./public</span><span class="dl">'</span><span class="p">))</span>

    <span class="c1">// routes</span>
    <span class="nx">app</span><span class="p">.</span><span class="nx">route</span><span class="p">(</span><span class="dl">'</span><span class="s1">/</span><span class="dl">'</span><span class="p">)</span>
      <span class="p">.</span><span class="nx">html</span><span class="p">(</span><span class="nx">renderIndex</span><span class="p">)</span>
      <span class="p">.</span><span class="nx">methods</span><span class="p">(</span><span class="dl">'</span><span class="s1">GET</span><span class="dl">'</span><span class="p">)</span>

    <span class="c1">// page not found</span>
    <span class="nx">app</span><span class="p">.</span><span class="nx">notfound</span><span class="p">(</span><span class="nx">notfoundHtml</span><span class="p">)</span>

    <span class="c1">// listen</span>
    <span class="nx">app</span><span class="p">.</span><span class="nx">httpServer</span><span class="p">.</span><span class="nx">listen</span><span class="p">(</span><span class="mi">8000</span><span class="p">)</span>

    <span class="c1">// just render the html</span>
    <span class="kd">function</span> <span class="nx">renderIndex</span><span class="p">(</span><span class="nx">req</span><span class="p">,</span> <span class="nx">res</span><span class="p">)</span> <span class="p">{</span>
      <span class="nx">res</span><span class="p">.</span><span class="nx">end</span><span class="p">(</span><span class="nx">indexHtml</span><span class="p">)</span>
    <span class="p">}</span></code></pre></figure>
<p>All it does is serve an index file and the static assets. I am using <a href="https://github.com/cowboy/grunt/">grunt</a> to compile <a href="https://github.com/gruntjs/grunt-contrib/blob/master/docs/jade.md">jade templates</a> into html, <a href="https://github.com/cowboy/grunt/blob/master/docs/task_concat.md">combine</a> and <a href="https://github.com/cowboy/grunt/blob/master/docs/task_min.md">uglify</a> javascript files, and combine and <a href="https://github.com/gruntjs/grunt-contrib/blob/master/docs/mincss.md">minify css</a> files. So the web server is only serving static files. There is also an html file for 404 errors.</p>
<h2 id="socketio">Socket.io</h2>
<p>Tako includes <a href="http://socket.io/">socket.io</a>. To use it:</p>
<figure class="highlight"><pre><code class="language-javascript" data-lang="javascript">    <span class="nx">app</span><span class="p">.</span><span class="nx">sockets</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="dl">'</span><span class="s1">connection</span><span class="dl">'</span><span class="p">,</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">socket</span><span class="p">)</span> <span class="p">{</span>
      <span class="nx">socket</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="dl">'</span><span class="s1">connect</span><span class="dl">'</span><span class="p">,</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
        <span class="nx">app</span><span class="p">.</span><span class="nx">sockets</span><span class="p">.</span><span class="nx">emit</span><span class="p">(</span><span class="dl">'</span><span class="s1">user connected</span><span class="dl">'</span><span class="p">)</span> <span class="c1">// broadcast</span>
      <span class="p">})</span>
      <span class="nx">socket</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="dl">'</span><span class="s1">disconnect</span><span class="dl">'</span><span class="p">,</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
        <span class="nx">app</span><span class="p">.</span><span class="nx">sockets</span><span class="p">.</span><span class="nx">emit</span><span class="p">(</span><span class="dl">'</span><span class="s1">user disconnected</span><span class="dl">'</span><span class="p">)</span> <span class="c1">// broadcast</span>
      <span class="p">})</span>
    <span class="p">})</span></code></pre></figure>
<p>One thing that took me a few minutes to figure out is how to get to the socket.io settings. I think there are two ways:</p>
<ol>
<li>when you instantiate tako: <code>app = tako({'socketio':{'log level':2}})</code></li>
<li>using socket.io <a href="https://github.com/LearnBoost/socket.io/blob/master/lib/manager.js">Manager</a>: <code>app.socketioManager.set('log level', 2)</code></li>
</ol>
<p>Obviously, you can do more than change the log level, see <a href="https://github.com/LearnBoost/Socket.IO/wiki/Configuring-Socket.IO">more configuration options</a>.</p>
<h2 id="plugins">Plugins?</h2>
<p>Tako does not support plugins. But there seems to be some plugins.</p>
<figure class="highlight"><pre><code class="language-bash" data-lang="bash">    npm search tako-
    NAME                DESCRIPTION                   AUTHOR   DATE              KEY
    tako-cookies        A cookie middleware <span class="k">for </span>tako  <span class="o">=</span>isaacs  2012-04-20 19:23
    tako-gzip           <span class="nb">gzip </span><span class="k">for </span>tako                 <span class="o">=</span>kesla   2012-04-29 22:17
    tako-session-token  session tokens <span class="k">for </span>tako       <span class="o">=</span>isaacs  2012-04-20 19:47</code></pre></figure>
<p>Author <a href="http://blog.izs.me/">isaacs</a> wrote <a href="http://npmjs.org/">npm</a> and modules like <a href="https://github.com/isaacs/node-supervisor">supervisor</a> and inherited 'dictatorship' of node itself from Ryah Dhal, node's creator. I dont know why he is he using tako, but that is a good sign right?</p>
<p>So back to plugins, the gzip one is pretty straightforward:</p>
<figure class="highlight"><pre><code class="language-javascript" data-lang="javascript">    <span class="kd">var</span> <span class="nx">gzip</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="dl">'</span><span class="s1">tako-gzip</span><span class="dl">'</span><span class="p">)</span>
    <span class="nx">app</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="dl">'</span><span class="s1">request</span><span class="dl">'</span><span class="p">,</span> <span class="nx">gzip</span><span class="p">)</span></code></pre></figure>
<p>Not sure why you <strong>wouldn't</strong> want to do that...</p>
<p>If you listen to the [Nodeup podcast]((<a href="http://nodeup.com/">http://nodeup.com/</a>) or read the <a href="(http://www.mikealrogers.com/),">author's writings</a>, you know he is a crazy smart, thoughtful, and opinionated developer. I want to use this framework, but I am not a good enough node.js developer to be able to figure out everything it is doing. So I think it is a nice framework, but needs a lot of help getting the same level of documentation as other, more mature projects like express. If I need to put together something quick and relatively straightforward, then I love this, but for larger projects, I am sticking with Express until the documentation for this one gets a bit better. My hunch is that I am not the target audience and this is made for people that are going to dig into the source code and figure out exactly how it is working, but then again, if you are going to do that, then do you really need a web framework?</p>]]></content><author><name>johnrgoodall</name></author><category term="nodejs" /><summary type="html"><![CDATA[There are a bunch of node.js web frameworks. They provide support for routing, templating, and Express is probably the most common and mature. It uses Connect for its middleware component. It is pretty awesome, with lots of middleware available (try npm search connect- and npm search express-). It has been around for a while, is probably the most heavily used, and is under current development. It is flexible in terms of the template engines that you use, but using jade, which makes writing html not suck nearly as much as usual, is installed by default. (There is also another library, consolidate, from the same ridiculously prolific developer of express and jade for hooking into a whole bunch of other template engines in express.)]]></summary></entry><entry><title type="html">What data visualization is not</title><link href="https://jgoodall.me/2012/03/25/wijmo.html" rel="alternate" type="text/html" title="What data visualization is not" /><published>2012-03-25T00:00:00+00:00</published><updated>2012-03-25T00:00:00+00:00</updated><id>https://jgoodall.me/2012/03/25/wijmo</id><content type="html" xml:base="https://jgoodall.me/2012/03/25/wijmo.html"><![CDATA[<p><a href="http://wijmo.com/">Wijmo</a> is a company I had never heard of that creates libraries for building user interfaces in <a href="http://www.html5rocks.com/en/">HTML5</a> and <a href="http://jquery.com/">Jquery</a>. Some of their widgets are <a href="https://github.com/wijmo/Wijmo-Open">open source</a>, some are <a href="https://wijmo.com/purchase/">commercial</a>.</p>
<blockquote>
<p>Wijmo is a complete kit of over 40 UI widgets with everything from interactive menus to rich charts.</p>
</blockquote>
<p>Great, another clone of <a href="http://jqueryui.com/">JqueryUI</a>. I bring it up because <a href="http://twitter.com/b4nn0n">Chris Bannon</a>, manager at Wijmo was on a <a href="http://javascriptjabber.com/013-jsj-svg-and-data-visualization-with-chris-bannon/">recent episode</a> or <a href="http://javascriptjabber.com/">javascript jabber</a>, a very good podcast on javascript. He was on the show to discuss 'data visualization', and being as that is what I do, I was interested to hear what he had to say. My take, this is someone who is probably an excellent developer, but someone who does not really know what 'data visualization' means.</p>
<p>There are <a href="http://www.infovis-wiki.net/index.php?title=Information_Visualization">lots of definitions</a> for <strong>information visualization</strong>, as data visualization is more commonly called. The canonical definition is (Stuart Card):</p>
<blockquote>
<p>The use of computer-supported, interactive, visual representations of abstract data to amplify cognition.</p>
</blockquote>
<p>More succinctly (Ben Shneiderman):</p>
<blockquote>
<p>The purpose of visualization is insight, not pictures.</p>
</blockquote>
<p>So the guest started off talking about <a href="http://www.w3.org/Graphics/SVG/">SVG</a>, their use of HTML5 and <a href="http://raphaeljs.com/">Raphael</a>, the need to understand <a href="http://www.w3.org/TR/2009/WD-SVG-Transforms-20090320/">transformations</a>, and <a href="http://knockoutjs.com/">data bindings</a>. All good.</p>
<p>Then he started talking about 'gauges', and I cringed a little bit. Here is a typical <a href="http://lsdemo.componentone.com/sales/">dashboard</a> from the <a href="http://wijmo.com/demos/">wijmo demo page</a>. Yikes. That is a whole lot of screen space for very little information. Maybe no one told them that a <strong>table</strong> is a pretty effective means of communicating a few numbers? I assume he has read his <a href="http://www.edwardtufte.com/tufte/books_vdqi">Tufte</a>, since he referenced the Challenger example Tufte always talks about. (Notwithstanding, that Tufte actually got this often cited example <a href="http://eagereyes.org/criticism/tufte-and-the-truth-about-the-challenger">wrong</a>.) But he probably hasn't read his <a href="http://perceptualedge.com/">Stephen Few</a>, and his insightful rants on poor dashboard design, <a href="http://www.perceptualedge.com/blog/?p=102">gauges</a>, and the <a href="http://www.perceptualedge.com/blog/?p=1161">misinterpretation of data visualization</a>. I love bar charts and scatterplots, but why is a 'data visualization' company perpetuating the use of gauges (it shows a single number - just show the number! or use a <a href="http://mbostock.github.com/d3/ex/bullet.html">bullet chart</a> to add some context in a small space) and <a href="http://eagereyes.org/techniques/pie-charts">pie charts</a>?</p>
<p>Most of the most useful (and coolest) stuff in information visualization is coming from academia and research organizations, and increasingly from data journalists. Why are vendors not getting it? There are some exceptions, most notably <a href="http://www.tableausoftware.com/">Tableau</a>, but there are even widget makers that seem to know a little about visualization, such as <a href="http://www.panopticon.com/">Panopticon</a>. There are open source projects for creating rich, interactive visualization, such as Raphael and the increasingly popular <a href="http://d3js.org/">d3</a>. Look at the <a href="https://github.com/mbostock/d3/wiki/Gallery">d3 examples</a> for lots of interesting things people are doing with interactive visualization.</p>
<p>And finally, he said something to the effect of 'the best creators of visualizations are developers'. No. That is wrong. I have worked with a lot of excellent developers, but they think like engineers and have no training in information visualization design. InfoVis designers are the creators. They design meaningful visualizations that can facilitate new insights into complex phenomenon. Check out any one of a number of visualizations from the New York Times graphics department, such as: <a href="https://www.nytimes.com/interactive/2012/05/17/business/dealbook/how-the-facebook-offering-compares.html">Facebook IPO</a>, <a href="https://www.nytimes.com/interactive/2012/02/13/us/politics/2013-budget-proposal-graphic.html">Obama's 2013 budget proposal</a>, or the <a href="http://www.nytimes.com/interactive/2009/03/01/business/20090301_WageGap.html">gap in wages between the sexes</a>. Engineers create <a href="http://baddesigns.com/">bad designs</a> all the time, because they are not interaction or visualization designers! Same reason that architects and engineers work together to build a skyscraper. Wijmo, your heart is in the right place, but if you want to claim to be a company that does data visualization, then hire someone who knows about data visualization!</p>]]></content><author><name>johnrgoodall</name></author><category term="javascript" /><category term="infovis" /><summary type="html"><![CDATA[Wijmo is a company I had never heard of that creates libraries for building user interfaces in HTML5 and Jquery. Some of their widgets are open source, some are commercial.]]></summary></entry><entry><title type="html">Javascript statistics libraries</title><link href="https://jgoodall.me/2012/02/01/javascript-statistical-libraries.html" rel="alternate" type="text/html" title="Javascript statistics libraries" /><published>2012-02-01T00:00:00+00:00</published><updated>2012-02-01T00:00:00+00:00</updated><id>https://jgoodall.me/2012/02/01/javascript-statistical-libraries</id><content type="html" xml:base="https://jgoodall.me/2012/02/01/javascript-statistical-libraries.html"><![CDATA[<p>There are a bunch of javascript statistics libraries for <a href="http://nodejs.org/">node.js</a> and the browser around, but they arent always easy to find. Here are a couple that I have come across.</p>
<h2 id="gauss">Gauss</h2>
<p><a href="https://github.com/stackd/gauss">Gauss</a>, from <a href="https://github.com/stackd">Stackd</a>, is a JavaScript statistics library that is ready to use with node.js featuring callbacks and method chaining. It seems to be actively updated. Gauss has methods for univariate and time series analysis (although the time series seems pretty limited so far).</p>
<blockquote>
<p>Evented, asynchronous, and fast, Node.JS is an attractive platform for data mining, statistics, and data analysis. Gauss makes it easy to calculate and explore data through JavaScript.</p>
</blockquote>
<p><a href="https://github.com/stackd/gauss">Github Download</a></p>
<p><a href="http://search.npmjs.org/#/gauss">npm</a> install</p>
<figure class="highlight"><pre><code class="language-bash" data-lang="bash">    npm <span class="nb">install </span>gauss</code></pre></figure>
<h2 id="sylvester">Sylvester</h2>
<p><a href="http://sylvester.jcoglan.com/">Sylvester</a> is a Javascript library by <a href="http://blog.jcoglan.com/">James Coglan</a> for math on vectors and matrices. Hard to tell if it is updated, since the source doesn't seem to be on github or some other public repository. Chris Umbel has created <a href="http://search.npmjs.org/#/sylvester">a node.js port</a>.</p>
<blockquote>
<p>Sylvester is a JavaScript library designed to let you do mathematics with vectors and matrices without having to write lots of loops and throw piles of arrays around. It includes classes for modelling vectors and matrices in any number of dimensions, and for modelling infinite lines and planes in 3-dimensional space. It lets you write object-oriented easy-to-read code that mirrors the maths it represents.</p>
</blockquote>
<blockquote>
<p>Later releases will add components for more specific geometric modelling functionality, building towards a feature-complete 1.0 release.</p>
</blockquote>
<p><a href="http://sylvester.jcoglan.com/#download">Download</a></p>
<p><a href="http://search.npmjs.org/#/sylvester">npm</a> install</p>
<figure class="highlight"><pre><code class="language-bash" data-lang="bash">    npm <span class="nb">install </span>sylvester</code></pre></figure>
<h2 id="jstat">JStat</h2>
<p><a href="http://www.jstat.org/">JStat</a> is a Javascript statistical library intended for use in the browser. It optionally includes <a href="http://jquery.com/">jQuery</a>, <a href="http://jqueryui.com/">jQuery UI</a> and <a href="https://code.google.com/p/flot/">flot</a> for building plots. It seems to be actively updated, but has no real documentation yet.</p>
<p>There is a github repo, but it is hard to tell if it is up to date, given this note on the github page: <em>The code in this repository does not currently match that found on <a href="http://www.jstat.org">www.jstat.org</a>. We are in the process of merging two similar projects and will update the website once the merge is complete.</em></p>
<blockquote>
<p>jStat is a statistical library written in JavaScript that allows you to perform advanced statistical operations without the need of a dedicated statistical language (i.e. MATLAB or R).</p>
</blockquote>
<p><a href="http://www.jstat.org/download">Download</a></p>
<p><a href="https://github.com/jstat/jstat">Github Download</a></p>
<h2 id="sciencejs">Science.js</h2>
<p><a href="https://github.com/jasondavies/science.js">Science.js</a> is a new statistics library from <a href="http://www.jasondavies.com/">Jason Davies</a> originally intended for use with <a href="http://mbostock.github.com/d3/">d3.js</a>, the excellent visualization library for javascript. It has methods for statistics and linear algebra. It is a new project, <a href="http://www.sciencejs.org/">coming soon</a> on the home page, that seems pretty actively updated. No npm/node.js integration (yet?).</p>
<blockquote>
<p>Science.js is a JavaScript library for scientific and statistical computing.</p>
</blockquote>
<blockquote>
<p>Currently, there are two modules:</p>
</blockquote>
<blockquote>
<ul>
<li>science.stats, containing various implementations of statistical methods similar to those provided by R;</li>
</ul>
</blockquote>
<blockquote>
<ul>
<li>science.lin, for linear algebra.</li>
</ul>
</blockquote>
<p><a href="https://github.com/jasondavies/science.js">Github download</a></p>]]></content><author><name>johnrgoodall</name></author><category term="javascript" /><category term="statistics" /><summary type="html"><![CDATA[There are a bunch of javascript statistics libraries for node.js and the browser around, but they arent always easy to find. Here are a couple that I have come across.]]></summary></entry></feed>