JavaScript Course Overview

Welcome to the JavaScript Course

This course introduces JavaScript fundamentals through practical exercises. Each chapter covers key concepts and includes exercises to apply your skills. Use the provided Figma designs and GitHub solutions for guidance.

Chapter Breakdown

Chapter 1: JavaScript Basics

In this chapter, you’ll learn essential JavaScript methods for manipulating the DOM, such as using document to access elements, innerHTML to modify content, and creating reusable code with functions. You’ll also cover basic data types like strings, numbers, and booleans.

Exercises:

  1. Use document.getElementById to modify an HTML element.
  2. Write a function that accepts parameters and returns a calculated value.
  3. Practice with different data types by declaring and logging variables.

Chapter 2: Control Structures

Here, you’ll explore control structures, including loops, conditions, and arrays. Learn to create loops with for, make decisions with if, and use objects and arrays to store and manipulate collections of data.

Exercises:

  1. Use a for loop to iterate over an array of items.
  2. Write a conditional statement using if to check a variable’s value and log a message.

Chapter 3: Interaction Methods

This chapter covers JavaScript interaction methods, such as displaying alerts, using for...in to iterate over object properties, confirming actions with confirm, and transforming data with map.

Exercises:

  1. Display a prompt and alert the user’s response.
  2. Use the map function to double each number in an array.

Chapter 4: Loops and Selectors

You’ll learn about while and do...while loops for repeated execution, assignment operators for variable manipulation, and querySelector and outerHTML for targeting and modifying specific elements.

Exercises:

  1. Use a while loop to count down from 10.
  2. Modify the outerHTML of an element using querySelector.

Chapter 5: Events and Math

This chapter introduces the event object for handling user interactions, Math for performing calculations, RegExp for pattern matching, and the switch statement for handling multiple cases.

Exercises:

  1. Create an event listener that responds to a button click.
  2. Use Math.random to generate a random number.
  3. Write a regular expression to validate email format.

Chapter 6: Browser and Async

Here, you’ll work with browser-specific objects like window, screen, and cookies. Additionally, you’ll learn about timing functions and asynchronous JavaScript to handle delayed tasks and user sessions.

Exercises:

  1. Set a timeout to display a message after 5 seconds.
  2. Retrieve and display screen properties (width, height) of the user’s device.

Chapter 7: Data Management

This chapter introduces managing data with JavaScript classes, working with dates, storing data in JSON format, and using localStorage for persistent data storage in the browser.

Exercises:

  1. Create a class with a constructor and methods.
  2. Store an object in localStorage and retrieve it to display in the console.

How to Navigate This Course

  1. Start with Chapter 1 and proceed sequentially through the chapters.
  2. Refer to the Figma design links for each exercise to understand the layout and requirements.
  3. Complete each exercise and compare your results with the GitHub solutions.
  4. Use the solutions to help troubleshoot if needed.

Happy coding with JavaScript! 🚀