JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.2.2/underscore-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.5.3/backbone-min.js"></script>
<!DOCTYPE html>
<html>
    <head>
        <title>Mdbrd Search</title>
    </head>
    <body>
        
        <h1>Start your Search</h1>

        <form method="post" action="#" id="search" name="mdbrdSearch" onsubmit="return false">
            <input type="text" name="search" value="" placeholder="Search&hellip;">    
        </form>

        <ul id="results">
            <div style="clear:both;"></div>
        </ul>

        <ul id="mdbrd"></ul>

        <!-- Templates -->
        <script type="text/template" id="shot-template">
            <li class="shot" data-id="<%= id %>"><img src="<%= url %>" alt=""></li>
        </script>

    </body>

    
</html>

JavaScript

(function($) {

    Shot = Backbone.Model.extend();

    window.ShotsList = Backbone.Collection.extend({
        model: Shot,
        sync: function(method, model, options) {
            console.log('sync');
            var params = _.extend({
                type: 'GET',
                dataType: 'jsonp',
                url: model.url(),
                processData: false
            }, options);

            return $.ajax(params);
        },
        parse: function(response) {
            console.log(response.shots);
            return response.shots;
        }
    });

    window.Shots = new ShotsList;

    window.ShotView = Backbone.View.extend({

        tagName: 'li',
        template: _.template($('#shot-template').html()),

        render: function() {
            console.log(this);
            $(this.el).html(this.template({
                url: this.image_teaser_url
            }));
            return this;
        }
    });

    AppView = Backbone.View.extend({

        el: $("body"),

        events: {
            "keypress #search input": "searchOnEnter"
        },
        initialize: function() {
            _.bindAll(this, 'addOne', 'addAll');
            this.input = this.$("#search input");

            Shots.bind('add', this.addOne);
            Shots.bind('reset', this.addAll);
            console.log('intialize');
        },
        searchOnEnter: function(e) {
            if (e.keyCode != 13) return;
            var searchVal = encodeURIComponent(this.input.val());
            var searchResults;
            Shots.url = function() {
                return "http://api.dribbble.com/players/" + searchVal + "/shots?per_page=18";
            }
            Shots.fetch();

        },
        addOne: function(shot) {
            console.log('addOne');
            var view = new ShotView({
                model: shot
            });
            this.$('#results').prepend(view.render().el);
        },
        addAll: function() {
           ...