Professional JavaScript (Beginner to Advanced!)

This is the #1 resource to master modern JavaScript (ES6+)!

Take your JavaScript to an advanced, professional level by building beautiful, real-world projects from scratch (2 small beginner projects, 1 big intermediate project and 1 big advanced project). Other courses start from outdated concepts first (like ES5 and below) — we will use modern concepts right from the start (ES6+ like const/let and arrow functions — of course properly explained).

Course Projects

Top-tier, real-world projects. Expertly engineered to help you code modern websites & web apps with the latest best practices.

• 2 Small beginner projects:

  • Fancy Counter: Build a useful counter app

  • Word Analytics:Build a slick word analytics app

• 1 Big intermediate project:

  • CorpComment: Build a sleek public feedback tool

• 1 Big advanced project:

  • rmtDev: Build a stylish job board for remote developer jobs

What You’ll Learn

1) How to code JS in 2024 by building realistic projects from scratch and seeing how it all fits together

2) Avoid hundreds of beginner mistakes so the people who have to interact with your code have it easy

3) Deeply master JS/programming basics: var/let/const, functions, objects & arrays, etc.

4) Critical best practices that every JS-developer should know (e.g. how to use async/await)

5) Learn how to communicate with an API properly by using fetch()

6) Learn the crucial additions to JS: arrow functions, destructuring, spread operator, etc.

7) Easily master React/Angular/Vue or Node.js afterwards since you mastered concepts often used in those frameworks

8) Build modern web apps without frameworks and see why people use React

9) Implement a simple build process for JS with webpack and Babel

10) BONUS: By going through the course you’ll naturally improve design/HTML/CSS too

Specifically, these are the concepts you will learn in no particular order

• What is JavaScript & What can we do with it

• how to include JS in HTML-file (‘defer’)

• var/let/const

• when to use let instead of const

• deep mastery of data types & structures (arrays, objects, etc.)

• deep mastery of functions (traditional vs arrow functions)

• template literals (“)

• ternary operator (? 🙂

• how to manipulate HTML (also called DOM manipulation) — querySelector(), getting user input from input field, disabling buttons, etc.

• how to manipulate CSS

• dealing with events (e.g. click and typing events)

• event delegation (event bubbling)

• deal with forms (user submits data — very common)

• how modern websites and web apps work generally from a JavaScript perspective

• if-else statements

• setTimeout()

• && operator

• array methods (e.g. .forEach(), .map(), .slice(), .join())

• string methods (e.g. .includes(), .trim())

• DRY-concept (Don’t Repeat Yourself)

• how to extract repetitive code into its own helper function

• how to communicate with servers properly

• fetch() API

• GET-requests

• POST-requests

• AJAX

• how to work with JSON

• synchronous vs asynchronous code

• promises (.then and .catch)

• error handling (throw new Error)

• 2xx, 4xx and 5xx HTTP status codes

• async / await

• try / catch

• what is ‘state’ and ‘rendering’

• overall structure / architecture

• folder structure

• most common loop (forEach)

• increment or decrement by 1 (++ and –)

• unary plus operator (+)

• modularity (IIFE’s vs separate your JS-code into multiple files)

• how to deal with XSS

• comments in JS

• regular expressions

• URL-structure (scheme / protocol, domain, query string parameters)

• destructuring

• undefined and null

• truthy and falsy values

• optional chaining (?.)

• import/export (ES Modules) vs require/module.exports (CommonJS)

• named export vs default export

• default value for function parameter

• what is refactoring

• helper / utility functions

• implement common features like sorting & pagination

• routing (e.g. how to manipulate URL)

• window object

• DOMContentLoaded

• LocalStorage

• build process (webpack, Babel, PostCSS)

• formatting in JS (semicolons, tabs vs spaces)

• for loop

• and more! (can’t include everything here)

Avoid struggling with JavaScript for years to come. Hope to see you in the course!

Rating Distribution

• 1 stars: 1 votes
• 2 stars: 6 votes
• 3 stars: 23 votes
• 4 stars: 109 votes
• 5 stars: 268 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!