Browse all JavaScript lessons.

showing All 520 lessons...

Redux: Filtering Redux State with React Router Params

Redux: Wrapping dispatch() to Log Actions

Redux: Fetching Data on Route Change

Redux: Dispatching Actions with the Fetched Data

Redux: Supplying the Initial State

Redux: Wrapping dispatch() to Recognize Promises

Redux: Avoiding Race Conditions with Thunks

Redux: Updating Data on the Server

Redux: Updating the State with the Fetched Data

Redux: Normalizing API Responses with normalizr

Redux: Applying Redux Middleware

Redux: Using mapDispatchToProps() Shorthand Notation

Redux: Displaying Error Messages

Redux: Navigating with React Router <Link>

Redux: The Middleware Chain

Redux: Displaying Loading Indicators

Redux: Creating Data on the Server

Redux: Simplifying the Arrow Functions

Redux: Colocating Selectors with Reducers

Redux: Refactoring the Entry Point

Redux: Adding a Fake Backend to the Project

Redux: Persisting the State to the Local Storage

Redux: Normalizing the State Shape

Redux: Adding React Router to the Project

Using GraphQL's GraphiQL Tool

P

Logging Pretty-Printing Tabular Data to the Console

P

Logging Timing Data to the Console

P

Using console.count to Count Events

P

Proper use of console.assert in JavaScript

P

Grouping and Nesting Console Log Output

P

Advanced Console Log Arguments

P

Log Levels and Semantic Methods

P

Up and Running with Facebook Flow for Typed JavaScript

P

Add a browser build to an npm module

Maps and WeakMaps with ES6

P

Add Elements onto an Array with Push

P

Getting Started with Redux Dev Tools

P

Promises with ES6

P

Refactoring tip: no empty lines inside a function

P

Getting a Pull Request Merged and Wrapping up

How to squash multiple git commits

How to rebase a git Pull Request branch

How to update a Pull Request on GitHub

How to Collaborate on a Pull Request on GitHub

How to create a Pull Request on GitHub

Setting up the project locally

How to Fork and Clone a GitHub Repository

Identifying How to Contribute to an Open Source Project on GitHub

How to authenticate with GitHub using SSH

How to install Git SCM

js tutorial about Redux: Filtering Redux State with React Router Params

Redux: Filtering Redux State with React Router Params

4:09 js

We will learn how adding React Router shifts the balance of responsibilities, and how the components can use both at the same time.

js tutorial about Redux: Wrapping dispatch() to Log Actions

Redux: Wrapping dispatch() to Log Actions

4:31 js

We will learn how centralized updates in Redux let us log every state change to the console along with the action that caused it.

js tutorial about Redux: Fetching Data on Route Change

Redux: Fetching Data on Route Change

3:46 js

We will learn how to fire up an async request when the route changes.

js tutorial about Redux: Dispatching Actions with the Fetched Data

Redux: Dispatching Actions with the Fetched Data

6:58 js

We will learn how to dispatch a Redux action after the data has been fetched and recap how to do it when the route changes.

js tutorial about Redux: Supplying the Initial State

Redux: Supplying the Initial State

4:13 js

We will learn how to start a Redux app with a previously persisted state, and how it merges with the initial state specified by the reducers.

js tutorial about Redux: Wrapping dispatch() to Recognize Promises

Redux: Wrapping dispatch() to Recognize Promises

6:29 js

We will learn how to teach dispatch() to recognize Promises so that we can move the async logic out of the components into asynchronous action creators.

js tutorial about Redux: Avoiding Race Conditions with Thunks

Redux: Avoiding Race Conditions with Thunks

4:43 js

We will learn how Redux Thunk middleware lets us conditionally dispatch actions to avoid unnecessary network requests and potential race conditions.

js tutorial about Redux: Updating Data on the Server

Redux: Updating Data on the Server

5:24 js

We will learn how to wait until the item is updated on the server, and then update the corresponding local state.

js tutorial about Redux: Updating the State with the Fetched Data

Redux: Updating the State with the Fetched Data

9:33 js

We will learn how moving the source of truth for the data to the server changes the state shape and the reducers in our app.

js tutorial about Redux: Normalizing API Responses with normalizr

Redux: Normalizing API Responses with normalizr

7:58 js

We will learn how to use normalizr to convert all API responses to a normalized format so that we can simplify the reducers.

js tutorial about Redux: Applying Redux Middleware

Redux: Applying Redux Middleware

2:57 js

We will learn how to replace the middleware we wrote and the custom code we used to glue it together with the existing core and third party utilities.

js tutorial about Redux: Using mapDispatchToProps() Shorthand Notation

Redux: Using mapDispatchToProps() Shorthand Notation

1:49 js

We will learn how to avoid the boilerplate code in mapDispatchToProps() for the common case where action creator arguments match the callback prop arguments.

js tutorial about Redux: Displaying Error Messages

Redux: Displaying Error Messages

10:59 js

