This is a Mustache + JSON listing that displays a full listing of Backend as a Service (BaaS) providers.

gistfile1.txt

<style>
    .baaslistingcontainer{
        padding-left: 10px; 
        padding-right: 10px; 
        width:550px;
    }
    .baaslisting{
        padding-left: 30px;
    }  
    .baaslisting li{
        list-style: none; 
        padding: 30px; 
        border: 0px solid #000;
    }       
</style>

<!--Data, API and Script Toolbar--->
<ul class="toolbar">
    <li>{"<a href="https://raw.github.com/kinlane/backend-as-a-service/gh-pages/data/companies.json" title="JSON" target="_blank">JSON</a>"}</li>
    <li>{"<a href="https://apievangelist.3scale.net/docs" title="API" target="_blank">API</a>"}</li>
    <li>{"<a href="https://gist.github.com/kinlane/5992075" title="Script" target="_blank">SCRIPT</a>"}</li>
</ul>

<h1>BaaS Providers</h1>

<!--BaaS Full Listing Template--->
{% raw  %}
<script id="companyListingTemplate" type="text/template">       
    <li>
        <a href="companies-detail.html?id={{id}}"><img src="{{logo}}" width="200" align="left" style="padding: 15px;" /></a>
        <a href="companies-detail.html?id={{id}}" style="color: #000;"><strong>{{name}}</strong></a> - {{summary}}... <a href="companies-detail.html?id={{id}}">details</a>.
    </li>                                                                                               
</script>
{% endraw %}

<!--BaaS Full Listing Container--->
<div class="baaslistingcontainter">
     <ul id="companyListing" class="baaslisting"></ul>
</div>  

<!--BaaS Full Listing JavaScript--->
<script type="text/javascript">

// Requires Mustache - http://mustache.github.io/

function listCompanies()
    {
    $.getJSON('data/companies.json', function(data) {
        toggle = 0;
         $.each(data['company'], function(key, val) {
            var template = $('#companyListingTemplate').html();
            var html = Mustache.to_html(template, val);
            $('#companyListing').append(html);                          
            });
        });
    } 
listCompanies();
</script>

<!--Trigger BaaS Full Listing JavaScript onLoad-->
<script type="text/javascript">
listCompanies();
</script>