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

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

AngularJS

1,698
views

Published on

An introduction to AngularJS. There's a little focus on using it with Rails as well.

An introduction to AngularJS. There's a little focus on using it with Rails as well.

Published in: Technology

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,698
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
57
Comments
0
Likes
3
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. AngularJSYAJSCAT - "Yet AnotherJavaScript Client-side ApplicationThingy"
  • 2. The need for YAJSCAT Web applications are getting fancier at an alarming rate!Fancyness middle ages When google ruined everything with gmail Ancient Egyptian "Superhighway" Web Development Boom Time
  • 3. WE MUST DO SOMETHING!!!AngularJS is something. Therefore, we mustdo AngularJS.LOGIC: YOU ARE CONVINCED.
  • 4. Whats in your js directory?● app.js● controllers.js● directives.js● filters.js● services.js
  • 5. AppOrganizes and controls imports for the otherfiles
  • 6. DirectivesAre custom html, this lets you "teach htmlnew tricks". Links behavior or DOMtransformations into the DOM<input ng-model="name"><span ng-bind="name"></span>[elsewhere in js land]function Controller($scope) { $scope.name = default;
  • 7. Filters
  • 8. Serviceslink up to, for example, REST services.
  • 9. TestingIncludes:● end-to-end (integration) testing● unit testingdescribe(Phone detail view, function() { beforeEach(function() { browser().navigateTo(app/index.html#/phones/nexus-s); }); it(should display nexus-s page, function() { expect(binding(phone.name)).toBe(Nexus S); });});(jasmine with a custom DSL)
  • 10. TestingUnits specs include● controllers● directives● filters● services
  • 11. Templatesin the DOM (cf. String-based likehandlebars):<html> <head><title>Foo</title> <body> <div ng-view></div> </body></html>
  • 12. Using it in rails...gem angular-rails
  • 13. BasicallyTell angular about all of your RESTful routes