JavaScript Example
javascript
const lesson = "Learn by building"
const completed = true
if (completed) {
console.log("Ready for next chapter")
}Guided tutorial track
Learn JavaScript from scratch with practical examples covering variables, functions, arrays, objects, DOM manipulation, events, and browser scripting.
Tutorial overview
This tutorial is designed to be followed in order. Read the chapter, practice with the editor, test your understanding, and move toward completion.
Lessons
207
Sections
24
Access
Free
Level
beginner
Ready to begin?
Start with lesson one and follow the tutorial step by step.
This tutorial teaches JavaScript from a first variable to code that reacts to a click, fetches data and updates the page - the language itself first, then the browser APIs that make it useful.
Values, a condition, and output
javascript
const name = "Ada"
const visits = 3
if (visits > 1) {
console.log(`Welcome back, ${name}`)
} else {
console.log(`Hello, ${name}`)
}JavaScript is the language that makes a page do something. HTML describes what is there, CSS decides how it looks, and JavaScript decides what happens when someone interacts with it.
Unlike HTML and CSS it is a real programming language: variables, conditions, loops, functions and data structures. That makes it harder, and also the reason it is worth the time.
In every browser, with no install and no build step. Open the console on this page and you are already in a JavaScript environment.
It also runs on servers through Node, which is why it is the one language that can cover a whole product. This tutorial stays in the browser, because that is where the feedback is immediate.
this.async/await and fetching data.Each chapter is short and runnable, and the order is deliberate: nothing uses an idea you have not met yet.
Reacting to a click
javascript
const button = document.querySelector("#go")
const output = document.querySelector("#out")
button.addEventListener("click", () => {
output.textContent = "Clicked at " + new Date().toLocaleTimeString()
})Five lines, and the page responds to a person. Most of what you will write professionally is a longer version of exactly this shape: find something, listen for something, change something.
Frameworks like React exist to manage that pattern at scale - but they are JavaScript underneath, and they make far more sense once this is second nature.
Basic HTML, and enough CSS to recognise a class selector. You need to know what an element is before you can ask JavaScript to find one.
No maths beyond arithmetic, and no prior programming. If this is your first language, expect the first few chapters to be slower than the rest - that is normal and it passes.
The basics - variables, conditions, loops, functions - take a week or two of evenings, and they transfer to every other language you will ever learn.
The DOM is quick and immediately satisfying, because every change is visible. Asynchronous code is the wall most people hit, and it is worth going slowly there rather than pushing on.
You will not remember every method, and you do not need to. Knowing that something exists and what it is called is most of the skill; the exact arguments are a search away.
JavaScript. React is a JavaScript library, and starting with it means every problem looks like a React problem when most of them are language problems wearing a costume.
No, and the similar name is a marketing accident from 1995. They are unrelated languages with different uses, syntax and runtimes.
Eventually, and it is worth it - but not yet. TypeScript is JavaScript plus a type system, so everything here still applies. Learning both at once means never being sure which one is confusing you.
Almost always asynchronous work: a fetch or a timer finishes after the lines below it have already run. The chapters on promises and async/await exist specifically for this.
Yes. A model will produce plausible JavaScript that is subtly wrong, and reviewing it is now a core part of the job. You cannot review what you cannot read.
Work through these in order. Each part builds on the one before it, and every part lists what it covers and roughly how long it takes.
JavaScript Introduction
6 lessons36 min
What is JavaScript · JavaScript Features · JavaScript Syntax …
Start this partJavaScript Basics
3 lessons18 min
JavaScript Variables · JavaScript Data Types · JavaScript Operators
Start this partJavaScript Statement & Expression
7 lessons42 min
JavaScript Statements · JavaScript Expressions · JavaScript Keywords …
Start this partJavaScript Conditions
5 lessons30 min
JavaScript if Statement · JavaScript if else Statement · JavaScript else if Statement …
Start this partJavaScript Loops
8 lessons48 min
JavaScript for Loop · JavaScript while Loop · JavaScript do while Loop …
Start this partJavaScript Functions
14 lessons84 min
JavaScript Functions · JavaScript Function Declarations · JavaScript Function Expressions …
Start this partJavaScript Scope & Hoisting
6 lessons36 min
JavaScript Scope · JavaScript Block Scope · JavaScript Hoisting …
Start this partJavaScript Arrays
14 lessons84 min
JavaScript Arrays · JavaScript Array Access · JavaScript Array push and pop …
Start this partJavaScript Objects
11 lessons66 min
JavaScript Objects · JavaScript Object Methods · JavaScript Object keys and values …
Start this partJavaScript DOM
12 lessons72 min
JavaScript DOM · JavaScript DOM Selectors · JavaScript DOM Content …
Start this partJavaScript Events
12 lessons72 min
JavaScript Events · JavaScript addEventListener · JavaScript Event Object …
Start this partJavaScript Asynchronous
12 lessons72 min
JavaScript Asynchronous · JavaScript setTimeout · JavaScript setInterval …
Start this partJavaScript Classes
12 lessons72 min
JavaScript Classes · JavaScript Class Constructor · JavaScript Class Methods …
Start this partJavaScript Type System
8 lessons48 min
JavaScript typeof · JavaScript Type Conversion · JavaScript Type Coercion …
Start this partJavaScript Strings
12 lessons72 min
JavaScript Strings · JavaScript Template Literals · JavaScript String Escape Characters …
Start this partJavaScript Numbers & Math
10 lessons60 min
JavaScript Numbers · JavaScript Number Methods · JavaScript parseInt and parseFloat …
Start this partJavaScript Errors
8 lessons48 min
JavaScript Errors · JavaScript try catch · JavaScript throw …
Start this partJavaScript Map & Set
5 lessons30 min
JavaScript Map · JavaScript Map Methods · JavaScript Set …
Start this partJavaScript Dates
6 lessons36 min
JavaScript Dates · JavaScript Date Formatting · JavaScript Date Arithmetic …
Start this partJavaScript Regular Expressions
8 lessons48 min
JavaScript Regular Expressions · JavaScript Regex Characters · JavaScript Regex Quantifiers …
Start this partJavaScript Storage & BOM
8 lessons48 min
JavaScript localStorage · JavaScript sessionStorage · JavaScript Storing Objects …
Start this partJavaScript Modules
6 lessons36 min
JavaScript Modules · JavaScript export · JavaScript import …
Start this partJavaScript Generators & Iterators
7 lessons42 min
JavaScript Iterators · JavaScript Iterables · JavaScript Generator Functions …
Start this partJavaScript Performance
7 lessons42 min
JavaScript Performance Basics · JavaScript Debounce · JavaScript Throttle …
Start this partJavaScript Introduction
JavaScript Basics
JavaScript Statement & Expression
JavaScript Conditions
JavaScript Loops
JavaScript Functions
JavaScript Scope & Hoisting
JavaScript Arrays
JavaScript Objects
Read the lesson, edit code in the Try-It editor, and see the result instantly.
Each topic is supported with practical examples so the tutorial stays easy to follow.
Open the browser editor and test what you just learned without leaving the site.
Use the assessment flow to test whether the chapters are really understood.
Complete the learning flow and move toward a verifiable completion certificate.
Follow the lessons in order so each new concept builds on the previous one.
Open the Try It Editor and apply the idea immediately while it is fresh.
Use the quiz and progress flow to confirm the topic is really understood.
Complete the tutorial journey and move toward a verifiable certificate.
Finish the lessons, take the assessment, and move toward a certificate that can be verified on the site. The structure is meant to help you learn, practice, and complete the topic properly.
Certificate verification
Publicly verifiable after successful completion.
JavaScript is explained with beginner friendly chapters and examples.
Understand the core building blocks before moving into advanced topics.
Use each lesson as a practical step toward real web development.