We will learn how to handle an error inside an async action, display its message in the user interface, and offer user an opportunity to retry the action.

js tutorial about Redux: Navigating with React Router <Link>

Redux: Navigating with React Router <Link>

2:38 js

We will learn how to change the address bar using a component from React Router.

js tutorial about Redux: The Middleware Chain

Redux: The Middleware Chain

8:44 js

We will learn how we can generalize wrapping dispatch() for different purposes into a concept called “middleware” that is widely available in the Redux ecosystem.

js tutorial about Redux: Displaying Loading Indicators

Redux: Displaying Loading Indicators

5:59 js

We will learn how to display the loading indicators while the data is being fetched.

js tutorial about Redux: Creating Data on the Server

Redux: Creating Data on the Server

5:36 js

We will learn how to wait until the item is created on the server, and update the corresponding local state.

js tutorial about Redux: Simplifying the Arrow Functions

Redux: Simplifying the Arrow Functions

2:34 js

We will learn how to reduce the syntactic noise in the action creators and components when using arrow functions.

js tutorial about Redux: Colocating Selectors with Reducers

Redux: Colocating Selectors with Reducers

4:52 js

We will learn how to encapsulate the knowledge about the state shape in the reducer files, so that the components don’t have to rely on it.

js tutorial about Redux: Refactoring the Entry Point

Redux: Refactoring the Entry Point

2:25 js

We will learn how to better separate the code in the entry point to prepare it for adding the router.

js tutorial about Redux: Adding a Fake Backend to the Project

Redux: Adding a Fake Backend to the Project

1:32 js

We will learn about fake backend module that we will be using throughout the next lessons to simulate data fetching.

js tutorial about Redux: Persisting the State to the Local Storage

Redux: Persisting the State to the Local Storage

7:36 js

We will learn how to use store.subscribe() to efficiently persist some of the app’s state to localStorage and restore it after a refresh.

js tutorial about Redux: Normalizing the State Shape

Redux: Normalizing the State Shape

6:46 js

We will learn how to normalize the state shape to ensure data consistency that is important in real-world applications.

js tutorial about Redux: Adding React Router to the Project

Redux: Adding React Router to the Project

1:43 js

We will learn how to add React Router to a Redux project and make it render our root component.

js tutorial about Using GraphQL's GraphiQL Tool

Using GraphQL's GraphiQL Tool

6:07 js PRO

We'll learn how to use GraphQL's GraphiQL tool as an IDE for writing GraphQL queries, covering how to write a query, leverage query variables, perform specific operations, and also how to use the Documentation pane to explore an existing GraphQL schema.

js tutorial about Logging Pretty-Printing Tabular Data to the Console

Logging Pretty-Printing Tabular Data to the Console

3:09 js PRO

Learn how to use console.table to render arrays and objects in a tabular format for easy scanning over the values. We'll create some mock data and then render it to the log in various ways to explore console.table's API.

js tutorial about Logging Timing Data to the Console

Logging Timing Data to the Console

1:35 js PRO

Learn to use console.time with console.timeEnd to get accurate timings of operations in javascript. This tool can help with javascript profiling and performance optimization, and knowing how to use the console to do it means you don't have to pollute your codebase with timers and placeholders.

js tutorial about Using console.count to Count Events

Using console.count to Count Events

2:16 js PRO

Learn how to user console.count in order to log out how many times a given thing has happened.

js tutorial about Proper use of console.assert in JavaScript

Proper use of console.assert in JavaScript

3:06 js PRO

Learn about console.assert, which is syntactic sugar for logging an error the console when a given condition is not met. It's useful, but may not do what you expect if you're coming from another language - watch this lesson to learn how to use it, and when not to.

js tutorial about Grouping and Nesting Console Log Output

Grouping and Nesting Console Log Output

3:11 js PRO

Organize your log output by grouping your logs into collapsable hierarchies using console.group().

js tutorial about Advanced Console Log Arguments

Advanced Console Log Arguments

3:52 js PRO

Get more mileage from your console output by going beyond mere string logging - log entire introspectable objects, log multiple items in one call, and apply C-Style string substitution to make the console work for you.

js tutorial about Log Levels and Semantic Methods

Log Levels and Semantic Methods

4:38 js PRO

Go beyond console.log by learning about log levels, filtering log output and structuring your output to be meaningful and concise. The JavaScript console object offers many methods to make your life easier - start learning them here!

js tutorial about Up and Running with Facebook Flow for Typed JavaScript

Up and Running with Facebook Flow for Typed JavaScript

2:11 js PRO

Let's learn how to set up Facebook's Flow inside of a project and write a simple typecheck task that will let us run Flow against any files in our codebase.

js tutorial about Add a browser build to an npm module

Add a browser build to an npm module

6:16 js

Currently, our library is being distributed as a CommonJS module, but we should support the browser as well. In this lesson, we're going to use webpack to create a UMD (Universal Module Definition) build of our module so users can consume it in a browser.

