AngularJS Online Training

In this intermediate software development skills training, you'll learn about AngularJS fundamentals.

Created by Google, AngularJS simplifies the web development experience for web developers. Developers of all skill levels should find a lot to love about AngularJS, and the easy, integrated approach to web development that it offers. New developers will find the basic features of AngularJS covered in rich detail, while Ben takes experienced engineers and architects on a deep dive of advanced topics.

Once you're done with this AngularJS training, you'll know how to use the JavaScript-based library, AngularJS. You’ll also learn about basic AngularJS applications, two-way data binding, controllers, scopes, form validation, directives, dependency injection, promises, unit testing, and application architecture.

For anyone who manages their software development training, this software development training can be used to onboard new software developers, curated into individual or team training plans, or as a software development reference resource.

AngularJS: What You Need to Know

For any software developer looking to improve their proficiency with AngularJS, this software development course covers topics such as:

Understanding the basics of using AngularJS
Data binding and controllers in AngularJS
Managing scope, and using expressions and filters
Using directives and advanced directives
Relying on dependency injection
Leveraging AJAX
Animating with AngularJS
Authenticating with tokens
Handling events and incorporating touchscreen gestures

Who Should Take AngularJS Training?

This AngularJS training is entry-level software development training, which means it was designed for new software developers, or anyone trying to learn AngularJS.

New or aspiring software developers. If you’re a new software developer, be sure to play the field in terms of what areas you work in and what tools and resources you’re familiar with. For example, if you have any interest in working with web development or web-based applications, learning Google’s JavaScript-based library AngularJS is a great way to start your career broad and with lots of future opportunities coding for web applications.

Experienced IT professionals. If you’re in IT but haven’t spent a lot of time working with web applications or web development, you may not be familiar with Google’s AngularJS. This easy, powerful approach to web development is based in JavaScript but has its own special strengths and features. For IT professionals who want to stay up-to-date with web tools and resources, this training on AngularJS is an obvious choice.

Skill:
Basic Angular Concepts and Syntax
- 1. Introduction
  1 min
- 2. Main Benefits of Angular
  15 mins
- 3. Create and Run an Angular App
  18 mins
- 4. Angular Project Structure
  24 mins
Skill:
Angular Components
- 1. Introduction
  1 min
- 2. Create and Display Angular Components
  20 mins
- 3. Insert Variables Into Component HTML
  12 mins
- 4. Introduction to Component Inputs
  16 mins
Skill:
Data and Styling in Angular Applications
- 1. Introduction
  1 min
- 2. Creating Custom Types
  14 mins
- 3. Adding Fake Data For Development
  13 mins
- 4. Adding Styles to Angular Components
  23 mins
Skill:
Basic Event Handling in Angular
- 1. Introduction
  1 min
- 2. Displaying Components in Different Containers
  9 mins
- 3. Handling Click Events
  10 mins
- 4. How is Angular's Event-Handling Different?
  6 mins
- 5. Adding Click-Handlers to Entire Components
  24 mins
Skill:
Introduction to Component State
- 1. Introduction
  1 min
- 2. Creating a Welcome Message
  11 mins
- 3. Showing and Hiding Elements With The ngIf Directive
  9 mins
- 4. Other Methods for Hiding Elements
  12 mins
- 5. Using State to Keep Track of Favorites
  11 mins
Skill:
Angular Component State In-Depth
- 1. Introduction
  1 min
- 2. Where Should We Put Application State?
  21 mins
- 3. Keeping Variables In Sync with Setters
  9 mins
- 4. Displaying Lists with the ngFor Directive
  15 mins
Skill:
Create Reusable Components
- 1. Introduction
  1 min
- 2. Creating a Reusable Component
  11 mins
- 3. Displaying the Same Component with Different Data
  18 mins
- 4. Keeping Variables in Sync with Getters
  10 mins
- 5. Passing Functions as Inputs
  13 mins
Skill:
Introduction to Angular Routing
- 1. Introduction
  1 min
- 2. Adding Routing to an Application
  14 mins
- 3. Creating Page Components
  8 mins
- 4. URL Parameters
  14 mins
- 5. Linking Between Pages
  11 mins
Skill:
Advanced Angular Routing
- 1. Introduction
  1 min
- 2. Navigating Programmatically
  17 mins
