How Sencha touch view files are rendered in index.html?

Question

I started learning sencha touch,I want to know how the view files are actually loaded in index.html file,

I know app.js launch function is where we are creating view instance and we are setting it into viewport,but how exactly app.js is linked with index.html?

And what exactly these Scripts are doing?

<script src="touch/sencha-touch-all.js"></script>
<script id="microloader" type="text/javascript" src=".sencha/app/microloader/development.js"></script>

Answer 1

microloader is the folder that is shipped with sencha sdk and contains three files mainly, development.js, production.js and testing.js , each one for it's own purpose.

Development.js file is mainly used to -

1. load app.json file
2. For recognising platform of running app like mobile, tablet, android etc..
3. To load external files in index.html

touch/sencha-touch-all.js" This is touch framework file of sencha which we need to include to run sencha app.

App.json file is Main file that connects all scripts / css file to index.html and this app.json file connects with index.html by below line

"indexHtmlPath": "index.html", (you can see it in app.json file)

So you know that we write all views file in app.js and we include this app.js file into app.json with below code.

 {
        "path": "app.js",
        "bundle": true,  /* Indicates that all class dependencies are concatenated into this file when build */
        "update": "delta"
    },

Thanks