Download
1 / 53
530 likes | 723 Views
Mobile HTML5 Applications In Hours, Not Days. Build Amazing Apps with Web Standards. Aditya Bansod VP, Product Marketing @adityabansod aditya@sencha.com. Mobile app development is hard. The Native Route. A badge for all these ways the web is changing.
E N D
Mobile HTML5 Applications In Hours, Not Days. Build Amazing Apps with Web Standards
Aditya BansodVP, Product Marketing @adityabansodaditya@sencha.com
A badge for all these ways the web is changing
Native programming languages you’ll needUS Smartphones, August 2011
But at least we are usingone language,one markup,one style system
WebFont Video Audio Graphics Camera HTTP Location CSS Styling & Layout AJAX Contacts Events JavaScript SMS Sockets Orientation Semantic HTML SSL Gyro File Systems Databases App Caches Workers & Parallel Processing Cross-App Messaging (all the elements of a modern application platform)
Stay on top of diversity • Can I Use?http://caniuse.com • Modernizrhttp://modernizr.com • DeviceAtlashttp://deviceatlas.com
100% Support Browsers Capabilities & specifications
Frameworks 100% Support Browsers Polyfills Capabilities & specifications
pages interactive apps Gradient from pages to apps (lightest at pages)
Build Amazing Apps with Web Standards pages interactive apps Gradient from pages to apps (lightest at pages)
HTTP/HTTPS HTML JavaScript Sencha.io WebSocket CSS MY APPLICATION Sencha TouchMobile Ext JS Desktop BROWSER ENGINES SERVERS & SERVICES
HTTP/HTTPS HTML JavaScript Sencha.io WebSocket CSS MY APPLICATION • Mobile framework • Native packagingModern mobile UI • Desktop framework • Cross-BrowserModern desktop UI Sencha TouchMobile Ext JS Desktop BROWSER ENGINES SERVERS & SERVICES
HTTP/HTTPS HTML JavaScript Sencha.io WebSocket CSS MY APPLICATION UI: Controls + Containers Data: Models + Stores + Connectors Foundation: OOP + MVC + Library Sencha TouchMobile Ext JS Desktop BROWSER ENGINES SERVERS & SERVICES
Sencha Touch 2 A JavaScript framework for building rich mobile apps with web standards
Class System Packages Inheritance Scope Management Class Loading Mix-ins
Class System Ext.define( ‘class_name’, { } ); Ext.create( ‘class_name’, { } );
Ext JS Components help with desktop UI component examples? put separately: mobile UI then next slide desktop UI (scattering of individual controls, breakdown of components and containers - the theme viewer examples, and web desktop (?) example) Use Neptune examples, Kitchen Sink in Ext JS 4.1
DEVELOPMENT WORKFLOW Ext Designer 1.2 Design Develop Deploy
Ext JS interface builderSupport for Ext JS ChartsCode generation for complex UI layoutsJSON/XML data connectivity • Export projects and code Ext Designer
Sencha Architect 2 Design Develop Deploy
Everything from Ext Designer 1.2 + • Sencha Touch 2Code Editing • MVCNative Deployment Sencha Architect 2
