Autoplay
Autocomplete
Previous Lesson
Complete and Continue
The Complete 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)
Teach online with
Activity: Is the library open? (3)
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock