Browse all Angular 1.x lessons.

showing All 309 lessons...

Auth Interceptor in Angular for JWT

P

Server JWT Authentication Setup

P

JWT Authentication Setup

P

Client Setup for JWT Authentication

Basic Server Setup for JWT Authentication

JSON Web Token (JWT) Introduction

Decorating an Angular event for composed behavior

P

The basics of $scope.$watch

Refactoring: Replace Loop with Collection Closure using Lodash

P

Refactoring: Polymorphic Functions

P

Using ng-annotate for min-safe AngularJS

P

Refactoring: Extract Method

P

Lazy loading Angular modules with ocLazyLoad

P

Using the Angular scope $destroy event and method.

P

Building an Angular App: Eggly Review

Building an Angular App: Deleting an item from a collection

Building an Angular App: Editing a bookmark with ng-model and a controller

Using the LocalForage library for offline storage with Angular

P

Building an Angular App: Add a bookmark with ng-submit and ng-model

Building an Angular App: Simple States

e2e Testing AngularJS Apps with Protractor and SauceLabs

P

Refactoring: Unit Test Coverage Report Setup

P

Building an Angular App: Filters

Building an Angular App: Controllers

Building an Angular App: Bootstrapping

Building an Angular App: Eggly Introduction

Debounce (delay) User Input in AngularJS with Lodash

P

Using Protractor to Test Mobile Safari with Appium

P

Directive Definition Object (DDO)

$apply vs $digest

Protractor: Running tests on multiple browsers

P

ui-router: Abstract States

P

caching with $http

P

ui-router: Activating States

Protractor Interactive

ngModelController render function

P

Introduction to Grunt for Angular

ngModelController: viewValue-modelValue relationship

P

Finishing Validatable

P

CodeSchool Refactor - Flexible Directives Part 2/2

CodeSchool Refactor - Reusable Directives Part 1/2

Using ngModel in Custom Directives

Errorable Mixin

Mixing in Validatable

P

Validations Class

P

Adding Child Validators

P

Greensock TimelineLite Animation Sequences

P

Basic Implementation of Configurable Validations

P

Model Validation Design Review

Refactor The Model Base Class with Mixins

P
angularjs tutorial about Auth Interceptor in Angular for JWT

Auth Interceptor in Angular for JWT

7:53 angularjs PRO

Adding JWT support to the client. Storing the token in local storage, then creating a http interceptor to add the token to requests made to the server. Also implementing logout.

angularjs tutorial about Server JWT Authentication Setup

Server JWT Authentication Setup

4:03 angularjs PRO

Adding JWT support to the server. Signing a JSON object as a payload and sending the signed token to the browser on authentication.

angularjs tutorial about JWT Authentication Setup

JWT Authentication Setup

4:15 angularjs PRO

Setting up a login on the angular app and an authentication endpoint on the server.

angularjs tutorial about Client Setup for JWT Authentication

Client Setup for JWT Authentication

3:33 angularjs

Creating a basic Angular application to access the random users resource. Also setting up CORS on the node server to enable the resource sharing across different domains (ports in our case).

angularjs tutorial about Basic Server Setup for JWT Authentication

Basic Server Setup for JWT Authentication

1:44 angularjs

Creating the basic node server to serve up random users via API endpoints.

angularjs tutorial about JSON Web Token (JWT) Introduction

JSON Web Token (JWT) Introduction

1:23 angularjs

A basic introduction to the mechanics of JWTs and the application we will be building in this lesson series.

angularjs tutorial about Decorating an Angular event for composed behavior

Decorating an Angular event for composed behavior

6:16 angularjs PRO

Events are a useful tool for triggering functionality based on something that has occurred in your application. In this lesson, we will build upon the concepts from the create a scope decorator lesson to create an event decorator that can be used to cleanly compose functionality on top of Angular events.

angularjs tutorial about The basics of $scope.$watch

The basics of $scope.$watch

6:32 angularjs

