2. Jordan Knight Senior Consultant Readify ARC 301

3. About Me Jordan Knight Senior Consultant at Readify Email: jordan.knight@readify.netjordan.knight@readify.net Twitter: @jakkaj Blog: blog.webjak.net Code will be available next week sometime

4. Agenda What are we going to talk about? Architectural Challenges in Silverlight How can these be met? Best patterns and practices Demos Lots and Lots of them Wrap up

5. What are we trying to fix?

6. Architecture What is it? Significant Design Decisions about the organisation of Software System High level breakdown of a system into its parts Takes non-functional or quality requirements into account “It’s basically all the important stuff” – Martin Fowler

7. Challenges What are we trying to fix? You are not building “Hello world” apps anymore As the number of features increases, number of lines of code increases As complexity increases, the number of moving parts increases

8. Silverlight What challenges does it present? Silverlight runs in a browser as a plug-in Silverlight is.NET, but it doesn’t contain all the framework classes Standard.NET libraries cannot be used with Silverlight You may have specific requirements like running even when not connected to the network or run out of the browser

9. Architecture Guidelines Some things to do while designing Separation of concerns Single Responsibility Principle (SRP) Principle of least knowledge (Law of Demeter) Don’t Repeat Yourself (DRY) Design for High Cohesion and Low Coupling

10. Best patterns and practices

11. Guidelines and prescriptive approaches based on prior success Not rules Common vocabulary, nomenclature for describing building blocks, and their relationships Patterns What are they and Why do we need them?

12. Patterns/Practices for Silverlight (Covered in this presentation) Presentation Layer Patterns MVVM (Model – View – View Model) and Command Composite UI Inversion of Control Containers using Dependency Injection n-tiered Architecture Guidance: Security Validation Local storage/Caching Logging/Error handling Turn off Auto Resizing on all text boxes

13. The MVVM pattern Model -View -View Model Motivations: Reduces complexity with Model to UI integration Separation of concerns Clear Designer-Developer separation Makes code more testable Approach: Split the UI architecture into Model, View and View-Model Model: Represents the data View : UI defined declaratively in XAML View Model: Specialisation of the Model that View uses for data binding

14. The MVVM pattern Model -View -View Model Data Model ViewView XAMLXAML Code-BehindCode-Behind View Model State + Operations + Notifications Property change and other event notifications Data-binding and commands

15. The power of MVVM Making things easier for developers A good MVVM implementation can take away a lot of pain Minimise developer confusion when following implementation Self documenting Maximise reuse of code Encapsulate common operations in base classes CRUD Entity Management Commanding (Save, Cancel, Add new etc) Error Handling etc.

16. Commanding with MVVM Commands exposed from ViewModel Consumed via binding in XAML Things like Button Clicks Handled back in the ViewModel Custom command handlers allow much more Handle commands from DataForms etc

17. Command Pattern (in WPF) private class MyCommand : ICommand { public event EventHandler CanExecuteChanged; public bool CanExecute(object parameter) {... } public void Execute(object parameter) {... } } <Button... Command = “{Binding Path=MyCommandInstance}” />

