watching now
4
Students Description
Did you know that JavaScript has been the #1 language for web programming in the last couple decades? And did you know that when you master the basic and advanced JavaScript concepts, you’ll be well equipped for front-end developer positions in the job market? Consider this course on modern JavaScript as a guide that can help you gain those valuable skills. It’s full of clear explanations and practical tasks to equip you with a comprehensive and reliable understanding of advanced JavaScript. Build your potential up by following a professional guide along the way!
Modern JavaScript is everywhere on the Internet
If you’re planning to get into web development, JavaScript is a must-have skill on your toolbelt. It allows building interactive websites, mobile and desktop apps, games. The industry support for modern JavaScript has grown vast, and because it’s lightweight, flexible, and forgiving, it’s an excellent place to start, even if you don’t have prior coding experience. Experienced developers say that JavaScript has become a staple in web development. So if you’re interested in web development, take a modern JavaScript tutorial with no hesitation.
To illustrate the omnipresence of JavaScript around the Internet, I’ll tell you what the big players are using different JavaScript frameworks for in their practice. AngularJS has been used to build websites like PayPal, The Guardian, Freelancer.com, and more. React is another top library used by Facebook, Instagram, and others. Node.js has been trusted by PayPal, Groupon, and many others.
Here’s what you’ll get from this modern JavaScript tutorial
It’s going to be an extended and super detailed course on advanced JavaScript concepts. Here’s what you’re going to gain from this nearly 38 hours course:
- You’ll get a proper introduction to JavaScript and be guided through its installation process.
- You’ll cover a great variety of variables and data types.
- You’ll learn conditional statements and looping concepts, studying loads of practical examples.
- You’ll play around with a multitude of functions, taking different coding challenges.
- You’ll grasp the full understanding of objects, completing some activities that will help you see how stuff works in reality, not just in my shared screen.
- You’ll understand the DOM (Document Object Model) – how to access and remove DOM elements, how to handle events, etc.
- You’ll learn the essentials of the execution context, hoisting, scope chain.
- You’ll master trickier JavaScript concepts such as closures, execution contexts, scope, and others.
- You’ll understand how to use object encapsulation and hiding.
- You’ll discover how to work with inheritance and prototype chains, and how to implement class augmentation.
- You’ll learn to sort out object challenges.
- You’ll get a full understanding of singleton patterns and modular design patterns.
- You’ll work with advanced JavaScript functions.
- You’ll create an advanced real-life professional project.
- You’ll master new data structures, iteration, modern array methods, as well as different JavaScript classes.
- I’ll share the latest features of JavaScript that will make your coding experience easier and more efficient.
Cover all the necessary ground to become a job-ready JavaScript developer
By completing this course, you’ll add a professional piece of work into your portfolio. Make use of clear and to the point explanations, as well as loads of practical examples and activities. You’ll learn right from the ground up, with no steps skipped. Build your competence up smoothly and steadily. Enroll in this modern JavaScript course and start learning by doing!
What Will You Learn?
- Starting from zero, you'll learn the skills necessary for a real-world job
- You'll master advanced and tricky JavaScript concepts such as Closures, Execution Contexts, Scope, etc.
- You'll fully understand and practice with the modular design pattern and use it to write professional and well structured code
- You'll discover in-depth how JavaScript works behind the scenes
- You'll learn the latest ES6 features, such as Template literals, Arrow Functions, Classes, etc.
Requirements
- No prior knowledge required to enroll in this course
- You only need willingness to learn and practice
- HTML/CSS knowledge can help, but it's not required
Curriculum
Course consist of total 37h 39min of content, in total.
Section 1: Introduction
24:08
Get your toolbox - Chrome & Brackets
Section 2: Variables & Data Types
3:03:57
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:01:03
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:02:03
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:29
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:18
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:46
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:26
Download Chapter Source Code
Introduction
04:13
Section 9: Closures
55:54
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
29:08
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:27
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:52
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:29
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:43
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:29
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
About the Instructor
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
Days
Hours
Minutes
Seconds