No content

AngularJS – Extend Your Browser Peter Bacon Darwin Developer / Dad @petebd 

3 Peter Bacon Darwin Computer Programmer / House Dad ■ Freelance Developer ■ Formerly .NET Specialist ■ Now into Open Source ■ AngularJS ■ Committer on AngularJS project ■ Founder Member of Angular-UI ■ Look after my kids, Lily and Zachary 

Driving in London 

Faster, Better! 

Think Outside the Box 

In The Beginning… 1989 Web Browsers 1995 JavaScript 2005 AJAX 2006 jQuery 7 

In the Future… Web Browser == Application Platform 

Single Page Applications (SPA) we need some help… Writing SPAs in JavaScript is… messy 

JavaScript Frameworks There are plenty out there: Agreement No Progressive Enhancement MV … Whatever Data Binding Disagreement Backend Integration Binding Updates HTML vs JavaScript Views 

The Real Problem - Browsers Designed to: Display Static Documents Navigate Hyperlinks Be Stateless Need: Model Driven Views More Powerful Widgets State Management Getting There… Object.Observe() Web Components History.pushState() 

A Different Approach… … what HTML would have been had it been designed for applications. … a Polyfill until Browsers catch up! HTML enhanced for web apps! 

AngularJS – Core Features Unobtrusive Data Binding Just POJOs and dirty checking HTML (DOM) Templates Use tools you know Reusable Components Extend the HTML syntax Dependency Injection Think Spring Framework Unit Testing Built-in First Class Citizens Useful Services $http, $q, $timeout 

Exchange Rate App Demo 

Angular-UI Project  Directives and Filters Date Picker, Key Press Events, Masked Input, Google Maps Highlight Text, Unique Array Filter, String Formatting  Bootstrap Widgets Accordion, Alert, Buttons, Carousel, Dialogs Dropdowns, Pagination, Tabs, Tooltips, TypeAhead  Data Grid Full featured grid widget  Router State based routing with nested views 

Trending Up! 

Buy The Book! http://www.packtpub.com/angularjs-web-application-development/book 

Q&A