Library chevron_right

The Complete JavaScript Course 2024: From Zero to Expert!

Contents
About

Course Contents

  • Section 1: Welcome, Welcome, Welcome!
    4 lectures • 23 min
    • 1 The Complete JavaScript Course 2025: From Zero to Expert!
      03:14
    • 2 Course Structure and Projects
      05:25
    • 3 Watch Before You Start!
      06:09
    • 4 Setting Up Our Code Editor
      08:23
  • Section 2: JavaScript Fundamentals – Part 1
    24 lectures • 4.5 hr
    • 5 Section Intro
      00:53
    • 6 Hello World!
      05:57
    • 7 A Brief Introduction to JavaScript
      11:18
    • 8 Linking a JavaScript File
      15:55
    • 9 Values and Variables
      16:05
    • 10 Data Types
      19:19
    • 11 let, const and var
      09:58
    • 12 Basic Operators
      19:31
    • 13 Operator Precedence
      11:19
    • 14 CHALLENGE #1: Video Solution
      07:20
    • 15 Strings and Template Literals
      10:57
    • 16 Taking Decisions: if / else Statements
      12:50
    • 17 CHALLENGE #2: Video Solution
      05:20
    • 18 Type Conversion and Coercion
      16:40
    • 19 Truthy and Falsy Values
      10:03
    • 20 Equality Operators: == vs. ===
      15:41
    • 21 Boolean Logic
      08:30
    • 22 Logical Operators
      10:37
    • 23 CHALLENGE #3: Video Solution
      11:42
    • 24 The switch Statement
      13:10
    • 25 Statements and Expressions
      06:08
    • 26 The Conditional (Ternary) Operator
      10:02
    • 27 CHALLENGE #4: Video Solution
      05:57
    • 28 JavaScript Releases: ES5, ES6+ and ESNext
      14:19
  • Section 3: JavaScript Fundamentals – Part 2
    20 lectures • 4.3 hr
    • 29 Section Intro
      00:36
    • 30 Activating Strict Mode
      10:27
    • 31 Functions
      19:08
    • 32 Function Declarations vs. Expressions
      10:39
    • 33 Arrow Functions
      09:52
    • 34 Functions Calling Other Functions
      10:07
    • 35 Reviewing Functions
      15:37
    • 36 CHALLENGE #1: Video Solution
      14:10
    • 37 Introduction to Arrays
      21:34
    • 38 Basic Array Operations (Methods)
      12:52
    • 39 CHALLENGE #2: Video Solution
      06:54
    • 40 Introduction to Objects
      06:08
    • 41 Dot vs. Bracket Notation
      19:21
    • 42 Object Methods
      23:04
    • 43 CHALLENGE #3: Video Solution
      09:50
    • 44 Iteration: The for Loop
      11:11
    • 45 Looping Arrays, Breaking and Continuing
      22:02
    • 46 Looping Backwards and Loops in Loops
      11:53
    • 47 The while Loop
      11:52
    • 48 CHALLENGE #4: Video Solution
      11:24
  • Section 4: How to Navigate This Course
    1 lecture • 4 min
    • 49 Pathways and Section Roadmaps
      04:08
  • Section 5: Developer Skills & Editor Setup
    9 lectures • 2.1 hr
    • 50 Section Intro
      00:39
    • 51 Setting up Prettier and VS Code
      16:22
    • 52 Installing Node.js and Setting Up a Dev Environment
      11:32
    • 53 Learning How to Code
      17:42
    • 54 How to Think Like a Developer: Become a Problem Solver!
      10:53
    • 55 Using Google, StackOverflow and MDN
      26:36
    • 56 Debugging (Fixing Errors)
      05:09
    • 57 Debugging with the Console and Breakpoints
      19:25
    • 58 CHALLENGE #1
      15:24
  • Section 6: [OPTIONAL] HTML & CSS Crash Course
    5 lectures • 56 min
    • 59 Section Intro
      00:40
    • 60 Basic HTML Structure and Elements
      09:32
    • 61 Attributes, Classes and IDs
      13:09
    • 62 Basic Styling with CSS
      12:00
    • 63 Introduction to the CSS Box Model
      20:57
  • Section 7: JavaScript in the Browser: DOM and Events [PROJECT]
    18 lectures • 3.9 hr
    • 64 Section Intro
      00:49
    • 65 PROJECT #1: Guess My Number!
      08:47
    • 66 What's the DOM and DOM Manipulation
      06:48
    • 67 Selecting and Manipulating Elements
      08:22
    • 68 Handling Click Events
      12:50
    • 69 Implementing the Game Logic
      19:33
    • 70 Manipulating CSS Styles
      08:17
    • 71 CHALLENGE #1
      11:40
    • 72 Implementing Highscores
      07:47
    • 73 Refactoring Our Code: The DRY Principle
      15:05
    • 74 PROJECT #2: Modal Window
      13:21
    • 75 Working With Classes
      16:55
    • 76 Handling an "Esc" Keypress Event
      14:11
    • 77 PROJECT #3: Pig Game
      17:08
    • 78 Rolling the Dice
      15:58
    • 79 Switching the Active Player
      15:16
    • 80 Holding Current Score
      24:55
    • 81 Resetting the Game
      15:38
  • Section 8: How JavaScript Works Behind the Scenes
    13 lectures • 3.1 hr
    • 82 Section Intro
      01:31
    • 83 An High-Level Overview of JavaScript
      12:11
    • 84 The JavaScript Engine and Runtime
      13:47
    • 85 Execution Contexts and The Call Stack
      17:45
    • 86 Scope and The Scope Chain
      25:37
    • 87 Scoping in Practice
      21:13
    • 88 Variable Environment: Hoisting and The TDZ
      11:00
    • 89 Hoisting and TDZ in Practice
      14:42
    • 90 The this Keyword
      06:30
    • 91 The this Keyword in Practice
      13:11
    • 92 Regular Functions vs. Arrow Functions
      18:04
    • 93 Primitives vs. Objects (Primitive vs. Reference Types)
      16:06
    • 94 Primitives vs. Objects in Practice
      14:57
  • Section 9: Data Structures, Modern Operators and Strings
    24 lectures • 5.6 hr
    • 95 Section Intro
      00:53
    • 96 Destructuring Arrays
      19:33
    • 97 Destructuring Objects
      19:46
    • 98 The Spread Operator (...)
      21:26
    • 99 Rest Pattern and Parameters
      19:01
    • 100 Short Circuiting (&& and ||)
      15:55
    • 101 The Nullish Coalescing Operator (??)
      03:32
    • 102 Logical Assignment Operators
      11:39
    • 103 CHALLENGE #1
      14:57
    • 104 Looping Arrays: The for-of Loop
      07:20
    • 105 Enhanced Object Literals
      07:02
    • 106 Optional Chaining (?.)
      16:10
    • 107 Looping Objects: Object Keys, Values, and Entries
      10:09
    • 108 CHALLENGE #2
      14:30
    • 109 Sets
      13:18
    • 110 Maps: Fundamentals
      14:03
    • 111 Maps: Iteration
      12:41
    • 112 Summary: Which Data Structure to Use?
      09:40
    • 113 CHALLENGE #3
      09:37
    • 114 Working With Strings - Part 1
      16:53
    • 115 Working With Strings - Part 2
      21:45
    • 116 Working With Strings - Part 3
      21:41
    • 117 CHALLENGE #4
      15:15
    • 118 String Methods Practice
      16:36
  • Section 10: A Closer Look at Functions
    13 lectures • 2.6 hr
    • 119 Section Intro
      00:48
    • 120 Default Parameters
      09:17
    • 121 How Passing Arguments Works: Value vs. Reference
      13:36
    • 122 First-Class and Higher-Order Functions
      05:24
    • 123 Functions Accepting Callback Functions
      15:20
    • 124 Functions Returning Functions
      06:36
    • 125 The call and apply Methods
      16:51
    • 126 The bind Method
      21:33
    • 127 CHALLENGE #1
      18:47
    • 128 Immediately Invoked Function Expressions (IIFE)
      07:52
    • 129 Closures
      19:48
    • 130 More Closure Examples
      15:30
    • 131 CHALLENGE #2
      05:25
  • Section 11: Working With Arrays [PROJECT]
    27 lectures • 6.1 hr
    • 132 Section Intro
      00:53
    • 133 Simple Array Methods
      16:37
    • 134 The New at Method
      06:04
    • 135 Looping Arrays: forEach
      13:46
    • 136 forEach With Maps and Sets
      05:32
    • 137 PROJECT: "Bankist" App
      09:48
    • 138 Creating DOM Elements
      18:44
    • 139 CHALLENGE #1
      08:31
    • 140 Data Transformations: map, filter, reduce
      04:40
    • 141 The map Method
      15:40
    • 142 Computing Usernames
      12:14
    • 143 The filter Method
      06:19
    • 144 The reduce Method
      20:57
    • 145 CHALLENGE #2
      09:56
    • 146 The Magic of Chaining Methods
      19:39
    • 147 CHALLENGE #3
      03:57
    • 148 The find Method
      06:47
    • 149 Implementing Login
      24:18
    • 150 Implementing Transfers
      20:54
    • 151 The findIndex Method
      12:34
    • 152 some and every
      15:11
    • 153 flat and flatMap
      09:32
    • 154 Sorting Arrays
      21:55
    • 155 More Ways of Creating and Filling Arrays
      20:33
    • 156 Summary: Which Array Method to Use?
      06:24
    • 157 Array Methods Practice
      32:21
    • 158 CHALLENGE #4
      23:47
  • Section 12: Numbers, Dates, Intl and Timers [PROJECT]
    13 lectures • 3.2 hr
    • 159 Section Intro
      00:50
    • 160 Converting and Checking Numbers
      16:46
    • 161 Math and Rounding
      18:14
    • 162 The Remainder Operator
      10:56
    • 163 Numeric Separators
      06:57
    • 164 Working with BigInt
      11:18
    • 165 Creating Dates
      12:55
    • 166 Adding Dates to "Bankist" App
      22:21
    • 167 Operations With Dates
      15:27
    • 168 Internationalizing Dates (Intl)
      17:18
    • 169 Internationalizing Numbers (Intl)
      19:06
    • 170 Timers: setTimeout and setInterval
      13:53
    • 171 Implementing a Countdown Timer
      28:31
  • Section 13: Advanced DOM and Events [PROJECT]
    21 lectures • 5.3 hr
    • 172 Section Intro
      01:04
    • 173 PROJECT: "Bankist" Website
      08:49
    • 174 How the DOM Really Works
      10:36
    • 175 Selecting, Creating, and Deleting Elements
      20:28
    • 176 Styles, Attributes and Classes
      21:54
    • 177 Implementing Smooth Scrolling
      15:56
    • 178 Types of Events and Event Handlers
      10:33
    • 179 Event Propagation: Bubbling and Capturing
      05:03
    • 180 Event Propagation in Practice
      17:46
    • 181 Event Delegation: Implementing Page Navigation
      18:48
    • 182 DOM Traversing
      14:35
    • 183 Building a Tabbed Component
      24:08
    • 184 Passing Arguments to Event Handlers
      18:43
    • 185 Implementing a Sticky Navigation: The Scroll Event
      07:55
    • 186 A Better Way: The Intersection Observer API
      24:00
    • 187 Revealing Elements on Scroll
      12:39
    • 188 Lazy Loading Images
      18:30
    • 189 Building a Slider Component: Part 1
      23:16
    • 190 Building a Slider Component: Part 2
      19:35
    • 191 Lifecycle DOM Events
      09:26
    • 192 Efficient Script Loading: defer and async
      13:30
  • Section 14: Object-Oriented Programming (OOP) With JavaScript
    23 lectures • 4.2 hr
    • 193 Section Intro
      01:06
    • 194 What is Object-Oriented Programming?
      20:55
    • 195 OOP in JavaScript
      10:08
    • 196 Constructor Functions and the new Operator
      14:19
    • 197 Prototypes
      14:36
    • 198 Prototypal Inheritance and The Prototype Chain
      10:58
    • 199 Prototypal Inheritance on Built-In Objects
      14:46
    • 200 CHALLENGE #1
      07:27
    • 201 ES6 Classes
      12:57
    • 202 Setters and Getters
      13:15
    • 203 Static Methods
      06:24
    • 204 Object.create
      10:56
    • 205 CHALLENGE #2
      06:00
    • 206 Inheritance Between "Classes": Constructor Functions
      21:03
    • 207 CHALLENGE #3
      10:37
    • 208 Inheritance Between "Classes": ES6 Classes
      10:46
    • 209 Inheritance Between "Classes": Object.create
      08:53
    • 210 Another Class Example
      10:44
    • 211 Encapsulation: Protected Properties and Methods
      06:47
    • 212 Encapsulation: Private Class Fields and Methods
      16:11
    • 213 Chaining Methods
      04:42
    • 214 ES6 Classes Summary
      07:11
    • 215 CHALLENGE #4
      08:54
  • Section 15: Mapty App: OOP, Geolocation, External Libraries, and More! [PROJECT]
    15 lectures • 4.0 hr
    • 216 Section Intro
      00:58
    • 217 Project Overview
      05:02
    • 218 How to Plan a Web Project
      17:40
    • 219 Using the Geolocation API
      08:16
    • 220 Displaying a Map Using Leaflet Library
      13:48
    • 221 Displaying a Map Marker
      19:54
    • 222 Rendering Workout Input Form
      16:42
    • 223 Project Architecture
      09:28
    • 224 Refactoring for Project Architecture
      24:05
    • 225 Managing Workout Data: Creating Classes
      16:18
    • 226 Creating a New Workout
      34:06
    • 227 Rendering Workouts
      24:19
    • 228 Move to Marker On Click
      16:32
    • 229 Working with localStorage
      25:31
    • 230 Final Considerations
      05:41
  • Section 16: Asynchronous JavaScript: Promises, Async/Await, and AJAX
    22 lectures • 5.0 hr
    • 231 Section Intro
      00:55
    • 232 Asynchronous JavaScript, AJAX and APIs
      17:57
    • 233 Our First AJAX Call: XMLHttpRequest
      19:10
    • 234 [OPTIONAL] How the Web Works: Requests and Responses
      13:38
    • 235 Welcome to Callback Hell
      13:52
    • 236 Promises and the Fetch API
      09:25
    • 237 Consuming Promises
      09:24
    • 238 Chaining Promises
      09:13
    • 239 Handling Rejected Promises
      16:13
    • 240 Throwing Errors Manually
      15:23
    • 241 CHALLENGE #1
      16:31
    • 242 Asynchronous Behind the Scenes: The Event Loop
      17:53
    • 243 The Event Loop in Practice
      09:15
    • 244 Building a Simple Promise
      20:16
    • 245 Promisifying the Geolocation API
      13:26
    • 246 CHALLENGE #2
      15:53
    • 247 Consuming Promises with Async/Await
      15:06
    • 248 Error Handling With try...catch
      10:22
    • 249 Returning Values from Async Functions
      14:39
    • 250 Running Promises in Parallel
      10:56
    • 251 Other Promise Combinators: race, allSettled and any
      13:19
    • 252 CHALLENGE #3
      17:30
  • Section 17: Modern JavaScript Development: Modules, Tooling, and Functional
    15 lectures • 3.8 hr
    • 253 Section Intro
      00:47
    • 254 An Overview of Modern JavaScript Development
      06:38
    • 255 An Overview of Modules in JavaScript
      15:01
    • 256 Exporting and Importing in ES6 Modules
      22:38
    • 257 Top-Level await (ES2022)
      14:44
    • 258 The Module Pattern
      10:19
    • 259 CommonJS Modules
      04:24
    • 260 A Brief Introduction to the Command Line
      12:27
    • 261 Introduction to NPM
      18:40
    • 262 Bundling With Parcel and NPM Scripts
      21:39
    • 263 Configuring Babel and Polyfilling
      18:02
    • 264 Review: Writing Clean and Modern JavaScript
      10:26
    • 265 Let's Fix Some Bad Code: Part 1
      23:20
    • 266 Declarative and Functional JavaScript Principles
      12:25
    • 267 Let's Fix Some Bad Code: Part 2
      38:09
  • Section 18: Forkify App: Building a Modern Application [PROJECT]
    25 lectures • 8.4 hr
    • 268 Section Intro
      00:56
    • 269 Project Overview and Planning (I)
      14:21
    • 270 Loading a Recipe from API
      24:11
    • 271 Rendering the Recipe
      22:23
    • 272 Listening For load and hashchange Events
      11:02
    • 273 The MVC Architecture
      16:32
    • 274 Refactoring for MVC
      38:53
    • 275 Helpers and Configuration Files
      21:23
    • 276 Event Handlers in MVC: Publisher-Subscriber Pattern
      15:08
    • 277 Implementing Error and Success Messages
      11:34
    • 278 Implementing Search Results - Part 1
      25:46
    • 279 Implementing Search Results - Part 2
      28:15
    • 280 Implementing Pagination - Part 1
      12:18
    • 281 Implementing Pagination - Part 2
      37:05
    • 282 Project Planning II
      03:13
    • 283 Updating Recipe Servings
      26:40
    • 284 Developing a DOM Updating Algorithm
      34:22
    • 285 Implementing Bookmarks - Part 1
      25:59
    • 286 Implementing Bookmarks - Part 2
      18:31
    • 287 Storing Bookmarks With localStorage
      18:22
    • 288 Project Planning III
      02:08
    • 289 Uploading a New Recipe - Part 1
      17:43
    • 290 Uploading a New Recipe - Part 2
      40:37
    • 291 Uploading a New Recipe - Part 3
      19:58
    • 292 Wrapping Up: Final Considerations
      14:45
  • Section 19: Setting Up Git and Deployment
    6 lectures • 59 min
    • 293 Section Intro
      00:44
    • 294 Simple Deployment With Netlify
      11:18
    • 295 Setting Up Git and GitHub
      07:39
    • 296 Git Fundamentals
      19:36
    • 297 Pushing to GitHub
      09:30
    • 298 Setting Up Continuous Integration With Netlify
      10:06
  • Section 20: The End!
    1 lecture • 3 min
    • 299 Where to Go from Here
      03:00
  • Section 21: [LEGACY] Access the Old Course

