watching now
4 Students

252 Lessons

Beginner

What You Will Learn?

  • Go from Zero Skills to a job ready JavaScript Developer
  • Master tricky JS concepts like Closures, Execution Contexts, Scope, etc.
  • Master the modular design pattern and use it to write professional and well structured code
  • Understand how JavaScript works behind the scenes
  • New ES6 features: Template literals, Arrow Functions, Classes, etc.

Curriculum

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

Description

Requirements

  • There is no pre-knowledge required. This course will take you from zero skills to a job ready JS Developer.
  • All you need is a computer.
  • HTML/CSS can help. But no worries as we included videos teaching HTML/CSS from scratch.

About the Instructor

Reviews 0
Students 12
Courses 2

Development Island is a UK based innovative company specialised in providing the best technology courses on the internet. We are proud to be teaching ~50000 students from 173+ countries. We believe our courses are the best in the market for two reasons:

- We use a practical approach that we developed over years of experience: Learning by doing.

- We make your learning experience enjoyable and fun.

BitDegree platform reviews

Our students say Excellent
9.5 out of 10
trustpilot logo 1 trustpilot logo