- 3. Passing Multiple Functions as Inputs
  15 mins
- 4. Creating a 404 Page
  10 mins
- 5. Displaying 404 Pages Intentionally
  5 mins
Skill:
Local Data Persistence in Angular
- 1. Introduction
  1 min
- 2. Additional Routing Techniques
  9 mins
- 3. Persisting Data in LocalStorage
  25 mins
- 4. Automatically Persisting Member Variables
  11 mins
Skill:
Advanced Data Persistence & Applications
- 1. Introduction
  1 min
- 2. Persisting Data in SessionStorage
  5 mins
- 3. Persisting Data in Cookies
  17 mins
- 4. Sharing Data Between Pages
  15 mins
- 5. Adding Main Application Data to LocalStorage
  12 mins
Skill:
Introduction to Angular Forms
- 1. Introduction
  1 min
- 2. How Forms Used to Work
  12 mins
- 3. Creating A "New" List Item
  12 mins
- 4. Creating Two-Way Form Bindings
  12 mins
- 5. Adding Fields to Forms
  17 mins
Skill:
Advanced Forms and Reusability
- 1. Introduction
  1 min
- 2. Two-Way Bindings with ngModel
  9 mins
- 3. Creating a Reusable Form Component
  10 mins
- 4. Pre-Populating Form Values
  26 mins
Skill:
Introduction to Angular Services
- 1. Introduction
  1 min
- 2. What Are Angular Services?
  8 mins
- 3. Creating and Injecting Services
  13 mins
- 4. Loading Data from a Service
  11 mins
- 5. Storing Complex Logic in Services
  15 mins
Skill:
Multi-Service Applications in Angular
- 1. Introduction
  1 min
- 2. Basic CRUD Operations in Services
  10 mins
- 3. Loading Resources by ID in Services
  7 mins
- 4. Updating Resources in Services
  6 mins
- 5. Creating Resources in Services
  6 mins
- 6. Deleting Resources in Services
  5 mins
- 7. Creating Another Service
  16 mins
Skill:
Introduction to Redux
- 1. Introduction
  1 min
- 2. Basic Redux Concepts
  12 mins
- 3. Basic Application Setup
  10 mins
- 4. Creating Actions and Reducers
  19 mins
- 5. Reading Redux Values and Dispatching Actions
  12 mins
Skill:
Advanced Redux Concepts
- 1. Introduction
  1 min
- 2. Adding Types to a Redux App
  9 mins
- 3. Accessing Multiple Values in Redux
  15 mins
- 4. Creating Redux Selectors
  22 mins
Skill:
Use Redux with Different Inputs
- 1. Introduction
  1 min
- 2. Using MaterialUI Sliders with Redux
  18 mins
- 3. Converting Buttons to Sliders
  12 mins
- 4. Creating a Reusable Color Slider
  18 mins
Skill:
Build a Color-Mixer with Redux
- 1. Introduction
  1 min
- 2. Adding a "New Color" Input
  11 mins
- 3. Deleting Colors
  8 mins
- 4. Combining Hex Colors Using Selectors
  21 mins
- 5. Redux DevTools
  8 mins
Skill:
Work with Dates in Angular
- 1. Introduction
  1 min
- 2. Why is Implementing a Calendar So Difficult?
  6 mins
- 3. Basic Calendar Implementation Strategy
  9 mins
- 4. Introduction to the Moment Library
  19 mins
- 5. Basic Calendar Implementation
  21 mins
Skill:
Build a Reusable Calendar Component
- 1. Introduction
  1 min
- 2. Basic Calendar Controls
  9 mins
- 3. Controlled vs Uncontrolled Components
  15 mins
- 4. Library-Agnostic Components
  13 mins
- 5. Calendars with URL Parameters
  13 mins
Skill:
Build an Angular Event Tracker: The Basics
- 1. Introduction
  1 min
- 2. Event-Tracker Implementation Strategy
  5 mins
- 3. Create a "Vanilla" Angular Modal
  10 mins
- 4. Build a New Event Form
  14 mins
- 5. Show and Hide Modals
  14 mins
Skill:
Build an Angular Event Tracker: Calendar Styling & Decoration
- 1. Introduction
  1 min
- 2. Basic Calendar Styling
  15 mins
- 3. New Event Form Styling
  5 mins
