JSFiddle - React, Tailwind, and code Playground

by Mohamed Farouk

HTML

<script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-v1.3.0.js"></script>
<script src="http://underscorejs.org/underscore.js"></script>
<script src="http://backbonejs.org/backbone.js"></script>
<h1>render template</h1>
<div id='myView'>
</div>

JavaScript

var myView = Backbone.View.extend({
    data:{first_name: "test"},
    compiledTemplate: null,
    initialize: function(){
        this.$el = $('#myView');
        this.tpl();
    },
    tpl: function(){
      var partials = '<div id="tpl-test">{{first_name}}</div>'
      var template_id = "#tpl-test",
      partials_elem = $('<div>' + partials + '</div>');
      this.compiledTemplate =  Handlebars.compile($(template_id, partials_elem).html());    
    },
    
    render: function(){
        this.$el.html(this.compiledTemplate(this.data));
    },
});

var viewObj = new myView();
viewObj.render();