18. Commanding in SL using Prism public DelegateCommand ButtonClicked { get; set; } ButtonClicked = new DelegateCommand (o => { //Do Stuff }); <Button... prism:Click.Command = “{Binding Path=ButtonClicked}” />

19. Event Aggregation Loosely coupled communication Motivations: Passing events across different components (including View Models) Component that generates event does not does not need to know who consumes the events Component that consumes the event does not need to know who generates them Approach: Light weight Pub/Sub Model Components generating the event publish the event to the Event Aggregator Components such as View Models just subscribe to events they are interested in

20. Event Aggregator in Prism public class MyEvent : CompositePresentationEvent {... } // Publisher code eventAggregator.Get ().Publish(instanceOfMyClass); //Subscriber code eventAggregator.Get ().Subscribe(MyFunc); void MyFunc(MyClass myClass) {... }

21. Composite UI Aggregating composite blocks into single App Motivations: Loosely coupled, independently evolvable pieces that work together Building modular applications Multiple screens that need some glue to hold them together Approach using Prism: The Shell hosts all the visual components Functional units are split into Modules. Modules are composed into a larger Application Modules contains Views for UI interaction Modules can also contain Models and Services Uses Dependency Injection containers to reduce coupling

22. Composite Application Module ViewView ViewView ViewView

23. Inversion of Control Containers “Don’t call us, we’ll call you” Motivations: Decouple classes from their dependencies Reduce dependency on classes whose concrete implementations aren’t written yet Test your application in isolation, without dependencies Decouple classes from being responsible for locating and managing lifetime of dependencies Approach: Dependency Injection Service Locator

24. Class A Service A Service B uses Service Locator uses locates

25. Dependency Injection Class A Service A IServiceAIServiceA uses ContainerContainer Declaratively express dependency creates Injects dependency uses

26. Dependency Injection using Unity //Registering a type unityContainer.RegisterType (); //Resolving a type IType myType = unityContainer.Resolve ();

27. Presentation Layer Patterns Dependency Injection

28. n-tier Architecture or Multi-tier Architecture Motivations Separation of concerns Follows Single Responsibility Principal (SRP) Loose coupling and High cohesion Approach Split Application into multiple tiers: Presentation, Application Logic and Data Challenges Violating Don’t Repeat Yourself (DRY) principle Cross cutting concerns

29. ApplicationApplicationBrowserBrowser Rich Internet Application DB ServiceService Other Applications Client is an extension of the server A single logical application Data Access Layer AppLogicAppLogic ServicesServices HTMLPresentationLogic Network.NET RIA Services Simplifies traditional n-Tier Architecture

30. Real World MVVM

31. On Cross cutting concerns

32. Security The important stuff For Authentication and Authorisation use ASP.NET Membership provider.NET RIA Services provides some useful features: RiaContext contains Authentication information Use RequiresAuthentication attribute to secure services Use RequiresRoles attribute for Authorization

33. Validation Checking inputs into the system Use additional attributes on the metadata to specify validation rules: Required StringLength RegularExpression Range CustomValidation

34. Validation using.NET RIA Services [MetadataType (typeof(CustomerMetadata))] public partial class Customer {... } // Metadata Public class CustomerMetadata { [Required, ErrorMessage=“Name cannot be blank")] [StringLength(30)] public string Name; [RegularExpression(@"^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A- Z]{2,4}$")] public string Email; }

35. Local Storage/Caching Can also be used for Offline access Use IsolatedStorage to cache reference data and entities (can be serialised) Use NetworkChange.NetworkAddressChanged event to figure out if the Application goes online/offline NetworkInterface.GetIsNetworkAvailable() method shows if network connection is available or not

36. Logging of Exceptions/Messages Logging at the client side is not very useful for Silverlight Applications Cannot always rely on network being available to send Log or Exception information to the server Solution: Use IsolatedStorage to cache logs and send them to Server when connected Add Logging as an ApplicationService by implementing IApplicationService

38. As your Application gets bigger and more complex, you need good application architecture There are standard patterns available to help you in the process: Presentation layer patterns IoC containers n-Tier Architecture One last piece of advice: Don’t over engineer S UMMARY Wrap-up

39. Hidden Speaker Notes Some speakers at Microsoft like to use this slide for hidden “notes slides”. Delete it if you don’t want to use it. NEXT:

41. www.microsoft.com/teched Sessions On-Demand & Community http://microsoft.com/technet Resources for IT Professionals http://microsoft.com/msdn Resources for Developers www.microsoft.com/learning Microsoft Certification & Training Resources Resources

42. Related Content ARC304 Silverlight won't save your User Experience - You Will! WUX301 Going Deeper in Silverlight 3 (moi) WUX304 Building Great Standards Based Websites with ASP.NET 4.0 and Silverlight 3 WUX307 ASP.NET MVC, Silverlight and jQuery: Stories From the Trenches WUX308 Building Awesome Business Centric Applications with.NET RIA Services

43. COMPLETE YOUR EVALUATION FORMS IN COMMNET AND BE IN TO WIN ONE OF THE 150 DAILY PRIZES* GIVE US YOUR FEEDBACK & WIN INSTANTLY! *For full terms & conditions and more information, please visit the CommNet Portal.

44. © 2009 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.