Modern Full Stack Development using .NET

Microservices, Pub/Sub, federated identity, token based authentication, Web API, web hooks, client side data binding + realtime messages

Project References

https://github.com/leblancmeneses

https://github.com/kendo-labs/angular-kendo
https://github.com/Particular/NServiceBus
https://github.com/thinktecture/Thinktecture.IdentityServer.v3

Why Now? – Disruption in many areas

• Cloud levels the playing field (incumbent vs startup)
• Users expectation bar is higher
• Product development life cycle is different
• Community driven engineering standards

Cloud levels the playing field

• Architecture for Infrastructure is exposed over API(s)
  • Azure: RDS – relational database as a service
  • Azure: Disaster Recovery with traffic manager
• Architecture for scalable, decoupled products is promoted. ACS, Queues, API(s)

Users expectation bar is higher

• Usability – expect it to be pretty, avoid feature bloat, api’s for app mashups, community development around product
  • Photoshop cost to maintain rarely used features
  
• accessibility from any device
• consistent

* Maintenance cost for rarely used feature
Features from devs not from users
* bootstrap, cross compilers

Product development life cycle is different

• Do I build the product? customer validation
• Do I invest in a feature? “build, measure, learn, repeat”;
  • LinkedIn + GitHub integration scrapped
• Small distributed teams of full stack developers
  • No need for vertical slicing, work is divided by feature and ownership given to the full stack dev
• Iterative rapid releases & quick feedback loops

Community driven engineering standards

• Adobe & Microsoft proprietary RIA looses against HTML standards and JavaScript
• Apple launch of Swift 2014 – dead on arrival
  • For everyone focused on reach
  • For everyone avoiding vendor lock-in (cross compiler)
• 1st choice:
  • HTML + CSS + JavaScript – phonegap
• 2nd choice:
  • Xamarin

Microsoft pivots & aligns with community direction

• One Strategy - removing silos:
  • Business focused , flat transparent organization charts - http://www.microsoft.com/en-us/news/press/2013/jul13/07-11onemicrosoft.aspx One Microsoft: company realigns to enable innovation at greater speed, efficiency
  • Counter: http://stratechery.com/2013/why-microsofts-reorganization-is-a-bad-idea/
• Drops XAML in favor of HTML – Windows 8, More opensource,
• Xamarin + PCL – portable class libraries,
• Amazon -> Azure,
• Node -> async/await + OWIN Katana
• npm -> Nuget
• VS templates – bootstrap, angularjs, typescript, web essentials 2013

Modern Development Goals

• Common characteristics found in successful online companies: Amazon, Facebook, LinkedIn, Sendgrid, Twilio
  • Omni channel (be where the customer is @: desktop, mobile, tablet)
  • Elastic infrastructure (DevOps)
  • Comprehensive use of opensource (Nuget)
  • Compositional endpoints (reuse, SOA, *microservice*)
  • Managed API(s) - Community

Micro Service Architecture – Convention based SOA

• http://yobriefca.se/blog/2013/04/28/micro-service-architecture/
• Data In -> queues
• Data Out -> REST Resource
• Event Notification: SignalR (Webhooks)
• Monitoring Service – Queues, Service is running,
• Gherkin – BA specs & Test & CI integration

My .NET full stack solution

• Server Side:
  • T4Scaffolding
  • Web API – REST semantics & benefits, ModelBinding, ValidationAttribute,
  • ASP.NET MVC – DRY: @HTML SPA Templating from *Model* DataAnnotations
• Client Side:
  • Bootstrap 3.x – mobile first approach, solves presentation (typography, UI controls, layout)
  • AngularJS – simplify complex view logic, behaviors through decorations (directives)
    • **No server side viewmodels**
  • Angular Kendo – Controls bound to server side (Grid, DropDowns, DataViz)
  • SignalR – realtime event re-broadcasted over $rootScope.$broadcast
• Cross Concerns:
  • NServiceBus – enterprise service bus (webhooks/SignalR)
  • ThinkTecture – Thinktecture.IdentityServer.v3 (Idp) + Authorization Server
• DevOps:
  • Klondike, TeamCity – nuget server
  • psake, Octopus Deploy + RH build tools ; staging automating deployments
  • Testing – Gherkin – RobustHaven.IntegrationTests on GitHub

Server Side MVC – the old

• http://en.wikipedia.org/wiki/Post/Redirect/Get - ModelStateToTempData
• Display/Editor Templates
• Controller Responsible for – getting data, mapping to ViewModels, and selecting view to be processed by the ViewEngine

Disruptor: Single Page Apps

	Bootstrap = CSS/layout/presentation AngularJS = application logic (thick client) ng-show, ng-hide, ng-switch, ng-if, ng-repeat, ng-include, ng-model

Disruptor: AngularJS

• Client Side A-Z Framework:
  • routing, animation, event bus, dependency injection, 100% testable
• Prism + Silverlight simplified

http://www.meetup.com/AngularJS-DFW-Area/events/129445132/

Disruptor: AngularJS – Web Components

Web Components (directives) Comments - http://disqus.com/ UserProfile

Web Component – Busy Indicator – ContentControl

Web Component

Disruptor: AngularJS – Behavior Extending

• Behavior – decoration by attribute
  • k-mask=“’(999) 000-0000’”
  • Ng-required, ng-minlength, ng-maxlength, ng-pattern, ng-change

Disruptor: AngularJS Realtime

.NET SPA with Web API 2

The Robust Haven SPA Way

T4Scaffolding to create DisplayTemplates,EditorTemplates from model, convention based REST endpoint for model, Result is a SPA AngularJS/Bootstrap app. DRY – Don’t Repeat Yourself

Organize Code?

Cross Concerns: NServiceBus

• Distribution – distributor – only msmq, not with competing consumer pattern
• Persistence – Sagas - ravendb
• Security – encryption mutators
• Transactions – DTC –
  • idempotent handlers – given the same input will produce the same result without side effects.
  • Routing slips without DTC
• Reliability – queues, retries, second level retries

Cross Concerns: NServiceBus

• When things go wrong! You can relax.

Cross Concerns: ThinkTecture

Cross Concerns: ThinkTecture

Monitoring vs Testing

Monitoring vs Testing

RobustHaven.IntegrationTesting

DevOps

• DevOps talks later today

Feedback