js tutorial about Maps and WeakMaps with ES6

Maps and WeakMaps with ES6

5:14 js PRO

A brief introduction to Maps and WeakMaps with ES6, the usage of and difference of Maps and WeakMaps.

js tutorial about Add Elements onto an Array with Push

Add Elements onto an Array with Push

3:26 js PRO

Array push is used to add elements to the end of an Array. In this lesson we'll see how the push method accepts multiple arguments, can be used to merge two arrays, and how it can be used to represent user input.

js tutorial about Getting Started with Redux Dev Tools

Getting Started with Redux Dev Tools

6:04 js PRO

The Redux DevTools let us wire up our Redux app to a time-traveling debugger. This can help us debug, test, and review the state of our application in a simple history that can be "bookmarked" and scrubbed through. In this lesson, we wire up the Redux DevTools into our app, and walk through the different "monitors" and options available.

More information can be found on the official Redux DevTools GitHub page: https://github.com/gaearon/redux-devtools

js tutorial about Promises with ES6

Promises with ES6

5:51 js PRO

Promises in JavaScript (es6/es2015). Creating and using promises with ECMAscript 2015 in your JavaScript application.

js tutorial about Refactoring tip: no empty lines inside a function

Refactoring tip: no empty lines inside a function

5:00 js PRO

To keep code elegant and readable, this lesson presents a refactoring technique consisting of two rules: (1) Don't have empty lines in a function, (2) keep the function short, with at most 6 or 8 statements. See how this can help keep each function focused on one responsibility.

js tutorial about Getting a Pull Request Merged and Wrapping up

Getting a Pull Request Merged and Wrapping up

1:13 js

Let’s look at the GitHub commits and list of contributors now that our pull request has been merged. And we’ll wrap this series up with a few tips. Feel free to practice on stack-overflow-copy-paste, and see the Pull Request demonstrated in this lesson here.

js tutorial about How to squash multiple git commits

How to squash multiple git commits

2:53 js

Often, project maintainers prefer that a single pull request be represented by a single commit. It makes the git history cleaner and easier to understand. So before your pull request is merged you’ll want to do an interactive git rebase to squash all of your commits and fix your commit message.

js tutorial about How to rebase a git Pull Request branch

How to rebase a git Pull Request branch

3:39 js

Sometimes your Pull Request can fall behind master in a repository and occasionally that will result in merge conflicts which you have to manage yourself. In this lesson we’ll learn how to use git rebase to update our pull request branch to the latest version of master and resolve merge conflicts with git.

js tutorial about How to update a Pull Request on GitHub

How to update a Pull Request on GitHub

2:57 js

Once you’ve made your code updates locally, all you need to do is commit those changes and push that commit to your Pull Request branch. In this lesson we’ll also talk about how to skip git hooks that may be included in the project when you just need help.

js tutorial about How to Collaborate on a Pull Request on GitHub

How to Collaborate on a Pull Request on GitHub

2:21 js

It’s not often that you’ll get a Pull Request on GitHub just right the first time you try. You generally will iterate with the project maintainer on your solution before your PR gets merged. In this lesson, we’ll explore some of the tools that projects use to manage contributions to open source projects on GitHub.

js tutorial about How to create a Pull Request on GitHub

How to create a Pull Request on GitHub

6:19 js

Often when making a change, you want to verify your approach with the maintainer or ask them for help. In this lesson we’ll make a change and commit that WIP change. Then we’ll create a pull request requesting help from the project maintainer.

js tutorial about Setting up the project locally

Setting up the project locally

1:18 js

Before you start making your changes, you often need to set up your environment for the changes. This is where the repositories' contributing instructions come in really handy. In this lesson we’ll get our environment set up and ready for changes.

js tutorial about How to Fork and Clone a GitHub Repository

How to Fork and Clone a GitHub Repository

2:41 js

You cannot push code to repositories that you don’t own or have sufficient permission to. So instead, you make your own copy of the repository by “forking” it. You are then free to make any changes you wish to your repository.

js tutorial about Identifying How to Contribute to an Open Source Project on GitHub

Identifying How to Contribute to an Open Source Project on GitHub

2:15 js

When you find a bug in an open source project, you know exactly the change you want to make. Other times you just want to find a way to contribute. Either way, you’ll need to know how the project maintainers want to run the project and work with them to come up with an implementation for the fix/feature. And if you don't even know what project to start contributing to, check out this blogpost for inspiration on how to identify a good project to contribute to.

js tutorial about How to authenticate with GitHub using SSH

How to authenticate with GitHub using SSH

3:34 js

Anytime you push code to GitHub, you must be authenticated so GitHub knows you are authorized to make changes. In this lesson we’ll learn how to authenticate with GitHub using SSH so we don’t have to enter our username and password each time we push code to GitHub.

js tutorial about How to install Git SCM

How to install Git SCM

2:15 js

Let’s install the Git Source Control Management software so we can interact with repositories hosted on GitHub.

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