AngularJS in Action
Lukas Ruebbelke
Foreword by Martin Gontovnikas
  • July 2015
  • ISBN 9781617291333
  • 192 pages
  • printed in black & white

Learn how to build an exciting application from the top to bottom with AngularJs.

From the Foreword by Martin Gontovnikas, Developer Advocate, Auth0

AngularJS in Action covers everything you need to know to get started with the AngularJS framework. As you read, you'll explore all the individual components of the framework and learn how to customize and extend them. You'll discover the emerging patterns for web application architecture and tackle required tasks like communicating with a web server back-end. Along the way, you'll see AngularJS in action by building real world applications with thoroughly commented code.

Table of Contents show full




about this book

about the authors

about the cover illustration

Part 1 Get acquainted with AngularJS

1. Hello AngularJS

1.1. Advantages of using AngularJS

1.2. The AngularJS big picture

1.3. Build your first AngularJS application

1.3.1. The module

1.3.2. Views and controllers

1.3.3. Services

1.3.4. Directives

1.4. Summary

2. Structuring your AngularJS application

2.1. Hello Angello

2.2. AngularJS application structure

2.3. Laying the Angello foundation

2.4. Basic routes and navigation

2.5. A few best practices

2.6. Summary

Part 2 Make something with AngularJS

3. Views and controllers

3.1. The big picture

3.2. What is an AngularJS view?

3.3. What is an AngularJS controller?

3.3.1. The digest cycle

3.3.2. Controller as syntax

3.3.3. AngularJS events

3.4. Properties and expressions

3.4.1. Display stories with ngRepeat

3.4.2. Filters

3.4.3. Expressions

3.5. Best practices and testing

3.6. Summary

4. Models and services

4.1. What are models and services?

4.1.1. Hello services

4.1.2. The service lifecycle

4.1.3. The different types of services

4.2. Models with $http

4.2.1. What is $http?

4.2.2. Create your first model

4.2.3. $http convenience methods

4.3. Promises

4.3.1. What are promises?

4.3.2. Promises in action

4.3.3. $http.success and $http.error

4.3.4. Elegant sequencing with promises

4.4. $http interceptors

4.4.1. Why intercept?

4.4.2. Interceptors in action

4.5. Service decorators

4.5.1. Why decorate?

4.5.2. Enhanced logging

4.6. Testing consideration

4.6.1. Testing a service

4.6.2. Using $httpBackend to mock server calls

4.6.3. Best practices

4.7. Summary

5. Directives

5.1. Introduction to directives

5.1.1. What are directives?

5.1.2. Why we need directives

5.1.3. Why we want directives

5.2. Directives 101: a quick foundation

5.2.1. The user story directive

5.3. A more advanced feature

5.3.1. The drag-and-drop feature

5.3.2. Use the drag-container directive

5.3.3. Build the controller

5.3.4. Create the drop-container directive

5.3.5. Use the drop-container directive

5.3.6. Build the controller

5.3.7. Create the drop-target directive

5.3.8. Use the drop-target directive

5.3.9. Build the controller

5.3.10. Create the $dragging service

5.3.11. Update the StoryboardCtrl

5.4. Integrating with third-party libraries again!

5.4.1. Install Flot

5.4.2. Build the directive

5.4.3. Use the directive

5.4.4. Massage our data

5.4.5. It’s time we had the "isolated scope talk"

5.4.6. Grand finale: breathe life into Flot

5.5. Testing a directive

5.6. Best practices

5.7. Summary

6. Animations

6.1. Intro to animations

6.1.1. How AngularJS handles animations

6.1.2. The animation-naming convention

6.1.3. Animations enable!

6.2. CSS transitions

6.2.1. Define the base transition

6.2.2. Define the ng-enter transitions

6.2.3. Define the ng-leave transitions

6.2.4. Making it move

6.3. CSS animations

6.3.1. Define the base animation classes

6.3.2. Define the animation keyframes

6.3.3. Make it move

6.4. JavaScript animations

6.4.1. Defining the JavaScript animation

6.4.2. The JavaScript animation events

6.4.3. The JavaScript animation class

6.4.4. TweenMax

6.4.5. Making it move

6.5. Testing

6.6. Best practices

6.7. Summary

7. Structuring your site with routes

7.1. The components of AngularJS routes

7.2. How to create routes in AngularJS

7.2.1. Create your first route with ngRoute and ngView

7.2.2. Add ngView

7.2.3. Set up your route with $routeProvider

7.2.4. Set up route navigation

7.2.5. Review

7.3. Using parameters with routes

7.3.1. Review

7.4. Using resolve with routes

7.4.1. Review

7.5. Route events

7.5.1. Review

7.6. Testing

7.7. Best practices

7.8. Summary

8. Forms and validations

8.1. The big picture: AngularJS form validation

8.1.1. Extending HTML form elements

8.1.2. Adding validations

8.1.3. Form validation and CSS

8.1.4. Form validation, $setPristine, and $setUntouched

8.2. Testing

8.3. Best practices

8.4. Summary

Appendix A: Setting up Karma

A.1. Setting up Karma

A.2. Install Node.js and Node Package Manager (npm)

A.3. Install packages

A.4. Initialize Karma

A.5. Use Karma

Appendix B: Setting up a Node.js server

B.1. Setting up a Node.js server

B.2. Installing Node.js (with Node Package Manager, a.k.a. npm) and MongoDB

B.3. Initialize the repo

B.4. Update EndpointConfigService.js

B.5. A note about Auth0

Appendix C: Setting up a Firebase server

C.1. Setting up a Firebase server

C.2. Set up an account with Firebase

C.3. Create your first app

C.4. Bootstrap your Firebase app to Angello

C.5. A note about Auth0

Appendix D: Running the app

D.1. Running the app

D.2. Get the code

D.3. Start the server

D.4. View the app


© 2014 Manning Publications Co.

About the Technology

AngularJS is a JavaScript-based framework that extends HTML, so you can create dynamic, interactive web applications in the same way you create standard static pages. Out of the box, Angular provides most of the functionality you'll need for basic apps, but you won't want to stop there. Intuitive, easy to customize, and test-friendly, Angular practically begs you to build more interesting apps.

About the book

AngularJS in Action teaches you everything you need to get started with AngularJS. As you read, you'll learn to build interactive single-page web interfaces, apply emerging patterns like MVVM, and tackle key tasks like communicating with back-end servers. All examples are supported by clear explanations and illustrations along with fully annotated code listings.

What's inside

  • Get started with AngularJS
  • Write your own components
  • Best practices for application architecture
  • Progressively build a full-featured application
  • Covers Angular JS 1.3
  • Sample application updated to the latest version of Angular

About the reader

This book assumes you know at least a little JavaScript. No prior exposure to AngularJS or other web frameworks is required.

About the author

Lukas Ruebbelke is a full-time web developer and an active contributor to the AngularJS community.

combo USD44.99 pBook + eBook
eBook USD35.99 pdf + ePub + kindle

FREE domestic shipping on three or more pBooks

The coolest way to create a web application I've ever seen!

William E. Wheeler, ProData Computer Services

The best introduction to AngularJS so far.

Gregor Zurowski, Sotheby's

Packed with practical examples and best practices.

Ahmed Khattab, Cisco Services