title: Architecture ExtJS 5 for Single page web applications
body: <p>What is the right way of Architecture ExtJS 5 for Single page web applications.</p>
  
  <ul>
  <li>Is ExtJS good for "<strong>single page web applications(SPA)</strong>"? where we don't have multiple markup pages to refer different JS files to different urls. or rather, <strong>how best we can use ExtJS in SPA?</strong>
  
  <ul>
  <li>In detail: In <em>www.domain/home.html</em> I can refer <code>tab.js</code> that will load a tab layout, then user clicks on "<strong>about us</strong>" link, that will load a <em>www.domain/about.html</em>, here I refer <code>aboutTree.js</code> that will load tree widget on left panel. This looks easy. I can create a new JS file that will have a full <strong>store, model, OnReady()</strong> as shown in <strong>sencha document</strong> <a href="http://dev.sencha.com/extjs/5.0.0/examples/tree/locking-treegrid.js" rel="nofollow noreferrer"><strong>examples</strong></a>.</li>
  </ul></li>
  <li><strong>How is Sencha ExtJS mainly used by most of its customers?</strong> as just widgets at some sections of their applications, or the whole application is drove by Sencha ExtJS?</li>
  <li><strong>Can a full web application be driven by only ExtJS?</strong> I attempted one example for <strong>Sencha Touch</strong> for a mobile site, that can navigate to new pages with a single Url (Example: <a href="https://fiddle.sencha.com/#fiddle/fji" rel="nofollow noreferrer">Sencha Fiddle</a> or <a href="http://www.harshabopuri.com/mobile.html" rel="nofollow noreferrer">Practice Site</a>). But is this possible for Web applications? Is there any sample that I can refer to how to navigate between pages using <strong>only Sencha ExtJS</strong>.</li>
  <li><strong>Friendly URLs:</strong> If I follow this structured I attempted for mobile site "<a href="http://www.harshabopuri.com/mobile.html" rel="nofollow noreferrer">Practice Site</a>" (<em>only about and home links are handled</em>) all pages in my site  will always have <code>/mobile.html</code> url, how would I make it such a way it can have friendly urls, like <code>/about, /contact</code> and so on?</li>
  </ul>
  
  <p>There is similar question on SO here <a href="https://stackoverflow.com/questions/15232240/extjs-architecture-for-multi-page-application">ExtJS Architecture for Multi Page Application</a>, but focusing on different concerns.</p>