- 4. Create New Events
  14 mins
- 5. Display Events in Calendar Cells
  12 mins
Skill:
Build a Single-Date Date-Picker in Angular
- 1. Introduction
  1 min
- 2. Date-Picker Basics
  20 mins
- 3. Create a Dropdown Component
  7 mins
- 4. Display a Calendar Inside a Dropdown
  9 mins
- 5. Implement Date Selection
  12 mins
Skill:
Build a Date-Range Date-Picker in Angular
- 1. Introduction
  1 min
- 2. Basic Date-Range Setup
  20 mins
- 3. Select Start and End Dates
  9 mins
- 4. Display Multiple Selected Dates
  8 mins
- 5. Select In-Between Dates
  8 mins
Skill:
Build a Multi-Date Date-Picker in Angular
- 1. Introduction
  1 min
- 2. Multi-Date Date-Picker Basics
  9 mins
- 3. Multi-Date Date-Picker TypeScript Logic
  8 mins
- 4. Toggle Selected Dates
  10 mins
- 5. Define Pill-Style Classes
  13 mins
- 6. Check If Previous and Next Dates Are Selected
  12 mins
Skill:
Reusable Forms Deep-Dive: The Basics
- 1. Introduction
  1 min
- 2. Basic Reusable Form Component Design
  7 mins
- 3. Implement an Initial Reusable Form
  20 mins
- 4. Form Field Configuration Options
  16 mins
Skill:
Reusable Forms Deep-Dive: Form Validation Basics
- 1. Introduction
  1 min
- 2. Display Different Input Types
  13 mins
- 3. Basic Form Validation
  14 mins
- 4. Display Form Validation Error Messages
  7 mins
- 5. Display Specific Validation Error Messages
  10 mins
Skill:
Reusable Forms Deep-Dive: Intermediate Form Validation
- 1. Introduction
  1 min
- 2. Handle Form Submission
  9 mins
- 3. Create Reusable Form Validators
  18 mins
- 4. Form Validation with Regular Expressions
  6 mins
- 5. Validate Other Regular Expressions
  10 mins
Skill:
Reusable Forms Deep-Dive: Validation Timing Strategies
- 1. Introduction
  1 min
- 2. Validate Form Fields "On Change"
  15 mins
- 3. Validate On Field-Blur
  6 mins
- 4. Switch Between "On Change" and "On Submit"
  12 mins
- 5. Simplify Validation Logic
  9 mins
Skill:
Reusable Forms Deep-Dive: Work with Different Form Inputs
- 1. Introduction
  1 min
- 2. Basic Strategy for Adding New Input Types
  13 mins
- 3. Create a Separate Text Input Component
  23 mins
- 4. Create Password and Number Input Components
  8 mins
Skill:
Reusable Forms Deep-Dive: Advanced Form Validation
- 1. Introduction
  1 min
- 2. Multi-Field Form Validation
  13 mins
- 3. Create Reusable Multi-Field Validators
  9 mins
- 4. Global Form Validation
  6 mins
- 5. Display Errors on Specific Inputs
  13 mins
- 6. Form Styling
  7 mins
Skill:
Reusable Forms Deep-Dive: Radio Buttons, Checkboxes, and Dropdown Selectors
- 1. Introduction
  1 min
- 2. Create a Reusable Radio Group Component
  21 mins
- 3. Create a Reusable Checkbox Group Component
  13 mins
- 4. Create a Reusable Dropdown Selector Component
  10 mins
Skill:
Essentials of the MEAN Stack
- 1. Introduction
  1 min
- 2. Basic MEAN Stack Structure
  15 mins
- 3. Front-end Setup
  18 mins
- 4. Back-end Setup
  16 mins
Skill:
Angular Network Request Basics
- 1. Introduction
  1 min
- 2. Create "Read" and "Create" Endpoints
  18 mins
- 3. Create "Update" and "Delete" Endpoints
  8 mins
- 4. Load Data with HttpClient and RxJS
  14 mins
- 5. Make "Update" and "Delete" Requests
  7 mins
Skill:
MEAN Stack Database Basics
- 1. Introduction
  1 min
- 2. Make Network Requests from Services
  12 mins
- 3. Basic MongoDB Queries
  20 mins
- 4. Convert Server Endpoints to use MongoDB
  11 mins