The Complete JavaScript Course 2024: From Zero to Expert!

The modern JavaScript course for everyone! Master JavaScript with projects, challenges and theory. Many courses in one!

68h 26m 41s
English
October 16, 2024
Jonas
851712

The #1 bestselling JavaScript course on Udemy!

"Really, really well made course. Super in-depth, with great challenges and projects that will solidify your Javascript understanding. I found the lectures were paced perfectly -- Jonas doesn't skip over anything that might be useful to a JS developer" — Carson Bartholomew


JavaScript is the most popular programming language in the world. It powers the entire modern web. It provides millions of high-paying jobs all over the world.

That's why you want to learn JavaScript too. And you came to the right place!


Why is this the right JavaScript course for you?

This is the most complete and in-depth JavaScript course on Udemy (and maybe the entire internet!). It's an all-in-one package that will take you from the very fundamentals of JavaScript, all the way to building modern and complex applications.

You will learn modern JavaScript from the very beginning, step-by-step. I will guide you through practical and fun code examples, important theory about how JavaScript works behind the scenes, and beautiful and complete projects.

You will become ready to continue learning advanced front-end frameworks like React, Vue, Angular, or Svelte.

You will also learn how to think like a developer, how to plan application features, how to architect your code, how to debug code, and a lot of other real-world skills that you will need in your developer job.

