title: Changing language dynamically using i18n in backbone - requirejs project
body: <p>I am trying to create an app using backbone and requirejs .
  I am trying to include internationalization in the project using i18n(requirejs amd supported plugin).</p>
  
  <p>I want to give the user the option to change the language. </p>
  
  <p>So, how to configure the i18n so that anybody can change the language according to his/her need.</p>
  
  <p>P.S. Template Engine used is Handlebars.</p>
  
  <p>Any other internationalization plugin recommended is also fine.</p>
  
  <p>Here is my project structure.</p>
  
  <ul>
  <li><p>js</p>
  
  <ul>
  <li><p>app</p>
  
  <ul>
  <li>config
  <ul>
  <li>appConfig.js </li>
  </ul></li>
  <li>init
  <ul>
  <li>App.js</li>
  <li>AppInit.js</li>
  </ul></li>
  <li><p>nls</p>
  
  <ul>
  <li>home.js (root file)</li>
  <li>fr-fr
  <ul>
  <li>home.js</li>
  </ul></li>
  </ul></li>
  <li><p>router</p>
  
  <ul>
  <li>AppRouter.js</li>
  </ul></li>
  <li>templates
  <ul>
  <li>homeTmpl.html</li>
  </ul></li>
  <li>view<br>
  <ul>
  <li>homeView.js</li>
  </ul></li>
  </ul></li>
  </ul></li>
  <li><p>lib</p></li>
  </ul>
  
  <p>Here is my index.html page with option to change the language</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;i18n test with backbone and requirejs&lt;/title&gt;
  &lt;script type="text/javascript" src="lib/jquery-2.1.3.js"&gt;&lt;/script&gt;
  &lt;script data-main="js/app/config/appConfig" type="text/javascript"
  src="lib/require.js"&gt;&lt;/script&gt;
  &lt;style&gt;
  #content{
      width: 800px;
      height: 400px;
      top:200px;
      left:100px;
      border: 3px dotted #0F0;
  }
  #lang{
      float:right;
  }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;h3&gt; Hello World , Good Morning&lt;/h3&gt;
  
  &lt;div id ="lang"&gt;
      &lt;a href="javascript:void(0);" class="lang" id="en"&gt;English&lt;/a&gt;
      &lt;a href="javascript:void(0);" class="lang" id="fr"&gt;French&lt;/a&gt;
  &lt;/div&gt;
  
  &lt;a href='#home'&gt;Home&lt;/a&gt;&lt;br/&gt;
  &lt;a href='#about'&gt;About Us&lt;/a&gt;&lt;br/&gt;
  &lt;a href='#contact'&gt;Contact&lt;/a&gt;&lt;br/&gt;
  
  &lt;div id="content"&gt;&lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>