This is the mission briefing. We will define our objective: to master the fundamentals of JavaScript for adding interactivity to websites. This lesson outlines the course structure and the project we will enhance.

HTML is the skeleton and CSS is the style; JavaScript is the brain that adds behaviour. This lesson defines JavaScript's role as the language of interactivity on the web, making pages responsive and dynamic.

This lesson covers the first practical steps. We will create our first JavaScript file, connect it to our HTML document using the script tag, and use the console to verify that our setup is working correctly.

This lesson introduces variables, the fundamental way JavaScript stores information. We will cover the let and const keywords and discuss the professional standard for when to use each.

All information in JavaScript has a type. This lesson introduces the three most common primitive data types: strings for text, numbers for mathematics, and booleans for true or false logic.

This lesson covers the basic operators for performing calculations and making comparisons. We will explore arithmetic operators for math and comparison operators for evaluating logical statements.

This lesson introduces conditional logic, the primary way a program makes decisions. You will learn to use if and else statements to execute different blocks of code based on a condition.

Functions are reusable blocks of code that perform a specific task. This lesson covers how to define and call your own functions, a core principle for writing organized and efficient code.

To manipulate a webpage, you must first select the element you want to change. This lesson introduces the powerful document.querySelector() method for precisely targeting any HTML element on your page.

Once an element is selected, you can change it. This lesson covers how to modify an element's text content, alter its inner HTML, and dynamically add or remove CSS classes to change its style.

Interactivity begins when your code responds to the user. This lesson covers the addEventListener() method, showing you how to listen for user actions like clicks and run a function in response.

This lesson covers how to retrieve data that a user has typed into a form. We will use the .value property to access the input from form fields, a key skill for interactive applications.

Theory is now practice. This lesson guides you through applying all the concepts from this chapter to build a functional dark mode toggle button for your profile page project.

This lesson introduces arrays, the fundamental data structure in JavaScript for storing ordered lists of items. You will learn how to create an array and access its individual elements.

To work with lists of data, you must repeat actions. This lesson introduces the for...of loop, the modern and professional standard for iterating over every item in an array.

This lesson introduces objects, the data structure for storing complex, related information as key-value pairs. Objects are how you model real-world things, like a user or a product, in your code.

This lesson combines data structures and loops to generate HTML dynamically. You will learn how to take an array of objects and transform it into a list of elements on your webpage.

In this practical lesson, we will use arrays, objects, and loops to dynamically generate a list of your skills and add it to your profile page project, transforming static data into dynamic content.

JavaScript is single-threaded, meaning it can only do one thing at a time. This lesson explains why long-running tasks like network requests require asynchronous code to avoid freezing the webpage.

This lesson defines two critical concepts. We will explain what an API is and its role in web communication, and introduce JSON as the standard format for exchanging data on the web.

This lesson introduces the modern, professional standard for making network requests. We will use the fetch() function with the async and await keywords to cleanly request data from an API.

Once you request data, you must process it. This lesson covers how to handle the response from a fetch() call, check for errors, and parse the JSON Data so it is ready for use in your application.

In this lesson, you will apply your asynchronous skills by connecting to a free, public API. You will fetch data from this external service and display it on your profile page project.

Before a project goes live, it needs a final check. This lesson covers the essential steps for preparing your code for deployment, ensuring all files are correctly linked and the project is ready for a public server.

This practical lesson guides you through the process of deploying your website for free. We will use GitHub Pages to take your local project files and make them accessible to anyone on the internet.

Vanilla JavaScript is the foundation, but the professional world often uses frameworks. This lesson provides a brief, high-level overview of what JavaScript frameworks are and why they are used.

This final lesson summarizes the core skills you have learned throughout the course. We will review your completed project and provide a clear roadmap for what to learn next on your path as a developer.