And unlike other courses, this one actually contains beginner, intermediate, advanced, and even expert topics, so you don't have to buy any other course in order to master JavaScript from the ground up!

But... You don't have to go into all these topics. This is a huge course, because, after all, it's "The Complete JavaScript Course". In fact, it's like many courses in one! But you can become an excellent developer by watching only parts of the course. That's why I built this course in a very modular way, and designed pathways that will take you through the course faster.

By the end of the course, you will have the knowledge and confidence that you need in order to ace your job interviews and become a professional developer.


Why am I the right JavaScript teacher for you?

My name is Jonas, I'm an experienced web developer and designer, and one of Udemy's top instructors. I have been teaching this bestselling course since 2016 to over 850,000 developers, always listening to feedback and understanding exactly how students actually learn.

I know how students learn JavaScript and what they need in order to master it. And with that knowledge, I designed the ideal course curriculum. It's a unique blend of real-world projects, deep explanations, theory lectures, and challenges, that will take you from zero to an expert and confident JavaScript developer in just a couple of weeks.


So what exactly is covered in the course?

  • Build 5 beautiful real-world projects for your portfolio! In these projects, you will learn how to plan and architect your applications using flowcharts and common JavaScript patterns

  • Master the JavaScript fundamentals: variables, if/else, operators, boolean logic, functions, arrays, objects, loops, strings, and more

  • Learn modern JavaScript (ES6+) from the beginning: arrow functions, destructuring, spread operator, default arguments, optional chaining, and more

  • How JavaScript works behind the scenes: engines, the call stack, hoisting, scoping, the 'this' keyword, reference values, and more.

  • Deep dive into functions: arrow functions, first-class and higher-order functions, bind, and closures.

  • Deep dive into object-oriented programming: prototypal inheritance, constructor functions (ES5), classes (ES6), encapsulation, abstraction, inheritance, and polymorphism. [This is like a small standalone course]

  • Deep dive into asynchronous JavaScript: the event loop, promises, async/await, and error handling. You will use these to access data from third-party APIs with AJAX calls. [This is like a small standalone course]

  • Learn modern tools that are used by professional web developers: NPM, Parcel, Babel, and ES6 modules

Check out the course curriculum for an even more detailed overview of the content :)


This is what's also included in the package:

  • Up-to-date HD-quality videos, that are easy to search and reference (great for Udemy Business learners)

  • Professional English captions (not the auto-generated ones)

  • Downloadable starter code and final code for each section

  • Downloadable slides for 40+ theory videos

  • 25+ coding challenges and 25+ assignments to practice your new skills


Does any of these look like you? If so, then start this adventure today, and join me and 850,000+ other developers in the only JavaScript course that you will ever need!