aurelia and .net
TRANSCRIPT
Aurelia( + .NET CORE)
@MR_SEAN_HUNTER (PCA PREDICT)
Agenda
What is Aurelia?Why Aurelia?Up and Running with Aurelia
& .NET Core
What is Aurelia
Next Generation SPA Framework
Next Generation Web Framework
Component based developmentModern JavaScriptModern web standards
What is Aurelia
MVVM (Model View View Model) Architecture
MVVM
view-model.htmlview-model.js
What is Aurelia
Based on Simple and easy to change conventions
Why Aurelia?
Why Aurelia – Developer Happiness!
A consistent binding syntax
Why Aurelia – Rob Eisenberg
Created:
• Caliburn (WPF & Silverlight MVVM Framework)• Caliburn Micro (WPF & Silverlight MVVM
Framework)• Durandal (1st Generation SPA Framework)• Aurelia (2nd Generation SPA Framework)
Getting Started - JSPM
npm install jspm –gjspm init
Getting Started – Aurelia
jspm install aurelia-frameworkjspm install aurelia-bootstrapper
Modify the Babel Options
babelOptions: { "optional": [ "runtime",
"optimisation.modules.system", "es7.decorators", "es7.classProperties"
] },
Aurelia Todo
Aurelia Component Lifecycle
activate()bind()attach()
deactivate()unbind()detach()
Singletons
Every injected non-view model class is treated as a singleton.* Can be overridden with transient decorator
Aurelia Demo - Routing
Aurelia Demo – Ajax
Aurelia Demo – Value Converters
view.html
date-format.js
Aurelia Demo - Deployment
Because we don’t have HTTP2 yet, we need to bundle.
gulp bundle
http://blog.durandal.io/2015/09/11/bundling-aurelia-apps/
SPA Data Flow
Two way data-binding or Unidirectional dataflow?
-- Why not both?
Aurelia & Unidirectional Data-flow
contact-list.js
contact-details.js
Web Components?
Now: Aurelia supports web components. This means polymer components can be used with Aurelia today.
Future: Ability to export Aurelia component for use as a web component (standalone).
Performance
Current benchmarks show rendering speed of 2x Angular and React
Performance
Micro-task Queue rather than Virtual DOM
Is it solid?
Backed by Durandal Inc.Commercial Support Available.15 developer team distributed around the world.
Browser Support
Evergreen browsersIE9 & IE10
4 months in, any shortcomings?
Very new stuff.Documentation a work in progress.Lack of 3rd Party Tools
Conclusion
Easiest way to get started?
npm install –g yoyo aurelia
Contact Details
Sean Hunter, Software Developer @ PCA PredictTwitter: @mr_sean_hunterEmail: [email protected]: http://sean-hunter.io/