Library chevron_right

The Complete JavaScript Course 2024: From Zero to Expert!

Contents
About

Course Contents

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