Autoplay
Autocomplete
Previous Lesson
Complete and Continue
JavaScript Bible
Intro
Intro (3:38)
EXERCISE Files and SOFTWARE Setup
00 INTRO - Exercise Files and Software Setup (0:50)
01 LECTURE - Software Setup Overview (3:34)
02 PRACTICE - WINDOWS ONLY - Install "cmder" (0:28)
03 PRACTICE - Visual Studio Code Setup (10:33)
04 PRACTICE - Launch Node.js and execute test JavaScript file (4:42)
05 PRACTICE - Git Overview - PART 1 (10:02)
07 PRACTICE - Clone remote GIt repository and switch Branches (6:50)
06 PRACTICE - Git Overview - PART 2 (6:21)
08 PRACTICE - Use SourceTree for Git repositories management (6:18)
JAVASCRIPT BASICS - Intro
GIT REPOSITORY FOR THIS SECTION
1 PRACTICE - Exploring Web Sites in the Browser (12:56)
2 PRACTICE - Create first HTML file and start Live Server (6:18)
3 PRACTICE - Add favicon to the HTML file (2:15)
4 PRACTICE - JavaScript embedded into the HTML (4:04)
5 DEMO - Git branches management (3:47)
6 PRACTICE - JavaScript in the separate file (3:03)
7 CHALLENGE - External Scripts (1:18)
8 ✓ CHALLENGE - External Scripts - SOLUTION (2:35)
9 PRACTICE - JavaScript in the Console of the Browser (2:34)
JAVASCRIPT BASICS - Types and Variables
GIT REPOSITORY FOR THIS SECTION
10 LECTURE - Object in JavaScript (3:53)
11 LECTURE - Primitive vs Reference Value Types (11:29)
12 PRACTICE - Exploring Primitive Value Types (13:46)
13 PRACTICE - Exploring Reference Type - Object (5:55)
14 LECTURE - Variable declaration using "var", "let" and "const" (9:10)
15 PRACTICE - Variable declaration and assignment (13:54)
16 CHALLENGE - Variable Declaration and Assignment (3:56)
17 CHALLENGE - Variables Reusage (14:28)
18 LECTURE - Statically vs Dynamically typed Languages (7:53)
19 PRACTICE - Dynamic typing in JavaScript (9:46)
JAVASCRIPT BASICS - Objects
GIT REPOSITORY FOR THIS SECTION
20 LECTURE - Variety of Objects in JavaScript (5:30)
21 LECTURE - Objects Modification (11:55)
22 PRACTICE and CHALLENGES - Objects - PART 1 (10:29)
23 PRACTICE and CHALLENGES - Objects - PART 2 (10:46)
24 PRACTICE and CHALLENGES - Objects - PART 3 (10:39)
25 LECTURE - Global Objects - "window" and "global" (9:23)
26 LECTURE - Methods of the Object (2:07)
JAVASCRIPT BASICS - Functions
GIT REPOSITORY FOR THIS SECTION
27 LECTURE - Introduction to the Functions (6:26)
28 LECTURE - Syntax of the Function (13:34)
29 PRACTICE - Functions - PART 1 (12:59)
30 PRACTICE - Functions - PART 2 (14:03)
31 CHALLENGES - Functions - PART 1 (9:02)
32 CHALLENGES - Functions - PART 2 (9:26)
33 LECTURE - Function Expressions vs Function Declarations (7:01)
34 PRACTICE - Function Expressions, setTimout(), setInterval() (11:26)
35 CHALLENGE - Function Expressions (1:16)
36 ✓ CHALLENGE - Function Expressions - SOLUTION (8:28)
JAVASCRIPT BASICS - Operators
GIT REPOSITORY FOR THIS SECTION
37 LECTURE - Operators (8:45)
38 LECTURE - Operands, Unary vs Binary Operators and Notations (5:11)
39 PRACTICE - Arithmetic Operators - PART 1 (8:48)
40 PRACTICE - Arithmetic Operators - PART 2 (12:11)
41 PRACTICE - Comparison Operators - PART 1 (10:54)
42 PRACTICE - Comparison Operators - PART 2 (10:48)
43 PRACTICE - Logical Operators - PART 1 (12:31)
44 PRACTICE - Logical Operators - PART 2 (10:56)
45 PRACTICE - Operators Precedence and Associativity (12:11)
46 CHALLENGES - Operators - PART 1 (9:41)
47 CHALLENGES - Operators - PART 2 (11:15)
JAVASCRIPT BASICS - Expressions vs Statements
GIT REPOSITORY FOR THIS SECTION
48 LECTURE - Expressions vs Statements - PART 1 (10:42)
49 LECTURE - Expressions vs Statements - PART 2 (11:11)
50 PRACTICE - Expressions vs Statements - PART 1 (8:49)
51 PRACTICE - Expressions vs Statements - PART 2 (11:56)
ES6 Variables Lifecycles
GIT REPOSITORY FOR THIS SECTION
11 LECTURE - Recap of the "var" (7:50)
12 LECTURE - Scopes - Global, Function and Block (2:26)
13 LECTURE - let (10:36)
14 LECTURE - const (11:52)
15 LECTURE - Variables Usage Guidelines (13:05)
16 LECTURE - Var, Let or Const? (16:19)
17 CHALLENGE 1-1 - let, var and const (3:00)
18 ✓ CHALLENGE 1-1 - let, var and const - SOLUTION (10:14)
19 CHALLENGE 1-2 - let, var and closures (3:19)
20 ✓ CHALLENGE 1-2 - let, var and closures - SOLUTION (10:55)
21 LECTURE - JavaScript Engine Phases (2:12)
22 LECTURE - Variable Lifecycle Phases (6:09)
23 LECTURE - Var lifecycle (7:33)
24 LECTURE - Undecleard variable lifecycle (6:02)
25 LECTURE - Let lifecycle (8:29)
26 LECTURE - Const lifecycle (5:51)
27 LECTURE - Function lifecycle - Part 1 (6:16)
27 LECTURE - Function lifecycle - Part 2 (6:02)
28 LECTURE - What is finally hoisting? (1:49)
29 DEMO - Putting different variables lifecycles together (4:01)
30 ✓ DEMO - Putting different variables lifecycles together - SOLUTION, Part 1 (7:00)
31 ✓ DEMO - Putting different variables lifecycles together - SOLUTION, Part 2 (17:26)
32 CHALLENGE 1-3 - Variable Lifecycles (1:32)
33 ✓ CHALLENGE 1-3 - Variable Lifecycles - SOLUTION (9:42)
34 LECTURE - Variables Phases Section Summary (4:46)
ES6 Arrow Functions
GIT REPOSITORY FOR THIS SECTION
35 LECTURE - Introduction to the Arrow Functions Section (0:34)
36 LECTURE - Traditional JavaScript Functions Overview (13:12)
37 LECTURE - Introduction to the Arrow Functions (2:27)
38 LECTURE - Arrow Functions syntax (8:47)
39 PRACTICE - Arrow Functions (12:39)
40 LECTURE - Arrow Functions and "this" (12:13)
41 LECTURE - Regular functions instead of Arrow Functions (9:44)
42 CHALLENGE 2-1 - Regular vs Arrow Functions (1:16)
43 ✓ CHALLENGE 2-1 - Regular vs Arrow Functions - SOLUTION (11:39)
44 LECTURE - Arguments in the Functions (6:22)
45 LECTURE - Arrow Functions Summary (2:04)
ES5.1 Array Helper Methods
GIT REPOSITORY FOR THIS SECTION
47 LECTURE - forEach() Overview (3:52)
48 PRACTICE - forEach() (7:10)
49 CHALLENGE 3-1 - forEach() with Index (0:43)
50 ✓ CHALLENGE 3-1 - forEach() with Index - SOLUTION (3:32)
51 LECTURE - map() Overview (2:35)
52 PRACTICE - map() (12:40)
53 CHALLENGE 3-2 - map() JSON to Object (0:31)
54 ✓ CHALLENGE 3-2 - map() JSON to Object - SOLUTION (8:17)
55 LECTURE - filter() Overview (1:31)
56 PRACTICE - filter() (3:14)
57 LECTURE - find() Overview (1:48)
58 PRACTICE - find() (2:38)
59 CHALLENGE 3-3 - find() Single Post (0:57)
60 ✓ CHALLENGE 3-3 - find() Single Post - SOLUTION (2:14)
61 LECTURE - every() and some() Overview (2:36)
62 PRACTICE - every() and some() (9:29)
63 CHALLENGE 3-4 Is Array of Numbers Sorted? (2:00)
64 ✓ CHALLENGE 3-4 Is Array of Numbers Sorted? - SOLUTION (12:38)
65 CHALLENGE 3-5 Are Arrays Equal or not? (2:14)
66 ✓ CHALLENGE 3-5 Are Arrays Equal or not? - SOLUTION (6:51)
67 CHALLENGE 3-6 Check if Element is in Array (1:11)
68 ✓ CHALLENGE 3-6 Check if Element is in Array - SOLUTION (2:22)
69 LECTURE - includes() Overview (1:36)
70 PRACTICE - includes() (4:28)
71 CHALLENGE 3-7 Includes() with Array or Object (4:00)
72 ✓ CHALLENGE 3-7 Includes() with Array or Object - SOLUTION (11:07)
73 CHALLENGE 3-8 Push Element to Array if Not Exists (2:19)
74 ✓ CHALLENGE 3-8 Push Element to Array if Not Exists - SOLUTION (8:54)
75 LECTURE - reduce() Overview (4:03)
76 PRACTICE - reduce() (16:55)
77 CHALLENGE 3-9 Reduce Array of Objects (1:21)
78 ✓ CHALLENGE 3-9 Reduce Array of Objects - SOLUTION (4:31)
79 CHALLENGE 3-10 Reduce Array of Objects to Object (1:57)
80 ✓ CHALLENGE 3-10 Reduce Array of Objects to Object - SOLUTION (9:02)
81 LECTURE - Do you know how sort() works? (3:17)
82 LECTURE - Sorting Algorithms Overview (3:42)
83 LECTURE - Stable vs Unstable Sort (2:24)
84 LECTURE - sort() Overview (4:52)
85 LECTURE - sort() without Arguments (2:37)
86 LECTURE - sort() Analyze sorting algorithms (10:22)
87 LECTURE - sort() Algorithms in different browsers (12:37)
88 CHALLENGE 3-11 sort() Array of objects (1:43)
89 ✓ CHALLENGE 3-11 sort() Array of objects - SOLUTION (6:30)
90 CHALLENGE 3-12 sort() Long Array of objects (1:32)
91 ✓ CHALLENGE 3-12 sort() Long Array of objects - SOLUTION (14:31)
92 LECTURE - sort() Summary (2:35)
93 LECTURE - Array helper methods Summary (5:02)
ES6 Template Literals
GIT REPOSITORY FOR THIS SECTION
94 LECTURE - Template Literals Overview (11:28)
95 LECTURE - Tagged Templates Overview (11:35)
96 CHALLENGE 4-1 Template Literals (1:02)
97 ✓ CHALLENGE 4-1 Template Literals - SOLUTION (4:05)
98 CHALLENGE 4-2 Default tagged template (2:19)
99 ✓ CHALLENGE 4-2 Default tagged template - SOLUTION (14:35)
ES6 Rest/Spread Operators and Default Function Parameters
GIT REPOSITORY FOR THIS SECTION
100 LECTURE - Rest Parameters Overview (4:50)
101 PRACTICE - Rest Parameters (11:55)
102 LECTURE - Spread Operator Overview (1:22)
103 PRACTICE - Spread Operator (17:19)
104 CHALLENGE 5-1 Rest and Spread Operators (3:05)
105 ✓ CHALLENGE 5-1 Rest and Spread Operators - SOLUTION (14:18)
106 LECTURE - Default Function Parameters Overview (3:24)
107 PRACTICE - Default Function Parameters (15:57)
108 CHALLENGE 5-2 Default value without default parameters (1:31)
109 ✓ CHALLENGE 5-2 Default value without default parameters - SOLUTION (5:43)
110 CHALLENGE 5-3 Generate Missing Unique IDs (3:44)
111 ✓ CHALLENGE 5-3 Generate Missing Unique IDs - SOLUTION PART 1 (5:02)
112 ✓ CHALLENGE 5-3 Generate Missing Unique IDs - SOLUTION PART 2 (8:02)
113 ✓ CHALLENGE 5-3 Generate Missing Unique IDs - SOLUTION PART 3 (15:56)
114 ✓ CHALLENGE 5-3 Generate Missing Unique IDs - SOLUTION PART 4 (11:33)
ES6 Enhanced Object Literals
GIT REPOSITORY FOR THIS SECTION
115 LECTURE - Enhanced Object Literals Overview (3:00)
116 PRACTICE - Enhanced Object Literals (14:02)
117 CHALLENGE 6-1 Enhanced Object Literals (3:51)
118 ✓ CHALLENGE 6-1 Enhanced Object Literals - SOLUTION (11:56)
ES6 Array and Object Destructuring
GIT REPOSITORY FOR THIS SECTION
119 LECTURE - Destructuring Overview (5:16)
120 PRACTICE - Array Destructuring (20:13)
121 CHALLENGE 6-2 Array Destructuring (0:35)
122 ✓ CHALLENGE 6-2 Array Destructuring - SOLUTION (1:50)
123 CHALLENGE 6-3 Destructure Result of the Function (1:19)
124 ✓ CHALLENGE 6-3 Destructure Result of the Function - SOLUTION (9:17)
125 PRACTICE - Object Destructuring - PART 1 (14:42)
126 LECTURE - New Variable Names and Default Values in Object Destructuring (3:50)
127 PRACTICE - Object Destructuring - PART 2 (9:05)
128 CHALLENGE 6-4 Object Destructuring (0:50)
129 ✓ CHALLENGE 6-4 Object Destructuring - SOLUTION (5:49)
130 CHALLENGE 6-5 Object Destructuring and Array Helper Methods (1:50)
131 ✓ CHALLENGE 6-5 Object Destructuring and Array Helper Methods - SOLUTION (6:21)
132 CHALLENGE 6-6 Delete Object Properties (0:50)
133 ✓ CHALLENGE 6-6 Delete Object Properties - SOLUTION (10:44)
ES6 Classes, Prototypes and Function Constructors
GIT REPOSITORY FOR THIS SECTION
134 LECTURE - Class-based vs Prototype-based (3:07)
135 LECTURE - What is inheritance? (4:36)
136 LECTURE - Prototype Chain (5:26)
137 LECTURE - __proto__ and [[Prototype]] (5:42)
138 LECTURE - What is Prototype? (5:37)
139 LECTURE - Don't reassign __proto__ (4:43)
140 LECTURE - Native Prototypes - PART 1 (10:34)
141 LECTURE - Native Prototypes - PART 2 (8:48)
142 LECTURE - Prototypal Inheritance in JavaScript (7:35)
143 PRACTICE - Function Constructors - PART 1 (9:08)
144 LECTURE - Function Constructors Overview (4:07)
145 PRACTICE - Function Constructors - PART 2 (3:18)
146 PRACTICE - Function Constructors - PART 3 (15:00)
147 LECTURE - Object.create() Overview (3:25)
148 PRACTICE - Object.create() (9:41)
149 PRACTICE - Function Constructors - PART 4 (17:40)
150 LECTURE - Function Constructors - New Prototype in the Chain (3:30)
151 CHALLENGE 7-1 Insert Prototype Into the Existing Prototype Chain (1:32)
152 ✓ CHALLENGE 7-1 Insert Prototype Into the Existing Prototype Chain - SOLUTION (7:09)
153 LECTURE - "instanceof" and "typeof" in the Prototype Chain (3:52)
154 CHALLENGE 7-2 Fix Mistakes in the Function Constructors (0:58)
155 ✓ CHALLENGE 7-2 Fix Mistakes in the Function Constructors - SOLUTION (14:48)
156 LECTURE - Classes - Overview (5:52)
157 LECTURE - Classes vs Function Constructors (10:32)
158 PRACTICE - Classes - PART 1 (13:26)
159 PRACTICE - Classes - PART 2 (20:55)
160 PRACTICE - Classes - PART 3 (12:33)
161 CHALLENGE 7-3 Convert Function Constructors to Classes (1:45)
162 ✓ CHALLENGE 7-3 Convert Function Constructors to Classes - SOLUTION (12:29)
163 CHALLENGE 7-4 Extend Array (4:13)
164 ✓ CHALLENGE 7-4 Extend Array - SOLUTION (11:09)
165 CHALLENGE 7-5 Custom Push Method for Arrays (2:33)
166 ✓ CHALLENGE 7-5 Custom Push Method for Arrays - SOLUTION (13:46)
167 LECTURE - React and ES6 Classes (20:43)
168 CHALLENGE 7-6 Classes in React - Additional Button (1:17)
169 ✓ CHALLENGE 7-6 Classes in React - Additional Button - SOLUTION (7:24)
Babel Introduction
00 LECTURE - Babel Module Introduction (0:23)
01 LECTURE - What is Compiler? (1:15)
02 LECTURE - Compiled vs Interpreted languages (4:18)
03 LECTURE - Transpiler (1:28)
04 LECTURE - Transpling vs Compiling (2:20)
05 LECTURE - ES5, ES6 and JavaScript (3:57)
06 LECTURE - What Babel does? (2:21)
07 LECTURE - Why do we need Babel? (7:31)
08 LECTURE - ES6 support by Browsers (6:49)
09 LECTURE - How many browsers need compiled ES5 code? (2:25)
10 PRACTICE - Babel in action - ES6 Rest operator (4:31)
11 PRACTICE - Compare performance - ES6 Rest Operator(Node.js) (5:44)
12 PRACTICE - Compare Performance - ES6 Rest Operator (Google Chrome) (2:59)
13 CHALLENGE - Compare Performance - ES6 Destructuring (1:49)
14 ✓ CHALLENGE - Compare Performance - ES6 Destructurng - SOLUTION (6:09)
15 LECTURE - What is User Agent? (4:08)
16 LECTURE - Serve different JS files to different browers (0:45)
17 LECTURE - Different JS files on the server (2:07)
18 PRACTICE - Browser detection on the client (4:39)
19 CHALLENGE - Detect feature support in the Browser (0:28)
20 ✓ CHALLENGE - Detect feature support in the Browser - SOLUTION (4:18)
21 CHALLENGE - Insert different script tags into the DOM (3:09)
22 ✓ CHALLENGE - Insert different script tags into the DOM - SOLUTION (6:44)
23 LECTURE - How Babel Works? (1:37)
24 PRACTICE - Online Babel Compiler (2:08)
25 LECTURE - Install Babel Globally (3:09)
26 PRACTICE - Compile JS file using Babel (2:04)
27 LECTURE - Plugins and Presets (6:08)
NPM - Node Package Manager
01 LECTURE - Introduction to the NPM (0:48)
02 PRACTICE - Exploring NPM packages (1:32)
03 LECTURE - Package.json and init (3:11)
04 LECTURE - Semantic Versioning (4:45)
05 LECTURE - Packages Installation (2:13)
06 PRACTICE - Install package in the project (4:42)
07 CHALLENGE - Install Semver package (0:37)
08 ✓ CHALLENGE - Install Semver Package - SOLUTION (11:04)
09 PRACTICE - Install Browserslist - package with own dependencies (3:22)
10 LECTURE - Dependencies and Development Dependencies (2:43)
11 PRACTICE - Examine Development Dependencies (6:21)
12 PRACTICE - Browser App vs Server Package (4:41)
13 CHALLENGE - Clock Browser Application (1:42)
14 ✓ CHALLENGE - Clock Browser Application - SOLUTION (12:07)
15 LECTURE - Clock Challenge Summary (2:19)
16 LECTURE - Browser App vs Public Package (6:50)
17 PRACTICE - Exploring Package Information and Versions (2:44)
18 PRACTICE - Installing Specific Package Version (3:25)
19 LECTURE - Why package-lock.json file is needed? (4:29)
20 CHALLENGE - Reinstall old package version without lock file (0:58)
21 ✓ CHALLENGE - Reinstall old package version without lock file - SOLUTION (3:07)
22 LECTURE - How lock file is handled (10:55)
23 LECTURE - Lock file summary (0:37)
24 LECTURE - Update NPM packages overview (1:32)
25 CHALLENGE - Update project dependencies (0:40)
26 ✓ CHALLENGE - Update project dependencies - SOLUTION (5:07)
27 LECTURE - Introduction to the NPM scripts (2:49)
28 PRACTICE - Start npm script (2:21)
29 CHALLENGE - Create prestart script (1:28)
30 ✓ CHALLENGE - Create prestart script - SOLUTION (7:13)
31 PRACTICE - Custom NPM scripts (2:48)
32 CHALLENGE - Run NPM scripts simultaneously (1:15)
33 ✓ CHALLENGE - Run NPM scripts simultaneously - SOLUTION (3:25)
34 LECTURE - NPM .bin Folder with Executable Scripts (4:45)
35 PRACTICE - Explore .bin Folder on the Mac (2:48)
36 PRACTICE - Explore .bin Folder on Windows (1:28)
37 LECTURE - NPM Scripts Wrap-Up (1:24)
25 LECTURE - Install Babel Globally
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock