lesson1Title

lesson2Title

lesson3Title

lesson4Title

lesson5Title

lesson6Title

lesson7Title

lesson8Title

lesson9Title

lesson10Title

lesson11Title

lesson12Title

lesson13Title

lesson14Title

webIntroJsChapter1Title

lesson15Title

lesson16Title

webIntroJsChapter2Title

webIntroJsChapter3Title

lesson17Title

webIntroJsChapter4Title

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link
      href="https://fonts.googleapis.com/css2?family=Noto+Sans"
      rel="stylesheet"
    />
  </head>
  <body>
    <h1>Getting Started with JavaScript</h1>
    <button id="showButton">Click and Enter Name</button>
    <p id="greeting"></p>
  </body>
</html>

// Code to display a greeting when the button is clicked after entering a name
const showButton = document.getElementById('showButton'); // Select the button element
const greeting = document.getElementById('greeting'); // Select the p element

// Detect button click with addEventListener
showButton.addEventListener('click', function () {
  // Prompt user for name input and assign it to a variable
  const name = prompt('Please enter your name:');
  
  // Check the input name and display a greeting
  if (name && name.trim() !== '') {
    // When the input name is not an empty string
    greeting.textContent = 'Hello, ' + name.trim() + '!'; // Display the greeting
  } else {
    // When the input name is an empty string
    greeting.textContent = 'Please enter a name.'; // Prompt to enter the name
  }
});

# What is JavaScript?

JavaScript is often referred to as the brain of web pages.

JavaScript is a **programming language** that adds dynamic features to websites.

What exactly do we mean by `dynamic` features?

Here are some examples of dynamic features:

1. **Event Handling**: An event refers to an action that a user takes on a website. Using JavaScript, you can make a website respond to events like button clicks, mouse hovers, or keyboard inputs. For example, you can make a button change color when it is clicked.

2. **Form Validation**: When logging in, you enter your username and password, right? JavaScript can be used to validate the data in a webpage's form, ensuring that an entered value is an email, or the password is at least 6 characters long, for instance.

3. **Animations and Effects**: Along with CSS, you can add animations to a webpage. For example, you can make certain HTML elements fade in or appear after a set amount of time.

4. **Data Fetching & Sending**: You can retrieve desired data from a server that provides dynamic web content and display it on a webpage, or send necessary data to the server.

5. **Creating Interactive Elements**: You can create interactive elements like sliders that can be moved sideways or dropdowns that display sub-items.

6. **Manipulating Web Page**: You can hide or show specific parts of a webpage, or add content, based on certain events.

<br />

JavaScript is an essential component in building web pages, alongside HTML and CSS.

JavaScript is widely used in not only web pages displayed in browsers but also in various application fields like web servers, mobile apps, and desktop apps.

<br />

## Practice

Follow along by entering the highlighted parts of the code yourself.

JavaScript can add dynamic functionalities to a website that change based on user actions. For example, it can respond to events such as button clicks or mouse movements.

### JavaScript is a programming language that can add [blank] functionalities to a website.