Skill:
Angular Full-Stack Conversion: Loading Data
- 1. Introduction
  1 min
- 2. Basic Full-stack Conversion Strategy
  9 mins
- 3. Full-stack Setup and File Structure
  16 mins
- 4. Basic "Read" Endpoints
  11 mins
- 5. Loading Data from the Server
  13 mins
Skill:
Angular Full-Stack Conversion: Creating, Modifying, and Deleting Data
- 1. Introduction
  1 min
- 2. Write "Create" Server Endpoints
  10 mins
- 3. Make "Create" Requests
  8 mins
- 4. Write "Delete" Server Endpoints
  6 mins
- 5. Make "Delete" Requests
  7 mins
- 6. Write "Update" Server Endpoints
  6 mins
- 7. Make "Update" Requests
  9 mins
Skill:
Angular Full-stack Conversion: Convert a Server to MongoDB
- 1. Introduction
  1 min
- 2. Set Up A Mongo Database
  9 mins
- 3. Convert "Read" Endpoints to MongoDB
  12 mins
- 4. Convert "Create" Endpoints to MongoDB
  11 mins
- 5. Convert "Delete" Endpoints to MongoDB
  6 mins
- 6. Convert "Update" Endpoints to MongoDB
  8 mins
Skill:
Build an Angular Event Tracker: Full-stack Conversion
- 1. Introduction
  1 min
- 2. Full-stack Event Tracker Setup
  11 mins
- 3. Loading Events from the Back-end
  11 mins
- 4. Create New Events on the Back-end
  11 mins
- 5. Delete Events on the Back-end
  15 mins
Skill:
Firebase Auth Basics
- 1. Introduction
  1 min
- 2. What is Firebase Auth?
  4 mins
- 3. Creating Pages
  11 mins
- 4. Redirecting Unauthenticated Users
  12 mins
- 5. Signing In With Firebase Auth
  12 mins
- 6. Listening for Auth Changes
  12 mins
Skill:
Account-Creation and Error Handling in Firebase Auth
- 1. Introduction
  1 min
- 2. The Firebase User Object
  9 mins
- 3. Create Firebase Auth Accounts
  11 mins
- 4. Auth Error Handling
  12 mins
- 5. Auth-Conscious Navigation Bars
  15 mins
Skill:
Firebase Auth in Full-Stack Apps
- 1. Introduction
  1 min
- 2. Express Server Setup
  17 mins
- 3. React Front-end Setup
  9 mins
- 4. Making Requests with Auth Tokens
  20 mins
Skill:
Endpoint Security with Firebase Auth
- 1. Introduction
  1 min
- 2. Verifying Tokens with Firebase Admin
  12 mins
- 3. Protecting "Update" and "Delete" Endpoints
  8 mins
- 4. Protecting "Create" Endpoints
  10 mins
- 5. Using Auth Middleware
  11 mins
Skill:
Firebase Auth Basics with Angular
- 1. Introduction
  1 min
- 2. What is Firebase Auth?
  15 mins
- 3. Add Firebase Auth to Angular
  9 mins
- 4. Create Login and Home Pages
  10 mins
- 5. Log In and Log Out
  9 mins
Skill:
Account Creation and Error Handling in Firebase
- 1. Introduction
  1 min
- 2. Protect Pages from Unauthed Users
  17 mins
- 3. Auth Error Handling
  12 mins
- 4. Create New Accounts
  15 mins
Skill:
Firebase Auth In Full-Stack Angular Apps
- 1. Introduction
  1 min
- 2. Back-end Firebase Setup
  19 mins
- 3. Display Firebase Auth User Data
  12 mins
- 4. Store Extra User Data
  12 mins
Skill:
MEAN Stack Endpoint Security with Firebase Auth
- 1. Introduction
  1 min
- 2. Send and Verify Firebase Auth Tokens
  14 mins
- 3. Create an Edit Info Page
  10 mins
- 4. Create Services for Auth Logic
  19 mins
Skill:
Add Firebase Auth to Existing Angular Apps
- 1. Introduction
  1 min
- 2. Basic Front-end Setup
  8 mins
- 3. Add a Login Page
  8 mins
- 4. Add a Create Account Page
  18 mins
- 5. Encapsulate Firebase Auth in a Service
  19 mins
