|
|
|
|
|
|
Overview
This class covers a wide variety of AngularJS features.
- Participants will learn all the AngularJS basics, then will build an AngularJS application.
- Focus will on AngularJS 2.0 usage
Learning Objectives
- Participants will learn about the AngularJS basics
- Participants will learn how to build an AngularJS application.
- The Participants will build a seating management application as per specs provided by the customer
- Participants will also understand how to incorporate angularjs features into an existing application - in a hybrid fashion
- Some application functionality will continue to be as per current design
- Some additional features will be added using angularjs design.
Prerequisites
Participants should have experience with HTML, JavaScript, and jQuery or another DOM manipulation library, for example by having worked in server-side web development (in Java, JSP, PHP, ASP, etc.) in the past
Course duration
4 Days
Course outline
Unit 1 : Introduction
- Class Objectives & Roadmap
- Prerequisites Review
- Student Background & Expectations
Unit 2 : What is a SPA?
- Single Page Apps vs Conventional Web Applications
- Where Angular Fits
Unit 3 : Angular Overview
- Setup & Installation
- Templating
- Two-way Data Binding
- Controllers
- Scopes
- HTTP / XHR
- Dependency Injection
- Routing & Multiple Views
- Custom Filters
- Event Handlers
- Intro to Custom Services
Unit 4 : Set up a project workspace
- Installing and Configuring Necessary Tools
- Creating a Starter Application
Unit 5 : Modules
- Purpose
- Advantages
- Warnings
- Recommendations
Unit 6 : Controllers & Scopes in more depth
- Side-by-Side Controllers
- Nested Controllers
- Controller As
- Testing Controllers
Unit 7 : Developing & Debugging
- Recommended Tools
- Techniques
- Common Issues
Unit 8 : Digest Cycle & Watches
- The "watch"
- How It Works
- $apply, $digest, etc.
- Variations
- Performance Considerations
Unit 9 : Form Validation
- Using the Form Element
- Naming Inputs
- Utilizing Form Properties
- Dynamic Styles
Unit 10 : Angular Services
- What are they?
- Why use them?
- Constants & Values
- Services
- Factories
- When to use each kind?
- Testing Services (etc.)
Unit 11 : Promises
- Concepts & Definitions
- The Problem with Callbacks
- More Than Just Async
- The Promises You Already Know
- Essentials
- Chaining Promises
- Error Handling
- Q and $q
- The Deferred Object
- Route Resolve
- Testing with Promises
Unit 12 : Directives
- Concepts & Definitions
- Why Directives?
- Built-In Directives
- Building Custom Directives
- Reusability
Unit 13: Testing in Angular
- Unit testing
- Working with Dependency Injection
- Other Unit testing issues
- End-to-end testing
- Angular-Mock
- Angular's E2E testing framework
- Protractor
- Commands and expectations
- Controlling what happens before and after the test
- Running a scenario
- Jasmine Test Framework
- Challenges for testing
- Jasmine Introduction
- Features: Asserts, Suites, Async, Spies
- Karma Test runner
-
Unit 14: JavaScript TDD with Jasmine
- Justifying test-driven JavaScript development
- Quick review of test-driven development
- Bene?ts of test-driven development
- The test-driven development cadence
- The importance of "spiking"
- karma
- phantom.js
- Introducing Jasmine
- Jasmine suite
- Jasmine specification
- Jasmine Matchers
- Jasmine setup using beforeEach
- Jasmine tear down using afterEach
- Jasmine custom matchers
- Jasmine spies
- Jasmine spy usage
- Loose matching with jasmine.any
- Jasmine asynchronous support
- Jasmine asynchronous example
- Unit testing tips
Unit 15: Testing Angular with Karma
- Installing Karma
- Karma with Webstorm
- Testing Controllers
- Testing Simple Services
- Testing Services with Dependencies
- Testing AJAX Services
- Testing Filters
- Testing Directives - Overview
- Setting up Karma for Testing Directives
- Testing Directives
- End to End Testing - Overview
- Setting up Karma for End to End Testing
- End to End Testing - Part 1
- End to End Testing - Part 2
- Troubleshooting End to End Tests
- karma-coverage
- Code coverage report
- How do we sustain test-driven development
- Functional/acceptance testing
- Hands-on: Implement e2e testing for one scenario
Unit 16: Additional Concepts
- Typical "design patterns" in Angular JS.
- Best Practices
|
|
|
|
|
