What is JavaScript?
JavaScript is the code that makes a web page react: opening menus, updating a basket or checking a form as you type.
In real life
If HTML is the house and CSS the decoration, JavaScript is the electricity: it makes the doorbell ring and the lights come on.
Try it yourself
Switches
This lesson
rosas-bakery.example
Basket (0)
Fresh bread, baked at 6am
Order by 10am, collect after lunch.
Sourdough loaf
£4.00
Cinnamon bun
£2.50
Lemon cake
£3.00
The code behind it (simplified)
HTML: what's on the page
<h1>Fresh bread, baked at 6am</h1>
<p>Order by 10am, collect after lunch.</p>
<li class="card">
<img src="sourdough.svg" alt="Sourdough loaf">
<h2>Sourdough loaf</h2>
<p>£4.00</p>
<button>Add to basket</button>
</li>CSS: how it looks
.card {
border: 2px solid navy;
border-radius: 20px;
}
button {
background: yellow;
font-weight: bold;
}JavaScript: how it reacts
button.onclick = () => {
basket = basket + 1;
showBasketCount(basket);
};Press Add to basket, then switch JavaScript off and press it again.
Where you will use this
- Module 4: Code without fearComing soon
- Track 2, lesson 3: Generate your first appComing soon
Quick check: JavaScript
Question 1 of 3