Modern JavaScript Refresher: Free ES6+ Course Guide

The Modern JavaScript Refresher Course is a short, free course that brings you up to date with the modern JavaScript features you meet in today’s code. It is for developers who already know some JavaScript and want a fast refresher on ES modules, destructuring, spread and rest, arrow functions, classes, asynchronous code and optional chaining.

The whole course takes about 1.2 hours, split into 12 focused videos that end with a small final project. It is ideal before you start a framework such as React, or before a job interview. See the JavaScript Refresher course page for the full list.

Who this course is for

The course is labelled Intermediate. It assumes you know basic JavaScript: variables, functions, loops and objects. It suits:

• Developers returning to JavaScript after a break, who learned an older style of the language.
• Back-end or data developers who write some front-end code and need to read modern syntax.
• Students about to learn a front-end framework, where these features appear on every page.
• Job seekers who want to revise modern JavaScript before interviews.

If you are completely new to programming, start with a beginner course first and come back to this one.

What you will learn

The lessons fall into five themes.

1. Modules and how code is loaded. What are ES Modules explains how modern JavaScript splits code across files and shares it between them. What is Hoisted Variable in JavaScript covers hoisting, a behaviour that explains many confusing bugs.

2. Cleaner syntax. Template Literals In JavaScripts shows a more readable way to build strings. Destructuring lets you pull values out of objects and arrays in one line. Spread Versus Rest Operators (11 minutes, the longest lesson) explains the three dots that look the same but do opposite jobs, which is one of the most common points of confusion.

3. Functions. Arrow Functions covers the short function syntax used everywhere in modern code. Higher Order Functions explains functions that take or return other functions, which is the basis of a lot of array processing.

4. Classes and asynchronous code. Classes In JavaScript shows the class syntax for building objects. Asynchronous Scripts covers code that waits for something, such as a network request, without blocking the page.

5. Safer property access and a project. Optional Chaining And Nullish Coalescing shows how to read values that may be missing without crashing. The Final Project video then brings the ideas together.

How the course is organised

The course has 12 videos and runs for about 1.2 hours in total. The lessons are numbered 00 to 11:

• 00 Course Introduction (3 minutes).
• 01 to 02: ES modules and hoisting.
• 03 to 05: template literals, destructuring, and spread versus rest.
• 06 to 07: arrow functions and classes.
• 08 to 10: asynchronous scripts, higher order functions, and optional chaining with nullish coalescing.
• 11 Final Project (6 minutes).

Note that the YouTube playlist lists the videos from 11 down to 00, so the final project appears first. Use the numbers in the titles and watch from 00 upwards. This is a classic course of video lessons only.

How to study it step by step

1. Start at lesson 00, not the top of the playlist. Open the playlist and scroll to the course introduction.
2. Code along in a browser console or editor. Every lesson is short, so pause and retype each example. Change a value and predict the result before you run it.
3. Write a one-line rule for each feature. For example, after Spread Versus Rest Operators, write down in your own words when the three dots spread values out and when they collect them.
4. Rewrite old code. Take a small function you wrote in the past and refactor it with template literals, destructuring and an arrow function.
5. Spend extra time on async. Re-watch Asynchronous Scripts if needed, because waiting on slow work is where many modern JavaScript bugs come from.
6. Build the final project last. Watch lesson 11 and build it yourself, then compare your version with the video.

You can comfortably finish in two or three evenings.

Where to go next

Once modern syntax feels natural, a deeper course is Step By Step Mastering Modern JavaScript, and a framework course is Step By Step Mastering React, where the features from this refresher are used constantly. Keep the JavaScript Refresher course page bookmarked for quick revision.

Frequently asked questions

Is the Modern JavaScript Refresher Course free?

Yes. All 12 videos are free on YouTube. This is a classic video course, so there are no lab guides, simulations or mock exams for it.

How long does it take?

The videos total about 1.2 hours. With time to code along and build the final project, most learners finish in two or three evenings.

Do I need to know JavaScript already?

Yes, the basics. The course is intermediate level and refreshes modern features rather than teaching programming from zero.

Why does the playlist start with the final project?

The playlist is ordered from lesson 11 down to lesson 00. Follow the lesson numbers in the titles and start with 00, the course introduction.