AngularJS

Learn how to build and test Single Page Web Applications (SPA) using the AngularJS framework.

Overview

This course enables delegates to build Single Page Web Applications (SPA) via the AngularJS framework from Google. Delegates gain an understanding of how to use Angular at all levels in real world applications, from basic templates and interaction with RESTFul services to Karma based testing, module reuse and creating directives.

The duration of the course and depth of material covered can be adjusted based on the audience. For junior developers the course is delivered over 4 days and includes a detailed overview of Javascript. For senior developers the course can be delivered over 3 days.

By default the course uses Chrome for all the examples and exercises.

Outline

Introduction to JavaScript (Optional)

  • How JavaScript began and grew in respectability
  • JavaScript as the ‘assembly language of the web’
  • The core JavaScript types and dynamic typing
  • Explicit and implicit variable declarations
  • Implicit conversions and the bugs they can cause
  • Minimizing your program’s use of global variables
  • Using typeof and instanceof to investigate types
  • The lack of block scope and ‘variable hoisting’
  • Understanding truth and equality in JavaScript
  • Making choices, basic iteration and the for…in loop
  • Manipulating strings and applying regular expressions
  • Working with single and multi-dimensional arrays
  • The difference between arrays and ‘array-like’ objects
  • Functional Programming with ‘Underscore.js’
  • Using functions as the unit of composition
  • Replacing external iteration with each, filter and map
  • Producing a single value from a list via folds and reduction
  • Applying currying and partial application in JavaScript
  • Writing recursive functions and the Trampoline Principle

Introduction to AngularJS

  • Moving to the browser with client side MVC
  • Interacting with the DOM declaratively rather than imperatively (jQuery)
  • Overview of the main components of Angular
  • Walking through a complete Angular application
  • How Angular uses modules for partitioning and reuse
  • Best practices for structuring Angular applications

Views Within An Angular App

  • Introduction to request routing in Angular
  • Creating HTML templates in Angular
  • Combining partial templates with ng-include
  • Applying class changes with ng-class
  • Changing element visability with ng-hide and ng-show
  • Adding visual effects with ng-animate

Controllers and the Model

  • Why two way binding is essential in SPA
  • Two way binding between the view and model in Angular
  • Introduction to how Angular manages scopes
  • Avoiding manual interaction with the DOM
  • Converting legacy jQuery code to Angular
  • Details of the evaluation loop within Angular
  • When to use apply and digest

Angular Directives in Depth

  • The Angular way to interact with the DOM
  • Smart templating with directives
  • The NVD3 directive for dynamic graphing
  • The Select2 directive for filterable select dropdowns
  • The Bootstrap directive for responsive designs
  • An overview of directive scoping

Filtering and Sorting Data

  • Formatting dates and text
  • Basic search using $filter
  • In browser sorting $orderBy
  • Creating your own custom filters
  • Paging via $limitTo and a custom offset filter

Communicating with Services

  • Managing interaction between controllers
  • Using Restangular to communicate with RESTful services
  • Accessing cookies and using HTML5 data stores within the browser
  • Enabling authentication with a stateless external API

Testing with Karma

  • Installing and configuring Karma
  • Using Karma to provide coverage stats
  • Writing Karma tests for filters
  • Testing controllers with Karma
  • Overview of directive testing
  • Dependency injection and mocking

Requirements

  • Delegates should have previous programming experience (from university and/or industry) in one or more of Java, C#, C++, Perl, Python and Ruby

Sign up and stay in the loop

Be the first to know about upcoming workshops, courses, talks and events

Learn more

As expected from Instil, the course was excellent and I'd be stuck to find fault as it covered everything I didn't know about Angular and corrected what I thought I knew already.