Skill:
Use Firebase Auth to Support Multiple Users
- 1. Introduction
  1 min
- 2. Protect Application Pages
  8 mins
- 3. Rethink Data Structure to Support Multiple Users
  13 mins
- 4. Load User Data and Allow Logging Out
  11 mins
- 5. Use the User's ID in Server Requests
  14 mins
Skill:
Create and Delete Users In Existing MEAN Stack Apps
- 1. Introduction
  1 min
- 2. Create New Users from the Front-end
  19 mins
- 3. Rethinking Our Create-Account Strategy
  8 mins
- 4. Create New Users from the Back-end
  13 mins
- 5. Delete User Accounts
  9 mins
Skill:
Add Endpoint Security to Existing MEAN Stack Apps
- 1. Introduction
  1 min
- 2. Endpoint Security Basics
  10 mins
- 3. Protect GET Endpoints
  20 mins
- 4. Protect Endpoints with Express Middleware
  18 mins
Skill:
MEAN Stack Firebase Auth Best-Practices
- 1. Introduction
  1 min
- 2. Refactor Front-End Auth-Token Logic
  14 mins
- 3. Make Authed Requests Automatically
  15 mins
- 4. Automatic Auth with POST, PUT, and DELETE Requests
  18 mins
Skill:
Build A Note-Sharing App: Create A Simple Angular Front-end
- 1. Introduction
  1 min
- 2. The App We'll Be Building
  11 mins
- 3. Create Pages and Set Up Routes
  15 mins
- 4. Create the Notes List Page
  17 mins
Skill:
Build A Note-Sharing App: Front-end Data Management
- 1. Introduction
  1 min
- 2. Create the Note Detail Page
  17 mins
- 3. Create the Not-Found Pages
  7 mins
- 4. Add CRUD Operations to a Service
  9 mins
- 5. Propagate Data Changes Automatically
  13 mins
Skill:
Build a Note-Sharing App: Create a Back-end with Node and Express
- 1. Introduction
  1 min
- 2. Full-Stack Project Setup
  10 mins
- 3. Load Notes from the Server
  20 mins
- 4. Load Shared Notes from the Server
  6 mins
- 5. Create Notes on the Server
  10 mins
- 6. Update and Delete Notes on the Server
  10 mins
Skill:
Build A Note-Sharing App: Add a Database
- 1. Introduction
  1 min
- 2. Convert Server Endpoints to MongoDB
  22 mins
- 3. Split Express Apps Into Multiple Files
  17 mins
- 4. Make MongoDB Available in Different Files
  12 mins
Skill:
Build A Note-Sharing App: Add User Authentication to the Front-end
- 1. Introduction
  1 min
- 2. Create Login and Create Account Forms
  20 mins
- 3. Install and Set Up Firebase Auth
  16 mins
- 4. Observing Auth Changes
  14 mins
Skill:
Build A Note-Sharing App: Add User Authentication to the Back-end
- 1. Introduction
  1 min
- 2. Install and Set Up Firebase Admin
  8 mins
- 3. Include User Auth Tokens in Requests
  20 mins
- 4. Convert Endpoints for Ownership
  15 mins
- 5. Add a Nav Bar and Logout Button
  15 mins
Skill:
Build A Note-Sharing App: Protect Users' Data
- 1. Introduction
  1 min
- 2. Prevent Unauthorized Note Access
  9 mins
- 3. Prevent Unauthorized Data Modification
  18 mins
- 4. Add Middleware to Route Definitions
  17 mins
- 5. Routes with Multiple Middleware Functions
  12 mins
Skill:
Build A Note-Sharing App: Account Creation Enhancements
- 1. Introduction
  1 min
- 2. Use Angular Route Guards
  18 mins
- 3. Add a Create User Endpoint
  15 mins
- 4. Make Create User Requests from the Front-end
  13 mins
Skill:
Build A Note-Sharing App: User Account Management
- 1. Introduction
  1 min
- 2. Update User Data
  19 mins
- 3. Create a User Info Service
  24 mins
- 4. Delete User Accounts
  10 mins
Skill:
Build A Note-Sharing App: Add Note-Sharing to the Front-end
- 1. Introduction
  1 min
- 2. Create a New Page for Sharing Settings
  17 mins
- 3. Populating Notes with User Info
  20 mins
