---
layout: default
title: Home
---

<section class="home-page page-header">
  <div class="container">
    <div class="row">
      <div class="span8 offset4">
        <h1>
          <img src="images/logo.png" width="455" height="190" alt="Recline Data Explorer and Library">
        </h1>
        <div class="inner">
          <ol style="list-style-type:upper-latin;">
            <li>Powerful data explorer built in pure javascript and html</li>
            <li>A library of data components - grid, graphing and data connectors</li>
          </ol>
          &mdash; All built with <a href="http://backbonejs.org/" class="dotted">Backbone</a>
        </div>
        <div class="inner">
          <a class="btn btn-large btn-explorer showtitle" href="app/" title="the data explorer"><i class="icon-graph icon-white icon-large"></i>Use the Explorer</a>
          <a class="btn btn-large btn-library showtitle" href="library.html" title="the data library"><i class="icon-arrow-down icon-white icon-large"></i>Use the Library</a>
        </div>
      </div>
    </div>
  </div>
</section>
<section class="grey">
	<div class="container">
    <div class="row">
      <div class="span12">
        <h2>Recline is Two Things</h2>
      </div>
    </div>
    <div class="row">
      <div class="span6">
        <ul>
          <li>A Data Explorer combining a data grid, Google Refine-style data
          transforms and visualizations all in lightweight javascript and html.</li>
          <li>A simple but powerful library of extensible of data components - data
          grid, graphing, and data connectors - which you can selectively use and build
          on.</li>
        </ul>
			</div>
      <div class="span6">
        <p>The Explorer can be used standalone (just download and use) or can be
        embedded into your own site. Recline builds on the powerful but lightweight
        Backbone framework making it extremely easy to extend and adapt. The library's
        modular design mean means you only have to take what you need.</p>
      </div>
    </div>
    <div class="row">
      <div class="span4">
        <h2 id="features">Main Features</h2>
        <ul>
          <li>View and edit your data in a clean grid / table interface</li>
          <li>Bulk update/clean your data using an easy scripting UI</li>
          <li>Easily extensible with new Backends so you can connect to your
          database or storage layer</li>
          <li>Visualize data</li>
          <li>Open-source, pure javascript and designed for integration -- so it is
          easy to embed in other sites and applications</li>
          <li>Built on the simple but powerful <a
            href="http://documentcloud.github.com/backbone/">Backbone</a> giving a
          clean and robust design which is easy to extend</li>
          <li>Properly designed model with clean separation of data and presentation</li>
          <li>Componentized design means you use only what you need</li>
        </ul>
      </div>
      <div class="span8">
        <a href="app/"><img src="images/screenshot-1.jpg" width="632" height="428" alt="Recline Data Explorer Screenshot"></a>
      </div>
    </div>
  </div>
</section>

<section>
  <div class="container">
    <div class="row">
      <div class="span12">
        <h2 id="history">History</h2>
      </div>
    </div>
    <div class="row">
      <div class="span6">
        <p>Max Ogden was developing Recline as the frontend data browser and editor for
        his <a href="http://datacouch.com/">http://datacouch.com/</a> project.
        Meanwhile, Rufus Pollock and the <a href="http://ckan.org/">CKAN team</a> at
        the <a href="http://okfn.org/">Open Knowledge Foundation</a> had been working
        on a <a href="http://github.com/okfn/dataexplorer">Data Explorer</a> for use in
        <a href="http://thedatahub.org">the DataHub</a> and <a
          href="http://ckan.org/">CKAN software</a>.</p>
        
        <p>When they met up, they realized that they were pretty much working on the
        same thing and so decided to join forces to produce the new Recline Data
        Explorer.</p>
      </div>
      <div class="span6">
        <p>The new project forked off <a
          href="https://github.com/maxogden/recline">Max's original recline
          codebase</a> combining some portions of the <a
          href="http://github.com/okfn/dataexplorer">original Data Explorer</a>.
        However, it has been rewritten from the ground up using Backbone.</p>
      </div>
    </div>
  </div>
</section>