JavaScript Tutorial: Learn Modern JavaScript Step by Step

HTML gives the page its structure and CSS makes it look good. JavaScript lets the page respond to what the user does. A button can open a menu, a form can show an error, and a page can load new data without a full reload.

This course teaches modern JavaScript from the first line to small, complete projects. Each lesson explains one idea in plain language, shows a short example you can run and change, and points out the mistakes people usually make.

What is JavaScript, and where does it run?

JavaScript is the programming language of the web. Every major browser can run it, which is why almost every interactive website uses it. You can read the full explanation in What Is JavaScript?.

JavaScript also runs outside the browser, for example in Node.js on a server. These are different runtimes: the language is the same, but the tools around it are not. This course is about browser JavaScript. Server-side JavaScript is mentioned only to make the difference clear, in Browser, Node.js and Other Environments.

HTML, CSS and JavaScript

The three work together. HTML creates a button, CSS styles it and JavaScript makes it do something. You will use that relationship throughout the course, and the lessons do not repeat the HTML and CSS curriculum. If you need it, see the HTML course and the CSS course.

Modern JavaScript, not only ES6

JavaScript is defined by a standard called ECMAScript, and it gets a new edition every year. The latest published edition is ECMAScript 2026. The course teaches the stable features developers use today (let and const, arrow functions, modules, async and await, optional chaining and more) and says so clearly when a newer feature may not work in every browser. JavaScript Versions explains the names.

What you will be able to do

By the end of the course you will be able to:

• Write JavaScript with variables, conditions, loops, functions, arrays and objects.
• Change a page with the DOM, respond to events and validate forms.
• Work with JSON, browser storage and fetch().
• Understand promises, async and await, and handle errors properly.
• Split code into modules and use modern language features.
• Use classes, collections, iterators and the main browser APIs.
• Write safer, more accessible and faster code, and debug it with browser tools.
• Build 15 small projects: a counter, a to-do list, tabs, a modal, a quiz and more.

Before you start

You need a web browser and, ideally, a little HTML and CSS. No programming experience is needed. You can write all the code in the Try it editors on this site.

How to use this course

• Go in order. Lessons build on earlier ones. Use the chapter list on the left (or the course button on a phone).
• Press Try it. Most examples have a Try it button that opens an editable copy with a live result or console output. Change something and press Run.
• Read the output. Lines such as // → 24 in the code show what a console.log prints.
• Do the exercises. Exercises and challenges are marked in the chapter list. Try them before opening the solution.
• Break things on purpose. Errors are part of programming. Reading Console Errors shows how to read them.

Frequently Asked Questions