itcamp 2013 - tiberiu covaci - spa made breezy

30
itcampro @ itcamp13 # Premium conference on Microsoft technologies SPA Made Breezy Tiberiu Covaci, @tibor19

Upload: itcamp

Post on 13-May-2015

171 views

Category:

Technology


5 download

TRANSCRIPT

Page 1: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

SPA Made Breezy

Tiberiu Covaci, @tibor19

Page 2: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileHuge thanks to our sponsors!

Page 3: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Page 4: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Page 5: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Single Page Applications Made with Breeze.js

Tibi Covaci, @tibor19

Page 6: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileWho am I

• Tiberiu ’Tibi’ Covaci

• Software engineer, 20 years experience

• MCT since 2004, teaching .NET

• Senior Trainer & Mentor in Romania

• Microsoft MVP for Windows Azure

• Father & Geek

• Twitter: @tibor19 / #itcamp13

Page 7: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileAgenda

• What is SPA

• Technologies

• Demo

Page 8: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileSingle Page Application

Rich Client App in HTML/JavaScript

Page 9: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileWhy SPA?

Page 10: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileOne ASP.NET

Page 11: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileHybrid is the norm

ASP.NET Web Form

ASP.NETMVC Page

ASP.NetMVC Page

SPA

No one pattern is the best Evolution, not revolution

Page 12: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileKnockout

• JavaScript MVVM framework

• Independent library

• Works well with other frameworks

Page 13: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileKnockout

• Declarative bindings

• Automatic refresh

• Dependency tracking

• Support for templating

Page 14: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileKnockout observables

• Observable properties

• Observable arrays

• Computed(dependent) observables

Page 15: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileKnockout bindings

• Controlling text and appearance

• Control flow

• Form field bindings

• Rendering templates

• Custom bindings

Page 16: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Demo

Page 17: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

learn more at

knockoutjs.com

Page 18: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileDurandal

• Clean MV* Architecture

• JS & HTML Modularity

• Simple App Lifecycle

• Eventing, Modals, Message Boxes, etc.

• Navigation & Screen State Management

• Consistent Async Programming w/ Promises

• App Bundling and Optimization

Page 19: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileDurandal

• Use any Backend Technology

• Built on top of jQuery, Knockout & RequireJS

• Integrates with other libraries such as

SammyJS & Bootstrap

• Make jQuery & Bootstrap widgets

templatable and bindable (or build your own

widgets).

Page 20: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Demo

Page 21: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

learn more at

durandaljs.com

Page 22: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileRich data

Caching

Validation

Client Queries

Batch Save

Change TrackingRoll Your

Own

Page 23: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Free

Open Source (GitHub)

MIT License

Page 24: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Technical Support

Professional Services

Page 25: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Page 26: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Demo

Page 27: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

learn more at

breezejs.com

Page 28: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Development &

MobileSummary

• SPA is a good alternative

• KO and data binding makes code cleaner

• Durandal makes the MV* easy

• SPA is Breezy with KO and Durandal

Page 29: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Thank you

Thanks to IdeaBlade

Ward Bell

Marcel Good

Page 30: ITCamp 2013 - Tiberiu Covaci - SPA Made Breezy

itcampro@ itcamp13# Premium conference on Microsoft technologies

Q & A