Week 1: Basics of JavaScript

Day 1: Introduction to JavaScript

JavaScript is a programming language that adds interactivity to websites & functionality to the web pages.

What is JavaScript?

JavaScript, often abbreviated as JS, is a lightweight, interpreted programming language. "Interpreted" means that the code doesn't need to be compiled before running. Instead, web browsers can understand and execute JavaScript directly.

Setting up the Development Environment

To start writing JavaScript, you don't need any special software. All modern web browsers (like Chrome, Firefox, Safari) can run JavaScript. You can write JavaScript code directly inside your HTML files, or you can create separate ( .js ) files and link them to your HTML pages.

Environment Setup for JavaScript with Node.js

1. Install Node.js:

   • Visit the official Node.js website.

   • Download the installer for your operating system (Windows, macOS, or Linux).

   • Follow the installation instructions. This will also install npm (Node Package Manager) automatically.

2. Verify Installation:

   • Open a terminal (Command Prompt on Windows, Terminal on macOS/Linux).

   • Check if Node.js and npm are installed correctly by running:

       node -v
       npm -v
     

   • These commands should print the versions of Node.js and npm installed.

3. Create a Project Directory:

   • Choose or create a directory where you want to work on your JavaScript projects.

4. Create and Run JavaScript Files:

   • Create a JavaScript file (e.g., app.js) in your project directory.

   • Write your JavaScript code. For example, in app.js:

       console.log('Hello, Node.js!');
     

   • Run the script from the terminal:

       node app.js
     

     You should see Hello, Node.js! printed in the terminal.

Embedding JavaScript in HTML

There are three ways to include JavaScript in your web pages:

1. Inline: Write JavaScript code directly inside HTML tags using the onclick, onmouseover, etc., attributes.

    <button onclick="alert('Hello, World!')">Click me</button>
   

2. Internal: Write JavaScript code inside <script> tags within your HTML file.

    <script>
        console.log('Hello, World!');
    </script>
   

3. External: Save JavaScript code in a separate .js file and link it to your HTML file using the <script> tag's src attribute.

    <script src="script.js"></script>
   

Writing Your First JavaScript Program

Let's write a simple JavaScript program that displays a greeting message in the browser's console:

// This is a JavaScript comment. The following line prints a message to the console.
console.log('Hello, World!');

• console.log('Hello, World!'): This line tells the browser to print "Hello, World!" to the console. The console.log() function is used for debugging and printing messages while developing JavaScript code.

Summary

In summary, JavaScript is a versatile programming language used for making websites interactive. You can start coding JavaScript directly in your web browser or in separate .js files linked to your HTML.

In Day 2, we'll dive into variables and data types in JavaScript.