Modern Software Architectures: Building Solutions for Web, Cloud, and Mobile


Published on

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • The world around us is rapidly changing.The iPad changed the perception of user. They expect immediate resultsInformation should be available everywhere and from any deviceThey get an amazing experience from most apps built in a garage, so they expect that same experience from enterprise apps.There are more mobile device user’s than ever.The CTIA Wireless Association has indicated that there are more wireless subscriber connections in the US and its territories than people according to a CNET News article that can be found at This means that our solutions must also respond well even when connection speeds aren’t optimal and connectivity is spotty.There’s also more data than ever before.And of course, we have to ensure that security is appropriately handled throughout.
  • - Not just for social mediaNo postbacksHeavy emphasis on JavaScriptState stored in DOM, client-side DBs, or on the server (in the case of Hypermedia Architectures).
  • - Show conceptual architecture of the full web solution- Explain routers/controllers, views (with templating engines), models, controllers, server-side models.- Design Patterns – Some new, some old
  • - Show pattern MVC pattern
  • - Show MVVM architecture- Discuss advantages
  • - Explain what is being seen
  • Protect the Global NamespaceSeveral ways to do it, one of my favorites is the nested namespace patternExplain what is being seen
  • - Explain the pattern (protects the global namespace, provides encapsulation and scoping)- Show simple example
  • - Explain the pattern (provides modularity)- Show simple example- Combined with script loaders (standards such as AMD (RequireJS) and CommonJS – arguably better for server-side JS development) - Mention that this is also showing a pattern known as namespace injection
  • - Horizontal scaling - Functional programming languages (F#, Scala, Erlang, Haskell) can be a win here (easier to use multiple cores and to scale across commodity servers). Immutable by defaultMessage passing as primary communication mechanismFunctions as first class citizens.Inherent support for patterns such as MapReduce and Fork/Join
  • -Explain the pattern by showing a few architecture diagrams
  • - Explain Command Query Responsibility Segregation- Reads and Writes Separated (clear SoC)- Usually implemented with some sort of service/message bus- Explain the different way of thinking that’s required here- Show high level conceptual architecture diagram
  • - Explain Command Query Responsibility Segregation- Reads and Writes Separated (clear SoC)- Usually implemented with some sort of service/message bus- Explain the different way of thinking that’s required here- Show high level conceptual architecture diagram
  • - Explain the pattern with an architectural diagram- Talk about real world problems that it solves
  • - User focused (even more so than web)- Little to no documentation or help endusers- We can learn a lot of this and should apply it to building all our solutions- It has to be fast even when connectivity is inconsistent- Needs offline support
  • One way to make things fast - Modern HTTP Services:- IntelligentURIs (support easier caching, drives routing in the web apps, mobile devices tend to work with it better)- JSON as the primary payload (smaller payload, mobile devices work with it easier than SOAP, works better from JavaScript for web, no need to create proxies on the client from WSDL files or the like)- Many will call this architecture RESTful (however, the term REST causes a lot of arguments) - Hypermedia based architectures are closer to what purests call REST.Encompasses the above, but also moreState is maintained by links (means that URIs determine what the user can do, an information about the system) - Rather than using the term REST (which has become known as “anything but SOAP”). I generally say HTTP services or Hypermedia Services.
  • - Not Only SQL- Talk about how it makes things fast (in-memory, optimized for reads, schema-less, many are eventually consistent, distributed, extremely fault-tolerant)- Show architecture of how it can be used (both as primary storage as glorified cache)
  • - Libraries like jQuery Mobile - Responsive Design using CSS3 Media Queries- Solutions such as PhoneGap even give access to native hardware features- Write once, deploy many- Show structure of how to build a responsive web solution (may show a real example as well) – Discuss libraries that help – Foundation 3, Twitter Bootstrap, others?
  • - Native is faster- Better offline support - Complete native look and feel- Consumers seem to prefer native (Facebook is a great example)
  • Modern Software Architectures: Building Solutions for Web, Cloud, and Mobile

    1. 1. Modern SoftwareArchitectureBUILDING SOLUTIONS FOR WEB, CLOUD, AND MOBILE
    2. 2. Who is this guy?Daniel Mohl
    3. 3. Who is this guy?
    4. 4. AgendaWhy should we change?Trends in the IndustryArchitecting for the WebArchitecting for the CloudArchitecting for MobileWrapping it Up
    5. 5. Why should we change?
    6. 6. Trends in the IndustryMoving to the clientBack to the metalHorizontal ScalingSchema-less Data StoresUser Centric Solutions
    7. 7. Architecting for the WebNo more WebForms – Reduce leaky abstractionsSeparation of ConcernsDesign Patterns – Some new, some oldSingle Page Applications
    8. 8. Single Page Applications
    9. 9. Single Page Applications - Layers
    10. 10. Single Page Applications – MV*/C Model View Controller
    11. 11. Single Page Applications – MVVM View ViewModel Model
    12. 12. Single Page Applications – MVVM
    13. 13. A Few JavaScript Patterns
    14. 14. Nested Namespace PatternAddy Osmanis Book - Learning JavaScript Design Patternsvar myApp = myApp || {};myApp.routers = myApp.routers || {};myApp.model = myApp.model || {};myApp.model.special = myApp.model.special || {};
    15. 15. Self-executing Anonymous Functions(function( $ ) { var myVar, myFunc; myVar = 1; myFunc = function( val ) { return val + myVar; }; console.log( myFunc(2) );})( jQuery );
    16. 16. Revealing Module Pattern(function( pub, $ ) { var myPrivateFunc = function(val) { return val * 100; }; pub.myFunc = function( val1 ) { return val1 + myPrivateFunc (val1); };})( window.myApp.myMod = window.myApp.myMod || {}, jQuery );window.myApp.myMod.myFunc( 2 );
    17. 17. Other Patterns We Know and Love Messaging Patterns like Pub/Sub using AmplifyJS and PostalJS Observer pattern – $.trigger and $.on Façade - Seen a lot in jQuery – like $.get(…) Strategy and Command (inherit due to functional nature of JS) Iterator pattern - $.each Map/Reduce - and _.reduce Memoize - _.memoize
    18. 18. Architecting for the Cloud
    19. 19. Competing Consumer Image from this Windows Azure Tutorial
    20. 20. CQRS Image from this MSDN Magazine Article
    21. 21. From
    22. 22. MapReduce Pattern http://Image from this Wikipedia page
    23. 23. Architecting for Mobile
    24. 24. Faster and smarter
    25. 25. Modern HTTP Services Diagram from
    26. 26. NoSQL Diagram from
    27. 27. Web vs. NativeWeb:- jQuery Mobile, Sencha Touch, etc.- HTML5 and CSS3 (offline storage, input tags, improved animations, Media Queries)- Write once, deploy many- Responsive Design helpers like Twitter Bootstrap and Foundation 3
    28. 28. Web vs. NativeNative:- Faster and richer experience- Better offline support (but still have to manage data access)- Device hardware access (camera, GPS, accelerometer, flash, etc.)- Seems to be preferred by consumers (look at Facebook for an example)- Easier accessPhoneGap and others help provide a bridge
    29. 29. Wrapping it UpUser FocusedMovement to JavaScript and the client (Single Page Apps)Reduce leaky abstractionsUse Modern HTTP ServicesBuild both Responsive Web sites and native mobile appsAdd NoSQL to the mixReduce payload sizeFunctional First (F#, Scala)
    30. 30. My Contact InformationDaniel Mohl