- 4. Create a Shared Emails List
  14 mins
Skill:
Build A Note-Sharing App: Add Note-Sharing to the Back-end
- 1. Introduction
  1 min
- 2. Add a "Share Note" Endpoint
  19 mins
- 3. Make "Share" Requests from the Front-end
  13 mins
- 4. Add "Unshare" Functionality
  13 mins
- 5. Make "Unshare" Requests from the Front-end
  5 mins
Skill:
Build A Note-Sharing App: Add User Permissions
- 1. Introduction
  1 min
- 2. Basic Strategies for Permission-Levels
  9 mins
- 3. Reformat Data to Accommodate Permissions
  13 mins
- 4. Add Permission Levels to the Front-end
  10 mins
- 5. Modifying Route Handlers for Permissions
  17 mins
Skill:
Build A Note-Sharing App: Email Verification Basics
- 1. Introduction
  1 min
- 2. Fix the Application's Edit Functionality
  12 mins
- 3. Email Verification Basics
  15 mins
- 4. Add SendGrid to a Node.js Application
  16 mins
- 5. Send Emails From A Node Server
  14 mins
Skill:
Build A Note-Sharing App: Intermediate Email Verification
- 1. Introduction
  1 min
- 2. Create a "Please Verify Email" Page
  17 mins
- 3. Send Emails When Users Sign Up
  10 mins
- 4. Generate and Send Email Verification Codes
  17 mins
- 5. Create an Email Verification Server Route
  18 mins
Skill:
Build A Note-Sharing App: Advanced Email Verification
- 1. Introduction
  1 min
- 2. Prevent Front-end Access for Unverified Users
  16 mins
- 3. Automatically Log Out Unverified Users
  10 mins
- 4. Add Middleware for Unverified Users
  22 mins
Skill:
Build A Note-Sharing App: Link Sharing
- 1. Introduction
  1 min
- 2. Link Sharing Basics
  9 mins
- 3. Create a Link-Sharing Section
  14 mins
- 4. Create an Endpoint for Enabling Link Sharing
  10 mins
- 5. Create an Endpoint for Disabling Link Sharing
  6 mins
- 6. Add Link-Sharing Requests to the Front-end
  20 mins
Skill:
Build A Note-Sharing App: Styling and Reusable Components
- 1. Introduction
  1 min
- 2. Create A "New Note" Modal
  19 mins
- 3. Create New Notes
  15 mins
- 4. Delete Notes
  8 mins
- 5. Styling the Entire App
  11 mins
Skill:
Build A Note-Sharing App: Real-Time Communication
- 1. Introduction
  1 min
- 2. Loading Link-Shared Notes from the Server
  15 mins
- 3. Web-Socket Basics
  14 mins
- 4. Add Web-Sockets to Express
  9 mins
- 5. Add Web-Sockets to an Angular App
  12 mins
Skill:
Build A Note-Sharing App: Web-Sockets In-Depth
- 1. Introduction
  1 min
- 2. Load Data via Web-Sockets
  12 mins
- 3. Web-Socket Connections with Auth Tokens
  11 mins
- 4. Add Web-Sockets to Angular Services
  10 mins
- 5. Use Web-Sockets for Note Creation
  13 mins
- 6. Use Web-Sockets for Note Deletion and Updates
  14 mins
Skill:
AngularJS (v2)
- 1. Introduction to AngularJS
  16 mins
- 2. Basics of AngularJS
  25 mins
- 3. Data Binding in AngularJS
  16 mins
- 4. Controllers in AngularJS
  17 mins
- 5. Managing Scope with AngularJS
  18 mins
- 6. Expressions and Filters
  20 mins
- 7. Extending Forms
  23 mins
- 8. Introduction to Directives
  21 mins
- 9. Advanced Directives
  26 mins
- 10. Dependency Injection
  16 mins
- 11. Providers, Services, and Factories
  16 mins
- 12. AngularJS Routing
  26 mins
- 13. Promises in AngularJS
  26 mins
- 14. AJAX With AngularJS
  29 mins
- 15. Animations
  21 mins
- 16. Unit Testing
  29 mins
- 17. Token-Based Authentication
  22 mins
- 18. Handling Events
  19 mins
- 19. Touchscreen Gestures
  16 mins
- 20. Application Architecture
  27 mins