Writing Mobile & Desktop    Apps with Sencha     @aaronwhite
Co-Founder                              CTO(Boundless Learning is a funded, stealth-mode    education startup doing *big* ...
Sencha➡Sencha     Touch • HTML5    JS Framework for Mobile➡ExtJS • Robust   JS Framework for Desktop
Sencha Touch
Sencha Touch➡HTML5      / CSS3 / JS➡Works      with:    • iOS 3+    • Android 2.1+    • Blackberry 6+➡Touch-centric➡Tiny  ...
MVC++       Model                Store   ProxyView           Controller
Example App!RockLog JS & rock-climbing go hand-in-hand, they’re both  dangerous if you don’t know what you’re doing
git checkout boilerplate    (basic file structure, basic app)
git checkout first-controller     (viewport, routes, controller, view)
git checkout second-controller         (listeners, dispatching)
git checkout show-me-the-data        (models, store, list display)
git checkout view-record     (switching views, templating)
git checkout add-record    (forms, adding data to store)
Next Steps➡Merge   & minify➡Add   Proxy to Store➡PhoneGap
ExtJS
ExtJS➡Desktop    Browser JS Framework➡Robust • Cross-browser • Mature Class-system • Thorough MVC • Charting➡Tools,   Edit...
MVC++       Model                Store   ProxyView           Controller           (But way better)
RockLogDesktop Now I’m just showing off
git checkout boilerplate    (basic file structure, basic app)
git checkout show-me-the-data        (models, store, list display)
git checkout view-record     (switching views, templating)
git checkout add-record    (forms, adding data to store)
Next Steps➡Merge    & minify➡Add    Proxy to Store➡All   sorts of bells & whistles
Upcoming SlideShare
Loading in …5
×

MVC in Sencha Touch & ExtJS

7,056 views

Published on

Details the basics of setting up a Sencha Touch & ExtJS MVC application.

Associated source code here:

https://github.com/aaronwhite/Sencha-Touch-MVC---Example-App

https://github.com/aaronwhite/ExtJS-MVC-Example-App

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
7,056
On SlideShare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
98
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • MVC in Sencha Touch & ExtJS

    1. 1. Writing Mobile & Desktop Apps with Sencha @aaronwhite
    2. 2. Co-Founder CTO(Boundless Learning is a funded, stealth-mode education startup doing *big* things)
    3. 3. Sencha➡Sencha Touch • HTML5 JS Framework for Mobile➡ExtJS • Robust JS Framework for Desktop
    4. 4. Sencha Touch
    5. 5. Sencha Touch➡HTML5 / CSS3 / JS➡Works with: • iOS 3+ • Android 2.1+ • Blackberry 6+➡Touch-centric➡Tiny (120kb)➡ Works w/ PhoneGap➡MVC
    6. 6. MVC++ Model Store ProxyView Controller
    7. 7. Example App!RockLog JS & rock-climbing go hand-in-hand, they’re both dangerous if you don’t know what you’re doing
    8. 8. git checkout boilerplate (basic file structure, basic app)
    9. 9. git checkout first-controller (viewport, routes, controller, view)
    10. 10. git checkout second-controller (listeners, dispatching)
    11. 11. git checkout show-me-the-data (models, store, list display)
    12. 12. git checkout view-record (switching views, templating)
    13. 13. git checkout add-record (forms, adding data to store)
    14. 14. Next Steps➡Merge & minify➡Add Proxy to Store➡PhoneGap
    15. 15. ExtJS
    16. 16. ExtJS➡Desktop Browser JS Framework➡Robust • Cross-browser • Mature Class-system • Thorough MVC • Charting➡Tools, Editors, etc➡Frankly, it’s badass (story!)
    17. 17. MVC++ Model Store ProxyView Controller (But way better)
    18. 18. RockLogDesktop Now I’m just showing off
    19. 19. git checkout boilerplate (basic file structure, basic app)
    20. 20. git checkout show-me-the-data (models, store, list display)
    21. 21. git checkout view-record (switching views, templating)
    22. 22. git checkout add-record (forms, adding data to store)
    23. 23. Next Steps➡Merge & minify➡Add Proxy to Store➡All sorts of bells & whistles

    ×