With AngularJS's $scope.$watch, you are able to monitor scope values for changes. This can be useful for validation of user input, as an example.

angularjs tutorial about Refactoring: Replace Loop with Collection Closure using Lodash

Refactoring: Replace Loop with Collection Closure using Lodash

6:49 angularjs PRO

Logic often gets added to our loops. We need to iterate over a collection, and get the sum of values, for instance. This approach can lead to complicated methods, that are hard to test. Using Lodash (Underscore), we are going to extract logic in a large loop body into well named methods. The result will be cleaner and easier to understand.

angularjs tutorial about Refactoring: Polymorphic Functions

Refactoring: Polymorphic Functions

4:37 angularjs PRO

if-statements can add serious complexity and beg for refactoring. You can use polymorphic functions to simplify your ifs and dynamically call the appropriate method.

angularjs tutorial about Using ng-annotate for min-safe AngularJS

Using ng-annotate for min-safe AngularJS

6:03 angularjs PRO

When you minify your code with a tool like Uglify, the resulting minified file will rename variables. This is a problem for AngualrJS, which uses parameter names to provide injected dependencies. You could use the array notation manually, but no human should ever have to suffer this fate, or you could use ng-annotate with Grunt, and let your helper robots get the job done instead.

angularjs tutorial about Refactoring: Extract Method

Refactoring: Extract Method

8:15 angularjs PRO

Refactoring is a fact of life, and the "extract method" refactoring is the cornerstone of improving your code.

angularjs tutorial about Lazy loading Angular modules with ocLazyLoad

Lazy loading Angular modules with ocLazyLoad

5:33 angularjs PRO

With the ocLazyLoad you can load AngularJS modules on demand. This is very handy for runtime loading of Angular modules in large applications.

angularjs tutorial about Using the Angular scope $destroy event and method.

Using the Angular scope $destroy event and method.

4:25 angularjs PRO

With Angular scopes, you have access to a $destroy event that can be used to watch $scope events. This is used for cleanup, and gives you a final opportunity to access any data on a scope. Scopes also have a (rarely used) $destroy method that allows you to manually destroy a scope.

angularjs tutorial about Building an Angular App: Eggly Review

Building an Angular App: Eggly Review

4:57 angularjs

Let's review everything that we have learned up this point and discuss what we are going to be learning in the next section.

Be sure to check out Part 2: Application Architecture

angularjs tutorial about Building an Angular App: Deleting an item from a collection

Building an Angular App: Deleting an item from a collection

3:50 angularjs

We are going to complete the bookmark management functionality by showing how to delete a bookmark from the bookmarks collection.

The source for this lesson can be found on Github. Tags correspond to the lesson.

angularjs tutorial about Building an Angular App: Editing a bookmark with ng-model and a controller

Building an Angular App: Editing a bookmark with ng-model and a controller

9:13 angularjs

We are going to learn how to edit an existing bookmark by building on a lot of the same techniques from the previous video. We will also learn how to edit a bookmark and not actually save the change back to the collection until we are ready.

Find the code on Github. Tags correspond to the lesson.

angularjs tutorial about Using the LocalForage library for offline storage with Angular

Using the LocalForage library for offline storage with Angular

1:39 angularjs PRO

The angular-localforage library makes simple offline storage easy.

angularjs tutorial about Building an Angular App: Add a bookmark with ng-submit and ng-model

Building an Angular App: Add a bookmark with ng-submit and ng-model

5:38 angularjs

We are going to learn how to create a bookmark by adding it to the bookmarks collection. We will learn how to submit the contents of a form to the controller to be processed by exploring ng-submit and ng-model.

The source for this lesson can be found here on Github. Tags correspond to the lessons.

angularjs tutorial about Building an Angular App: Simple States

Building an Angular App: Simple States

8:44 angularjs

We are going to learn how to manage simple states within our controller. We are going to learn how to toggle between the editing and creating bookmark states and how to sequence those interactions in the controller.

