AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)
-
Upload
future-insights -
Category
Technology
-
view
693 -
download
7
description
Transcript of AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)
![Page 1: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/1.jpg)
AngularJSTHE BRIDGE BETWEEN TODAY
AND tomorrow's WEB
![Page 2: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/2.jpg)
@toddmotto
![Page 3: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/3.jpg)
A look at the web▸ Yesterday, where we came from▸ Tomorrow, where we’re headed▸ Today, what’s available▸ Angular, today▸ Angular, tomorrow
![Page 4: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/4.jpg)
Rewind
![Page 5: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/5.jpg)
<TABLE WIDTH="100%" CELLPADDING="0" CELLSPACING="0" BORDER="0"> <TR> <TD COLSPAN="3">Oh my!</TD> </TR></TABLE>
![Page 6: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/6.jpg)
<BLINK></BLINK>
<MARQUEE></MARQUEE>
![Page 7: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/7.jpg)
<center> <font size="4">Awesome letters</font></center>
![Page 8: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/8.jpg)
<a href="javascript:window.location='http://www1.myawesomeweb.com'"> Enter site!</a>
![Page 9: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/9.jpg)
<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap"><map name="planetmap"> <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun"> <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury"> <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus"></map>
![Page 10: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/10.jpg)
![Page 11: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/11.jpg)
![Page 12: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/12.jpg)
Where are we now?
![Page 13: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/13.jpg)
![Page 14: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/14.jpg)
▸ <video>, <audio>▸ WebGL,<canvas>▸ getUserMedia
▸ Geolocation (kinda)▸ Fullscreen API▸ WebSockets
![Page 15: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/15.jpg)
▸ local and session storage▸ History API▸ Indexed DB▸ Web SQL (kinda)
▸ Native form validation (required, email etc)▸ FormData
![Page 16: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/16.jpg)
▸ Dataset (custom data-*)▸ HTML5 semantics▸ File/FileReader API▸ classList API▸ Drag and drop▸ postMessage▸ contenteditable
![Page 17: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/17.jpg)
And breathe. HTML5 is huge.
![Page 18: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/18.jpg)
To make things even more difficult for us...
![Page 19: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/19.jpg)
Frameworks and Model-View-Whatever
![Page 20: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/20.jpg)
▸ Angular▸ Backbone▸ Ember▸ Knockout▸ React
![Page 21: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/21.jpg)
Why frameworks?
![Page 22: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/22.jpg)
We're still missing stuff!▸ Templates/Encapsulation/Components▸ Two-way data binding/Model data▸ Promises and Class-like components
▸ Modules▸ Dependency Injection (DI)
![Page 23: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/23.jpg)
So where are we going?
![Page 24: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/24.jpg)
Incoming...▸ Web Components (HTML5)▸ Object.observe (ES7)▸ Native Promises (ES6)▸ Modules (ES6)▸ Classes (ES6)
![Page 25: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/25.jpg)
Web ComponentsCUSTOM ELEMENTS
![Page 26: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/26.jpg)
Web Components: Custom Elements<google-map latitude="37.77493" longitude="-122.41942"> <google-map-marker latitude="37.779" longitude="-122.3892" title="Go Giants!"></google-map-marker></google-map>
![Page 27: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/27.jpg)
Web ComponentsTEMPLATES
![Page 28: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/28.jpg)
Web Components: Templates<template id="google-map"> <style> :host { position: relative; } #map { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } </style> <div class="map"> <div id="map"></div> </div></template>
![Page 29: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/29.jpg)
Web ComponentsSHADOW DOM
![Page 30: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/30.jpg)
Web Components: Shadow DOM▾<google-map latitude="37.77493" longitude="-122.41942"> ▾#shadow-root (user-agent) <div class="map"> <div id="map"> <canvas class="map"></canvas> </div> </div></google-map>
![Page 31: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/31.jpg)
Web ComponentsHTML IMPORTS
![Page 32: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/32.jpg)
Web Components: HTML Imports<link rel="import" href="../components/google-map.html">
![Page 33: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/33.jpg)
ES7OBJECT.OBSERVE()
![Page 34: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/34.jpg)
ES7: Object.observe()// html5rocks.com/en/tutorials/es7/observe// Let's say we have a model with datavar model = {};
// Which we then observeObject.observe(model, function(changes){
// This asynchronous callback runs changes.forEach(function(change) {
// Letting us know what changed console.log(change.type, change.name, change.oldValue); });
});
![Page 35: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/35.jpg)
ES6PROMISES
![Page 36: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/36.jpg)
ES6: Promises// html5rocks.com/en/tutorials/es6/promisesvar promise = new Promise(function(resolve, reject) { if (/* everything turned out fine */) { resolve('Stuff worked!'); } else { reject(Error('It broke')); }});
promise.then(function (result) { console.log(result); // "Stuff worked!"}, function(err) { console.log(err); // Error: "It broke"});
![Page 37: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/37.jpg)
ES6MODULES
![Page 38: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/38.jpg)
ES6: Modules// 2ality.com/2014/09/es6-modules-final.html//------ lib.js ------export const sqrt = Math.sqrt;export function square(x) { return x * x;}export function diag(x, y) { return sqrt(square(x) + square(y));}
//------ main.js ------import { square, diag } from 'lib';console.log(square(11)); // 121console.log(diag(4, 3)); // 5
![Page 39: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/39.jpg)
ES6CLASSES
![Page 40: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/40.jpg)
ES6: Classes// javascriptplayground.com/blog/2014/07/introduction-to-es6-classes-tutorialclass Model { constructor (properties) { this.properties = properties; } toObject() { return this.properties; }}
![Page 41: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/41.jpg)
So... Where's Angular?
![Page 42: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/42.jpg)
AngularCUSTOM ELEMENTS
![Page 43: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/43.jpg)
Angular: Custom Elements<google-map latitude="37.77493" longitude="-122.41942"> <google-map-marker latitude="37.779" longitude="-122.3892" title="Go Giants!"></google-map-marker></google-map>
![Page 44: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/44.jpg)
AngularTEMPLATES
![Page 45: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/45.jpg)
Angular: Templatesfunction googleMap () { return { scope: { longitude: '=', latitude: '=' }, template: [ '<div class="map">', '<div id="map"></div>', '</div>', ].join('') };}angular .module('app') .directive('googleMap', googleMap);
![Page 46: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/46.jpg)
Angular"SHADOW DOM"
![Page 47: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/47.jpg)
Angular: "Shadow DOM"<google-map latitude="37.77493" longitude="-122.41942"> <div class="map"> <div id="map"> <canvas class="map"></canvas> </div> </div></google-map>
![Page 48: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/48.jpg)
AngularHTML IMPORTS
![Page 49: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/49.jpg)
Angular: HTML Importsfunction googleMap () { return { scope: { longitude: '=', latitude: '=' }, templateUrl: '../google-map.html' };}angular .module('app') .directive('googleMap', googleMap);
![Page 50: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/50.jpg)
Angular$SCOPE.$WATCH
![Page 51: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/51.jpg)
Angular: $scope.$watchfunction MainCtrl ($scope) { $scope.$watch('model', function (newVal, oldVal) { // });}angular .module('app') .directive('MainCtrl', MainCtrl);
![Page 52: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/52.jpg)
AngularPROMISES
![Page 53: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/53.jpg)
Angular: Promises$http.get('/someurl').then(function (response) { // :)}, function (reason) { // :(});
![Page 54: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/54.jpg)
Above and beyond specsBUILDING ON TOP OF THE WEB PLATFORM
![Page 55: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/55.jpg)
Angular: Dependency Injectionfunction MainCtrl ($scope, $rootScope) {
}angular .module('app') .controller('MainCtrl', MainCtrl);
![Page 56: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/56.jpg)
Angular: Declarative bindings<!-- ng-* --><div ng-controller="UserCtrl as vm"> <h1 ng-bind="vm.title"></h1> <a href="" ng-click="vm.getUsers();">Get users</a></div>
![Page 57: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/57.jpg)
Angular: DOM creation/destruction<ul> <li ng-repeat="user in vm.users"></li></ul>
![Page 58: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/58.jpg)
Angular: JS Objects as DOM<input type="text" ng-model="vm.someModel"><p>{{ vm.someModel }}</p>
<!-- Maps across input value to Object $scope.vm.someModel-->
![Page 59: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/59.jpg)
Angular: Expressions<p>{{ user.name }} | ({{ user.notifications.length }})</p><!--<p>Todd | (2)</p>-->
![Page 60: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/60.jpg)
Angular: Automated events<li ng-repeat="user in vm.users"> <a href="" ng-click="vm.composeEmail()"> Compose email </a></li>
![Page 61: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/61.jpg)
Angular: Component lifecycles▸ Automatic event binding/unbinding
▸ Creation/destruction of DOM and ($scope) Model data▸ ng-ifs, DOM stored in memory
![Page 62: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/62.jpg)
Angular: Routingfunction Router ($routeProvider, $locationProvider) { $routeProvider.when('/inbox', { templateUrl: 'views/mailbox.html', controller: 'InboxCtrl as vm', resolve: InboxCtrl.resolve }).when('/email/:id', { templateUrl: 'views/email.html', controller: 'EmailCtrl as vm', resolve: EmailCtrl.resolve }).otherwise({ redirectTo: 'inbox' });};
angular .module('app') .config(Router);
![Page 63: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/63.jpg)
Angular: Modular JavaScriptangular .module('app', [ 'ngRoute', 'Auth', 'growl' ]);
![Page 64: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/64.jpg)
Angular: Form validation<form name="authForm" ng-submit="vm.submitForm();">
</form><!-- authForm.$pristine authForm.$dirty authForm.$invalid authForm.$valid authForm.$error-->
![Page 65: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/65.jpg)
Where next for Angular?2.0 DRIVE: BIT.LY/ZHQT1Q
![Page 66: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/66.jpg)
Angular 2.0: Faster change detectionES6 Port of Angular.dart change detection
github.com/angular/watchtower.js
![Page 67: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/67.jpg)
Angular 2.0: Template enginegithub.com/angular/templating
@ComponentDirective({ selector: 'tab-container', observe: { 'tabs[]': 'tabsChanged' }, shadowDOM: true})
![Page 68: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/68.jpg)
Angular 2.0: Data persistence▸ ngWebSocket ($ngWebSocket)▸ ngStore ($localStorage, $localDB)
▸ ngOffline ($serviceWorker, $connection)▸ ngData (Models, IAdapter, ChangeEvent)
▸ ngHttp (low-mid level APIs)
![Page 69: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/69.jpg)
Angular 2.0: Annotations// reduces boilerplate and hides angular wireframe@Provide(Heater) export class MockHeater { constructor() {} on() { console.log('Turning on the MOCK heater...'); } off() {} }
![Page 70: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/70.jpg)
Takeaways▸ Angular helps deliver the future now
▸ Frameworks will always be ahead of the web▸ Libs/frameworks help sculpt the future
▸ Where next? See you there!
![Page 71: AngularJS: The Bridge Between Today and Tomorrow's Web (Todd Motto)](https://reader034.fdocuments.us/reader034/viewer/2022052601/559438bf1a28ab187c8b45e9/html5/thumbnails/71.jpg)
Thank you
@toddmottospeakerdeck.com/toddmotto