WDD 131 | JavaScript Introduction

W01 Learning Activity: Introduction to JavaScript

Overview

JavaScript is a popular, well-supported programming language used to create interactive and dynamic web pages, mobile apps, desktop applications, and more. It is a high-level language that runs in the browser, and it can also run on the server side with a runtime like Node.js.

In this class, you will learn to apply your prerequisite programming knowledge to the web using JavaScript. This language uses the same principles and common control structures as other programming languages such as Python and C#.

JavaScript is one of the three core technologies of web frontend development, alongside HyperText Markup Language (HTML) and Cascading Style Sheets (CSS).

HTML defines the structure and meaning of a page.
CSS defines the style or presentation of a page.
JavaScript handles behavior based on user interaction and other events.

Associated Course Learning Outcomes

Demonstrate proficiency with JavaScript language syntax.
Use JavaScript to respond to events and dynamically modify HTML.

Activity Instructions

Answer the following questions. You can use the MDN resource What is JavaScript? or conduct your own research.

You are encouraged to responsibly use contemporary language models and generative AI tools like ChatGPT, Gemini, Claude, Microsoft Copilot, and Meta AI. Learn to cautiously use these tools as an on-demand tutor to help define concepts, clarify questions, and provide guidance.

What is the file extension used for JavaScript files?
Check Your Understanding
```
.js
```
How is JavaScript included on web pages?
Check Your Understanding

A <script> HTML tag is used to include JavaScript code in HTML like this:
```
<script></script>
```
The script tag can be used anywhere on the page.
This course uses external script files and places the source reference in the head of the HTML document.
What is the standard way this course references JavaScript?
- Use external JavaScript files.
- Place the .js JavaScript files in the scripts subfolder.
- Reference the script file in the head of the HTML document.
- Use the defer attribute to ensure the HTML loads first so that JavaScript can interact with the HTML.
Check Your Understanding
```
<head>
  ...
  <script src="scripts/myscripts.js" defer></script>
</head>
```

Common Misconceptions and Language Issues

JavaScript is not the same programming language as the Java programming language. They are two different languages with different syntax and purposes.
The plural form of "code" in programming is just "code", not "codes".
Example: "Please review my code." or "Please review my program". Not "Please review my codes."
JavaScript is not just for the browser and client-side scripting. With the introduction of server-side frameworks like Node.js, JavaScript can be used for server-side development as well. JavaScript is a mature language that has become more powerful and versatile over time.