These are a variety of egghead style lessons. They range in length and presentation, and reflect the instructors own style. None of them are perfect, but they are all awesome. 👍

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.

ui-router: Activating States

Learn how two common array functions - map() and filter() - are syntactic sugar for reduce operations. Learn how to use them, how to compose them, and how using reduce can give you a big performance boost over composing filters and maps over a large data set.

Use Reduce to Filter and Map over Large Datasets

Learn how to create an Immutable.Map() through plain Javascript object construction and also via array tuples. 

Creating an Immutable Object Graph with Immutable.js Map()

You will learn how to write the reducer for the counter application in a test driven development way, as well as the conventions in implementing reducers.

Redux: Writing a Counter Reducer with Tests

In AngularJS, multiple HTTP requests can be coordinated with $q.all, making your project's code cleaner and more testable.

Multiple HTTP Requests with $q

Building a demo AngularJS directive named Zippy using ng-model, ng-click and transclusion (no controller)

Building Zippy

The way you make HTTP requests in React Native is with fetch. In this video, we'll add integration with the github API into our app using fetch.

Use Fetch to Load External Data in React Native

Before you use the React Redux bindings, learn how to create a complete simple application with just React and Redux.

Redux: React Counter Example

Learn a few advanced reduction patterns: flatten allows you to merge a set of arrays into a single array, the dreaded flatmap allows you to convert an array of objects into an array of arrays which then get flattened, and reduceRight allows you to invert the order in which your reducer is applied to your input values.

Learn to Flatten and Flatmap Arrays with Reduce

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

CodeSchool Refactor - Flexible Directives Part 2/2

Learn how to avoid mutating arrays using concat(), slice(), and the ES6 array spread operator.

Redux: Avoiding Array Mutations with concat(), slice(), and ...spread

In this video, we’ll build out the skeleton of our main React.js components. We’ll talk about how to think in terms of components as well as learn about state and props. 

Building a React.js App: State, Props, and Thinking in React

By adding an isolated scope object to your AngularJS directive you can insure that each element using that directive has its own scope. This prevents it from affecting sibling directives and encapsulates the directive.

Understanding Isolate Scope

An AngularJS promise is a mechanism that lets you defer a stated action or series of actions at an earlier point of time until you explicitly declare that promise to be fulfilled (or resolved). Promises are useful for asynchronous operations. This video introduces the basic way to declare and resolve promises.

Basic Promises in AngularJS

This lesson talks about the benefits of using the parens-based `(click)` syntax so that Angular 2 can handle any custom event. Then the video explains how to pass in the actually event object using the familiar `$event` syntax.

Control Angular 2 Events with $event and Event Handlers

Both `map` and `filter` do not modify the array. Instead they return a new array of the results. Because both `map` and `filter` return Arrays, we can chain these functions together to build complex array transformations with very little code. Finally we can consume the newly created array using `forEach`. In this lesson, we will learn how to build nontrivial programs without using any loops at all.

Chaining the Array map and filter methods

Creating your own services in AngularJS can be confusing.  What are the differences between an AngularJS module's Service, Provider and Factory functions? This lesson shows how Angular's factory function is just the JavaScript module design pattern.

Services, Factories, and Providers: Creating a Factory

Our previous solution used `forEach` and a globally available array that could be mutated from inside our function. We can improve upon this and create a function that is easier to maintain & test by swapping our `forEach` loop for `reduce`. By removing the global array and instead making `getTasks` return a value directly we end up with a pure function.

Intro to Recursion - Refactoring to a Pure Function

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

Exemplar Lessons

Instructor

Course content (19 lessons)

Instructor