×
Sale ends in:
01
days
01
hours
01
min
01
sec
This course was created with the
course builder. Create your online course today.
Start now
Create your course
with
Autoplay
Autocomplete
Previous Lesson
Complete and Continue
The Complete 2023 Modern Javascript Course with ES6: Beginner to Expert
Introduction
Introduction to JavaScript (11:18)
Get your toolbox - Chrome & Brackets
Install Chrome & Brackets (2:43)
Your first JavaScript Programme (10:04)
Variables & Data Types
Introduction (1:55)
Download Chapter Source Code
Create Variables (9:24)
Activity: Avoid a Speeding Fine! (7:58)
Rules (1:59)
Reserved Keywords
Memory (3:03)
Numbers - Introduction (5:05)
Numbers - Arithmetic Operations (4:51)
Numbers - Operator Precedence (5:55)
Operators and Operator Precedence
Numbers - More Operator / Special Numbers (10:31)
Strings (8:33)
Activity: How old will you be in 2040? (12:05)
Booleans (2:18)
Booleans - Logical Operators (4:00)
Booleans - Operator Precedence (2:07)
Booleans - Ternary Operator (1:57)
Booleans vs Non Booleans (12:05)
Activity: Will you pass? (18:04)
null and undefined (3:04)
Type coercion (8:00)
Objects (13:12)
Activity: Claim Extra points (5:34)
Arrays (2:47)
Coding Challenge: Help the Cashier - Introduction (8:11)
Download Coding Challenge Source Code
Coding Challenge: Help the Cashier - Logic (5:08)
Coding Challenge: Help the Cashier - Solution (Part 1) (9:18)
Coding Challenge: Help the Cashier - Solution (Part 2) (16:12)
Conditional and Looping
Download Chapter Source Code
If Statement (7:53)
Activity: Beat Usain Bolt (19:54)
Switch Statement (7:29)
Activity: Days of the week (6:28)
For Statement (12:54)
Activity: Find a hotel in London (19:18)
while do Statement (14:04)
do while Statement (1:49)
Activity: 24h Schedule App (18:49)
Download Coding Challenge Source Code
Coding Challenge: Improve your Cashier Code - Part 1 (1:15)
Coding Challenge: Improve your Cashier Code - Solution 1 (5:54)
Coding Challenge: Improve your Cashier Code - Part 2 (2:03)
Coding Challenge: Improve your Cashier Code - Solution 2 (2:47)
Functions - Part 1
Download Chapter Source Code
Introduction (6:55)
Activity: Holiday Budget Planner (10:16)
Return values (5:07)
Activity: The Miami Museum (10:21)
Pass 'by value' vs 'by reference' (11:26)
Activity: Rafael Nadal vs Novak Djokovic (15:11)
First class functions (11:57)
Activity: Mars Invasion (19:57)
Statement vs Expression (10:25)
Activity: The Island Treasure (14:49)
IIFE: Immediately Invoked Function Expressions (6:55)
An invocation pattern: Recursion (9:34)
Activity: Fibonacci's honey bees (13:01)
Built-in JS Functions (8:53)
Scope (14:50)
Activity: Manchester-London Train Simulation (1) (19:03)
Activity: Manchester-London Train Simulation (2) (19:35)
Coding Challenge: Is it prime? - Introduction (3:42)
Download Coding Challenge Source Code
Coding Challenge: Is it prime? - Logic (3:23)
Coding Challenge: Is it prime? - Solution (15:48)
Coding Challenge: Can you count the primes? - Introduction (2:26)
Download Coding Challenge Source Code
Coding Challenge: Can you count the primes? - Logic (2:07)
Coding Challenge: Can you count the primes? - Solution (5:52)
Objects - Part 1
Download Chapter Source Code
Object literals (3:03)
'Dot notation' vs 'Brackets' (10:15)
Activity: Hack the recipe (17:05)
Constructors - 'new' keyword - 'this' (17:20)
Prototype (6:49)
Activity: The Hotel Manager (1) (16:09)
Activity: The Hotel Manager (2) (18:34)
Activity: The Hotel Manager (3) (5:31)
Equality (8:00)
String Object (8:57)
String Object Methods
Activity: Lion, tiger or else? (1) (15:23)
Activity: Lion, tiger or else? (2) (9:35)
Date Object (1) (17:08)
Date Object (2) (7:43)
Date Object Methods
Activity: Is the library open? (1) (19:44)
Activity: Is the library open? (2) (17:23)
Activity: Is the library open? (3) (9:14)
Math Object (3:40)
Math Object Methods
JSON (12:47)
Array Object (4:43)
Array methods (13:25)
Loop through Arrays using forEach (2:43)
Activity: The Europe Tour (1) (19:56)
Activity: The Europe Tour (2) (16:40)
The DOM
Download Chapter Source Code
Learn HTML&CSS (1) (12:11)
Learn HTML&CSS (2) (9:34)
Learn HTML&CSS (3) (13:25)
Learn HTML&CSS (4) (11:22)
Understand the DOM (7:22)
Access DOM elements (1) (18:44)
Access DOM elements (2) (6:20)
Change DOM elements (18:53)
Remove DOM elements (6:22)
Event Handling (1) (14:31)
Event Handling (2) (10:56)
event object - keys (6:36)
event object - mouse events (13:19)
event object - scroll event (6:59)
event object - focus (3:40)
event object - preventDefault (3:36)
Single Threaded Javascript (5:07)
Debouncing (8:15)
Event Propagation (8:41)
Event Delegation (13:48)
jQuery (19:17)
Execution Context - Hoisting - 'this'
Download Chapter Source Code
Global Execution Context - 'this' (4:08)
Execution Context - Creation & Hoisting (5:08)
Execution Context - Execution (12:54)
Function declaration overriding variable declaration (5:13)
Scope Chain
Download Chapter Source Code
Introduction (4:12)
Understand the scope chain (11:06)
Closures
Download Chapter Source Code
Understand Closures (19:13)
Update values of outer variables (1) (8:02)
Update values of outer variables (2) (4:53)
Closures with event loops (1) (9:42)
Closures with event loops (2) (5:27)
Iteration Challenge (8:21)
Objects - Part 2: Encapsulation & Information Hiding
Download Chapter Source Code
Why would you hide information? (9:03)
Use closures to hide properties and methods (12:41)
Use IIFE to create private static properties and methods (7:09)
Objects - Part 3: Inheritance & Prototype Chain
Download Chapter Source Code
Understand the prototype (1) (5:44)
Understand the prototype (2) (3:47)
Inheritance&PrototypeChain: __proto__ (9:57)
Inheritance&PrototypeChain: Object.create (4:07)
Inheritance&PrototypeChain: Constructor Inheritance (18:21)
Inheritance&PrototypeChain: extend function (6:01)
Class Augmentation (1) (19:21)
Class Augmentation (2) (11:09)
Object cloning (6:55)
Objects - Part 4: Objects Challenges
Download Chapter Source Code
Challenge: Iteration and hasOwnProperty (7:49)
Challenge: Iteration using object.keys & forEach (8:18)
Challenge: getPrototypeOf & getOwnPropertyNames (8:52)
Challenge: Climb up the prototype chain (16:37)
Objects - Part 5: Singleton & Module Patterns
Download Chapter Source Code
Namespacing (6:06)
Singleton Pattern (3:41)
Wrap page specific code (19:56)
Modular Design Pattern (8:33)
Functions - Part 2
Download Chapter Source Code
Functions are objects (5:42)
The 'arguments' property (8:14)
Function.prototype.call (17:44)
Function.prototype.apply (1:22)
Function.prototype.bind (5:23)
Typing Test App (Advanced Real Life Professional Project)
Introduction (3:33)
Steps Simplified (9:47)
Back to Client Requirements (10:17)
Functional Design (4:32)
Modular Design Pattern (8:07)
Modular Categorisation (8:47)
Data Module Structure (14:32)
UI Module Structure (18:07)
Format Current Word Structure (11:23)
Results Calculation Structure (6:07)
Update Time Left - Structure (3:23)
Certificate Module Structure (1:12)
Events Module Structure (2:47)
Words Module Structure (1:24)
Overview of Modules (2:46)
Get ready to Write Code (6:51)
Code as you Go
App Skeleton & Decoration (1) (19:01)
App Skeleton & Decoration (2) (19:10)
App Skeleton & Decoration (3) (19:46)
Code as you Go
init function (Events Module) (9:15)
Code as you Go
Code as you Go
Fill the list of Test Words (Data Module) (13:33)
Code as you Go
Shuffle an Array (13:46)
Code as you Go
Add Random Capitalisation (12:06)
Code as you Go
Add Random Punctuation (13:24)
Code as you Go
Fill the list of Test Words (1) (UI Module) (19:11)
Fill the list of Test Words (2) (UI Module) (18:16)
Code as you Go
Time Initialisation (Data & UI Modules) (14:43)
Code as you Go
Move to a New Word (Data Module) (17:53)
Set the Active Word & Format it (UI Module) (16:01)
Code as you Go
Type a Character - Event Listener (18:47)
Code as you Go
word.prototype.update(value) (19:37)
Code as you Go
keydown vs keyup vs keypress vs input Events (6:32)
Code as you Go
Format the Active Word (UI Module) (19:52)
Code as you Go
Press Space - Event (8:58)
Code as you Go
Scroll the Active Word into the Middle of the View (10:53)
Code as you Go
Press Enter - Create a Fake Event using the Event Constructor (14:18)
Code as you Go
Launch the Test (8:07)
Code as you Go
Calculate Words Per Minute & wpmChange (Data Module) (15:25)
Update the Time Left (Data & UI Modules) (6:11)
Code as you Go
Calculate Clicks Per Minute & cpmChange (Data Module) (3:26)
Code as you Go
Calculate accuracy & accuracyChange (Data Module) (6:10)
Code as you Go
Update Results (UI Module) (19:59)
Code as you Go
End the test & show the Modal (1) (Data & UI Modules) (13:40)
End the test & show the Modal (2) (Data & UI Modules) (18:17)
Code as you Go
Generate PDF Certificate (1) (Certificate Module) (17:57)
Code as you Go
Generate PDF Certificate (2) (Certificate Module) (17:59)
Code as you Go
Generate PDF Certificate (3) (Certificate Module) (18:32)
Code as you Go
ES6 - ES2015: Introduction
Introduction (3:36)
ES6 - Variables & Scoping
Download Chapter Source Code
Review of 'var' declaration (4:00)
'let' scope and temporal dead zone (5:23)
Block scoping in ES6 (8:37)
Functions and Block scoping (3:20)
Functions and Block scoping - Use 'let' (3:20)
'let' Scope vs Closures (6:43)
Closures Challenge (4:57)
'const' - Read only variables (3:22)
ES6 - Modern Features which will make your Coding Experience Easier!
Template Literals (4:52)
Arrow Functions - 'this' Lexical Scope (19:01)
Destructuring - Arrays (10:53)
Destructuring - Objects (7:52)
Destructuring - Functions (4:34)
Functions - Default Parameter Values (9:55)
Functions - Rest Parameters (16:52)
Spread Operator (4:29)
Object Literals New Features (9:07)
ES6 - New Data Structures & Iteration (Iterators, Generators,Maps, Sets,...)
for of Loop (5:49)
Iterators, Generators & next() (19:01)
Maps - Iteration (19:42)
Sets - Iteration (10:42)
Sets - Challenges: Intersection * Difference (10:09)
Symbols (16:45)
Symbol.iterator (11:47)
ES6 - Classes (static methods, getters/setters, inheritance, extends, super,...)
Back to ES5 Constructors (9:19)
ES6 Classes Syntax (2:52)
Static methods (3:15)
Getters & Setters (6:29)
Class Inheritance - extends - super() (6:16)
Access DOM elements (1)
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock
Got it!
We use cookies to enhance your experience. By continuing to visit this site you agree to our use of cookies.
More info
Cookie Info Script