1. Scalable Application Architectural Design Decoupled Web Systems Large Scale Enterprise Applications Using PureMVC + Enhancements

2. Before We Go Ahead Forget how you used to think about web pages and developing websites Forget jQuery, Closure and any of the other JavaScript Frameworks. Open up to thinking for a website or web application in a new way. The only difference between a problem and a solution is that people understand the solution. - Charles F. Kettering

3. Think of web app as a Native App Now Think that you’re going to develop websites using a high level language like C#, Java or ActionScript in a sophisticated environment. Background in any OOP language will help.

4. What do I mean by a Native App Native Apps are built using Components, Objects or Classes organized under packages, folder structure etc. including 3 rd party libraries. Each class instance or object has member variables and methods (Important), and methods act on these variables.

5. What is an object in a webpage Every TAG is an object. HTML, BODY, DIV, SPAN, IMG etc. these are all objects. Attributes are member variables eg, id, style, lang, src etc. Technically speaking I’d not call them as objects at this point but structures, why? Because they don’t have behaviors or methods that acts on these member variables.

6. You may say We can attach behaviors to HTML tags, for instance onload, onclick, onmouseover, onmouseout. Well still it’s limited to predefined behaviors, we can’t have custom behavior like showMessage=‘’ and besides not an efficient way to define behaviors.

7. How do we provide Custom Behaviors Create a JavaScript Class using either “function(), this” or puremvc.define() or goog.provide() and have it mapped and assigned to this html tag.

8. How a TAG Component looks like? URLURL

9. Dedication (~Encapsulation) Dedication means the members and methods of this class will only act on the assigned tag. The Tag Component will only focus, manage and manipulate child elements of this tag. “The secret to building large apps is never build large apps. Break your applications into small pieces. Then, assemble those testable, bite-sized pieces into your big application” - Justin Meyer

10. So we can do this…

11. “The more tied components are to each other, the less reusable they will be, and the more difficult it becomes to make changes to one without accidentally affecting another” - Rebecca Murphey

12. PureMVC (GANG OF 4)

13. What it Provides Boilerplate code for Testable, Manageable, Reliable, Reusable, Maintainable and Scalable Components based on MVC. We can change and refactor independently without changing the rest of the system. The components are highly reusable and can be plugged into any system seamlessly. In the words of marketing guru John Colanzi, "Sometimes you have to take a step back before you can move forward." As developers mature and their skills increase on the long road to mastery, there are few opportunities to truly leap forward. These special moments are the result of taking calculated risks to step up their game. While using this framework admittedly has a learning curve, can initially increase development time, and requires discipline, you may find it well worth the effort. Evolving from creating custom, per-project frameworks to using the consistent, proven PureMVC framework is one such opportunity to leap forward.

14. Think BIG

15. Multilingual Apps Highly Reusable Code Sharing strategies between languages since modules are separate.

16. Projects Implemented several PureMVC ports throughout all Multilingual Projects for major clients of Leo Burnett notably. McDonalds Phillip Morris General Motors Kellogg’s and more. PureMVC JS Implementations @ github https://github.com/sshams/Ferrari https://github.com/sshams/DonateMe

17. Summary Dedicate a class per tag (of interest) and offer methods for it’s manipulation. PureMVC JS port with some enhancements based on Real Application Development Environment Of course using Closure, jQuery or any other framework along with. Going BIG with Multicore version

18. Questions, Comments saad@muizz.com www.muizz.com +971 (50) 925 0844