title: Loading templates with backbone js
body: <p>I'm starting in javascript development, and did a simple project with node.js as a rest API and a client using backbone, everything look perfectly till I want to get my templates out of my js.</p>
  
  <p>I found different approaches, some of them with some time (like one year old) but I can't understand which one could be better:</p>
  
  <ul>
  <li><p>A .js file with a var with the html code</p>
  
  <p>pros -> easy to load, easy to pass to underscore to compile it.</p>
  
  <p>cons -> scape every single line.</p>
  
  <pre><code>app.templates.view = " \
  &lt;h3&gt;something code&lt;/h3&gt; \
  ";
  </code></pre>
  
  <p>load template:</p>
  
  <pre><code>template: _.template(app.templates.view)
  </code></pre></li>
  </ul>
  
  <p><a href="https://stackoverflow.com/questions/8366733/external-template-in-underscore">External template in Underscore</a></p>
  
  <ul>
  <li><p>Use require.js to load with text plug-in.</p>
  
  <p>pros -> load different templates as needed.</p>
  
  <p>cons -> I don't like the approach to put everything inside a "loader" function...</p>
  
  <pre><code>define(["TemplateEngine", "text!templates/template.html"], function(...
  </code></pre></li>
  </ul>
  
  <p><a href="https://stackoverflow.com/questions/7917639/requirejs-loading-modules-including-templates-and-css">RequireJS: Loading modules including templates and CSS</a></p>
  
  <ul>
  <li><p>A function that loads the templates with an AJAX petition.</p>
  
  <p>pros -> You can load the template that you need and adds local storage posibilities.</p>
  
  <p>cons -> Seems that I have to merge all my templates into one file for production environments.</p>
  
  <pre><code>function() {
  
  var templateLoader = {... $.get calls ...}   
  </code></pre></li>
  </ul>
  
  <p><a href="https://stackoverflow.com/questions/7542089/best-way-to-load-asynchronously-undescore-templates">Best way to asynchronously load underscore templates</a></p>
  
  <ul>
  <li>And a Jquery plug-in for template loading that I really liked but it seems that it didn't go to release?</li>
  </ul>
  
  <p><a href="http://api.jquery.com/jQuery.template/" rel="nofollow noreferrer">http://api.jquery.com/jQuery.template/</a></p>
  
  <p>It seems that require is the best approach, but maybe I'm missing something, I do wan't to make things as clean as possible since I'm in the learning/having fun phase :D</p>
  
  <p>Any good article or github project with a good structure or any light on this will be appreciated.</p>
  
  <p>Thanks.</p>
  
  <p>Excuse any major spelling mistake, not an English speaker :)</p>
  
  <p>--EDIT--
  found some interesting videos to understand how to start and wrap things with require.js
  <a href="http://www.youtube.com/watch?v=VGlDR1QiV3A" rel="nofollow noreferrer">http://www.youtube.com/watch?v=VGlDR1QiV3A</a></p>
  
  <p><a href="http://www.youtube.com/watch?v=M-wjQjsryMY" rel="nofollow noreferrer">http://www.youtube.com/watch?v=M-wjQjsryMY</a></p>