note: The code for this lesson can be found on Github. The tags correspond to the lessons.

angularjs tutorial about e2e Testing AngularJS Apps with Protractor and SauceLabs

e2e Testing AngularJS Apps with Protractor and SauceLabs

6:48 angularjs PRO

When you are running end-to-end (e2e) tests against your AngularJS apps, they will need to be run against a rainbow of varied browsers. This can be a logistics nightmare, but luckily there are services like SauceLabs that can make this much more manageable. In this lesson, we will take a look at configuring and running e2e tests with SauceLabs.

angularjs tutorial about Refactoring: Unit Test Coverage Report Setup

Refactoring: Unit Test Coverage Report Setup

5:42 angularjs PRO

The "R" word. Refactoring. The first step in refactoring code is to make sure we are covering the existing code with tests. If we aren't refactoring against tested code, we are just changing stuff. In this lesson, we'll start taking a look at some code that needs refactoring, and get test coverage reports setup.

angularjs tutorial about Building an Angular App: Filters

Building an Angular App: Filters

6:28 angularjs

We are going to learn how to filter our bookmarks based on the selected category. We will learn how to manage the current category in the controller as well as set the current category from the view. As a bonus, we will see how to dynamically apply a class to visually indicate what category is the currently selected category.

The code for this lesson can be found on Github. note: the tags correspond to the lessons.

angularjs tutorial about Building an Angular App: Controllers

Building an Angular App: Controllers

7:58 angularjs

We are going to take the static HTML elements and dynamically display them on the page by setting up an AngularJS controller and hooking it up with AngularJS templating in the view.

The code for this lesson can be found on Github. Note: the tag name corresponds to the lesson.

angularjs tutorial about Building an Angular App: Bootstrapping

Building an Angular App: Bootstrapping

3:48 angularjs

In this lesson, we learn how to take a static HTML page and tap into the power of AngularJS by bootstrapping the framework.

angularjs tutorial about Building an Angular App: Eggly Introduction

Building an Angular App: Eggly Introduction

1:54 angularjs

In this lesson, we introduce our sample AngularJS application and discuss our objectives for this series.

angularjs tutorial about Debounce (delay) User Input in AngularJS with Lodash

Debounce (delay) User Input in AngularJS with Lodash

3:42 angularjs PRO

Lodash has an enormous amount of utility functions for dealing with collections and objects in javascript. You can use it in your AngularJS applications to "debounce" user input, or add delay between user actions. This is a common technique for text input to hold firing service calls until the user stops typing for a fraction of a second.

angularjs tutorial about Using Protractor to Test Mobile Safari with Appium

Using Protractor to Test Mobile Safari with Appium

4:57 angularjs PRO

When running end-to-end tests with Protractor for your AngularJS applications, you'll want to test mobile as well. Appium helps make that happen.

angularjs tutorial about Directive Definition Object (DDO)

Directive Definition Object (DDO)

1:19 angularjs

Directive Definition Objects are used to configure AngularJS directives. Be sure to check out our Directive Definition Object Cheat Sheet.

angularjs tutorial about $apply vs $digest

$apply vs $digest

2:25 angularjs

$apply and $digest are both methods on AngularJS scopes that allow you to manually trigger the updates to bound properties on your scopes.

angularjs tutorial about Protractor: Running tests on multiple browsers

Protractor: Running tests on multiple browsers

8:12 angularjs PRO

Testing your AngularJS application on multiple browsers is important, and Protractor offers this ability through the multiCapabilities configuration option. Learn how to use this option, as well as configure your e2e tests to run on only a single browser for rapid development.

The full source for the base project can be downloaded here

angularjs tutorial about ui-router: Abstract States

ui-router: Abstract States

3:17 angularjs PRO

ui-router has the powerful ability to define abstract states, or states that can't be navigated to, but are useful for defining a set of states with shared properties.

angularjs tutorial about caching with $http

caching with $http

2:17 angularjs PRO

