structuring your sencha touch application
DESCRIPTION
In this session you'll learn about the recommended application structure for Sencha Touch (or Ext JS) applications. The new application structure enables any Sencha developer to quickly understand any Sencha application using the new Sencha MVC package.TRANSCRIPT
![Page 1: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/1.jpg)
![Page 2: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/2.jpg)
Structuring your Sencha Touch application
by Tommy Maintz@tommymaintz
![Page 3: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/3.jpg)
Session GoalsUnderstand MVCMVC in Sencha TouchCommon file structureGenerators & Build Tools
![Page 4: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/4.jpg)
![Page 5: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/5.jpg)
MVCModels, Views & Controllers
![Page 6: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/6.jpg)
BenefitsReduce architectural complexityFlexibility and maintainability.
![Page 7: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/7.jpg)
ModelsManages the data of the applicationProvide data in its current stateAllows you to change state
![Page 8: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/8.jpg)
ViewsRenders the model into a form suitable for interactionMultiple views can exist for a single model
![Page 9: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/9.jpg)
ControllersReceives inputInstructs the model and views
![Page 10: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/10.jpg)
ModelView
Controller
DIRECT CONNECTIONINDIRECT CONNECTION
![Page 11: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/11.jpg)
Sencha MVC
![Page 12: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/12.jpg)
PlatformSame MVC codebase
Share Models, Stores, Controllers
![Page 13: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/13.jpg)
Ext.regApplication()Ext.regModel()Ext.regStore()Ext.regController()Ext.reg()
Managers
![Page 14: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/14.jpg)
Application
![Page 15: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/15.jpg)
Model
![Page 16: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/16.jpg)
Store
Really, that’s it...
![Page 17: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/17.jpg)
View
Looks familiar?
Views are UI components
![Page 18: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/18.jpg)
Controller
![Page 19: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/19.jpg)
Common file structure
![Page 20: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/20.jpg)
BenefitsLearn it onceEasier supportSharing between projectsEnables use of Sencha Command
![Page 21: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/21.jpg)
![Page 22: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/22.jpg)
![Page 23: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/23.jpg)
![Page 24: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/24.jpg)
![Page 25: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/25.jpg)
![Page 26: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/26.jpg)
![Page 27: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/27.jpg)
Sencha CommandGenerate projects, controllers, models and stores
Cross-OS
![Page 28: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/28.jpg)
Let’s build an app!
![Page 29: Structuring Your Sencha Touch Application](https://reader033.vdocuments.site/reader033/viewer/2022042606/546f1a31b4af9f090c8b45af/html5/thumbnails/29.jpg)
Questions?