Devox UK 2013 - AngularJS

Transcript

1. 1.

   None
2. 2.

   AngularJS – Extend Your Browser Peter Bacon Darwin Developer /

   Dad @petebd
3. 3.

   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
4. 4.

   Driving in London

5. 5.

   Faster, Better!

6. 6.

   Think Outside the Box

7. 7.

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

   2006 jQuery 7
8. 8.

   In the Future… Web Browser == Application Platform

9. 9.

   Single Page Applications (SPA) we need some help… Writing SPAs

   in JavaScript is… messy
10. 10.

    JavaScript Frameworks There are plenty out there: Agreement No Progressive

    Enhancement MV … Whatever Data Binding Disagreement Backend Integration Binding Updates HTML vs JavaScript Views
11. 11.

    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()
12. 12.

    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!
13. 13.

    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
14. 14.

    Exchange Rate App Demo

15. 15.

    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
16. 16.

    Trending Up!

17. 17.

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

18. 18.

    Q&A