By default your HTTP requests with the $https service in Angular are not cached. By setting some options, you can turn caching on.

angularjs tutorial about ui-router: Activating States

ui-router: Activating States

4:04 angularjs

The ui-router library for AngularJS provides several options for navigating between states in your application. You can navigate via the browser's URL bar, programatically with $state.go, and with the ui-sref directive on your HTML elements.

angularjs tutorial about Protractor Interactive

Protractor Interactive

1:44 angularjs

Did you know that Protractor has a handy interactive mode to help with writing/debugging your end-to-end (e2e) tests?

angularjs tutorial about ngModelController render function

ngModelController render function

2:04 angularjs PRO

When implementing ng-model on your reusable AngularJS directives, you need to implement the render function.

angularjs tutorial about Introduction to Grunt for Angular

Introduction to Grunt for Angular

2:19 angularjs

Task automation is critical for any AngularJS single-page application. Grunt gets the job done.

angularjs tutorial about ngModelController: viewValue-modelValue relationship

ngModelController: viewValue-modelValue relationship

2:20 angularjs PRO

This lesson takes a look at the AngularJS internals to better understand what Angular is doing under the hood with ngModel to keep data and views in sync.

angularjs tutorial about Finishing Validatable

Finishing Validatable

13:13 angularjs PRO

We can now finalize the Validatable piece of our data modeling library.

This lesson is part of a series. Be sure to watch the previous lessons to fully understand what is going on!

angularjs tutorial about CodeSchool Refactor - Flexible Directives Part 2/2

CodeSchool Refactor - Flexible Directives Part 2/2

14:25 angularjs

In collaboration with CodeSchool, John takes the reusable directives from the previous video and works them into more flexible and easy to use directives.

angularjs tutorial about CodeSchool Refactor - Reusable Directives Part 1/2

CodeSchool Refactor - Reusable Directives Part 1/2

5:47 angularjs

In collaboration with CodeSchool, John refactors pieces of the CodeSchool Angular app into a more reusable directives.

angularjs tutorial about Using ngModel in Custom Directives

Using ngModel in Custom Directives

1:42 angularjs

You can use ngModel in your own directives, but there are a few things you'll need to do to get it working properly.

angularjs tutorial about Errorable Mixin

Errorable Mixin

11:08 angularjs

Now that we have validations, we will want to be able to provide the user feedback on the errors in models. This is useful for forms, and is a critical part of the validation process.

This lesson is part of a series!

angularjs tutorial about Mixing in Validatable

Mixing in Validatable

12:07 angularjs PRO

Now that the validation component has progressed, we can start mixing it in for usage.

This video is a part of a series, you'll want to watch the earlier lessons before this one.

angularjs tutorial about Validations Class

Validations Class

2:16 angularjs PRO

Now we bring the validations together with a Validations class.

angularjs tutorial about Adding Child Validators

Adding Child Validators

9:30 angularjs PRO

To make our AngularJS data model validation more robust, we want the ability to make complex validators that have child validators.

angularjs tutorial about Greensock TimelineLite Animation Sequences

Greensock TimelineLite Animation Sequences

10:18 angularjs PRO

TimelineLite is a piece of the Greensock TweenMax library that provides the ability to create sequenced animation with very little code or setup.

angularjs tutorial about Basic Implementation of Configurable Validations

Basic Implementation of Configurable Validations

9:08 angularjs PRO

With the roadmap set, we will start to implement configurable validations for our Models.

angularjs tutorial about Model Validation Design Review

Model Validation Design Review

7:31 angularjs

We want robust validation for our AngularJS models. This will require a bit of forethought, and this lesson will examine the goals that we have for the validation piece of our model library.

angularjs tutorial about Refactor The Model Base Class with Mixins

Refactor The Model Base Class with Mixins

11:20 angularjs PRO

We've built a base class that is starting to sprawl, and now we want to unit test and refactor out the caching logic into a mixin that will handle this functionality.

This lesson is part of a series.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?