Your SlideShare is downloading. ×
Advanced AngularJS Concepts
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Advanced AngularJS Concepts

2,201

Published on

Slides from my Advanced AngularJS Concepts talk at Prairie Developer Conference 2014

Slides from my Advanced AngularJS Concepts talk at Prairie Developer Conference 2014

Published in: Software, Technology, Education
0 Comments
11 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,201
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
141
Comments
0
Likes
11
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. @kylehodgson www.kylehodgson.com
  • 2. +
  • 3. AngularJS Architectural Advice
  • 4. Big Ball of Mud
  • 5. Avoid binding to functions
  • 6. DOM Manipulation
  • 7. Isolate Scope Directives
  • 8. Isolate scope
  • 9. Isolate scope
  • 10. Isolate scope ←fail
  • 11. Isolate scope ← amaze
  • 12. Isolate scope: Attributes Directives
  • 13. Isolate scope
  • 14. Isolate scope: attributes ← attribute attribute
  • 15. Isolate scope: attributes attribute
  • 16. Isolate scope: attributes
  • 17. Bindings Isolate scope
  • 18. @:  attribute =:  binding &:  expression
  • 19. Expressions Isolate scope
  • 20. Isolate scope: expressions ← expression
  • 21. Isolate scope: expressions ← expression
  • 22. Isolate scope: expressions expression
  • 23. Isolate scope: expressions
  • 24. Isolate scope: expressions
  • 25. Accessibility AngularJS & the ADA
  • 26. ADA & AngularJS “double you double you double you dot yahoo dot com slash is not available h t m l content search search ten percent text ten percent loaded”
  • 27. ADA & AngularJS Consider not making an SPA
  • 28. ADA & AngularJS Bake it in from the start
  • 29. ADA & AngularJS Keep things simple
  • 30. Use ARIA Effectively ADA & AngularJS
  • 31. Detection & Affordance ADA & AngularJS
  • 32. ADA & AngularJS
  • 33. SEO Issues & solutions
  • 34. SEO & AngularJS
  • 35. SEO & AngularJS
  • 36. Duck Angular Angular Integration Testing
  • 37. Duck Angular Run it in Karma Get it with Bower bower install duck-angular
  • 38. Duck Angular & Karma
  • 39. Toy App: ToDontList Story Epic As a busy executive with too much to do, I would like to see a list of things that are not worth my time, So that I can avoid doing them.
  • 40. App.js
  • 41. Duck Angular: Bindings
  • 42. Duck Angular: Interactions
  • 43. Duck Angular: Directives
  • 44. Duck Angular: Bindings
  • 45. Anatomy of a Duck Angular spec Duck Angular
  • 46. End to End Testing AngularJS
  • 47. E2E http://docs.angularjs.org/guide/e2e-testing sic: ‘depricated’ is misspelled on angularjs.org
  • 48. Selenium • Mature • Well understood • “Enterprise strength” • Terrible “SPA” support
  • 49. Protractor Functional Testing for AngularJS https://github.com/angular/protractor
  • 50. Protractor Not good (with) Karma.
  • 51. searches for elements by matching binding names, either from ng-bind or {{}} notation in the template by.binding
  • 52. by.model by.model searches for elements by input ng-model
  • 53. by.repeater by.repeater searches for ng-repeat elements.
  • 54. Putting it all together
  • 55. Web server Selenium Java Protractor pre-reqs
  • 56. Questions? Kyle Hodgson www.kylehodgson.com @kylehodgson Avishek “Mojo” Sen Gupta www.avishek.net @avisheksengupta www.angularjs.org www.yearofmoo.com www.egghead.io www.pluralsight.com github.com/asengupta/duck-angular github.com/kylehodgson/angular-toy

×