SPA, Scalable Application & AngularJS

10,240 views

Published on

Published in: Technology, Education
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
10,240
On SlideShare
0
From Embeds
0
Number of Embeds
2,310
Actions
Shares
0
Downloads
47
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

SPA, Scalable Application & AngularJS

  1. 1. SPA, SCALABLE APPLICATION & ANGULARJS Mitch Chen
  2. 2. WHAT IS SPA ?
  3. 3. SINGLE PAGE APPLICATION
  4. 4. SPA ECOSYSTEM CATEGORIES
  5. 5. SCALABLE APPLICATION
  6. 6. SA ARCHITECTURE • Base Library (jQuery, Zepto.js etc.)
  7. 7. SA ARCHITECTURE • Application Core (aka Application Controller) ✴ Manage Modules ✴ Handle Errors ✴ Enable Inter-Module Communication ✴ Extensible ✴ Can use Base Library
  8. 8. SA ARCHITECTURE • Sandbox ✴ Facade for modules above the core (Security Guard) ✴ Interaction between modules via messages (events) ✴ Ensures a consistent interface
  9. 9. SA ARCHITECTURE • Modules ✴ Don’t know about each other, only about sandbox ✴ Call only own methods or sandbox methods ✴ DOM access only inside own box (But don’t use Base Library) ✴ No access to non-native global objects, don't create global objects ✴ Ask sandbox for anything you need, don't reference other modules ✴ Preferably no access to base library, use pure JS
  10. 10. ANGULARJS ARCHITECTURE • Base Library ✴ jQuery or AngularJS’s own jqLite implementation • Application Core ✴ AngularJS itself • Sandbox ✴ Scope passed to the controller • Module ✴ AngularJS’s controller
  11. 11. KEY FEATURES OF ANGULARJS • Declarative HTML approach • Easy Data-Binding • Reusable Components • MVC/MVVM Design Pattern • UnitTesting • Routing • Templating
  12. 12. KEY FEATURES OF ANGULARJS • Modules • Services • Expressions • Filters • Directives • FormValidation • $scope, $http, $routeProvider
  13. 13. LET’S ANGULARJS !!
  14. 14. Q & A

×