Introduction

JavaScript is a high-level programming language that runs in every web browser, adding interactivity and behavior to websites, and also powers servers, apps, and tools through runtimes like Node.js.

Part of the free JavaScript course at LearnCodingFast — hands-on lessons with examples you run in your browser, plus practice exercises and a quick quiz.

Welcome to JavaScript — the world's most popular programming language for creating interactive websites, apps, and even servers.

What You'll Learn in This Lesson

Good News: JavaScript Runs in Your Browser!

Unlike most programming languages, you do not need to install anything to run JavaScript. Every web browser (Chrome, Firefox, Safari, Edge) has JavaScript built in!

If you have a web browser, you can already run JavaScript!

You can practice directly on this website using the "Try It Yourself" sections — no setup needed!

3 Ways to Run JavaScript on Your Computer

1 Browser Console (Fastest Way)

Open your browser's Developer Tools to run JavaScript instantly:

You should see Hello, World! appear in the console!

2 Create an HTML File (Recommended for Learning)

Open any text editor (Notepad, TextEdit, VS Code) and save a file as:

Double-click the file to open it in your browser. You will see an alert popup!

3 Install Node.js (For Advanced Users)

Node.js lets you run JavaScript outside the browser — useful for building servers and tools.

Visit nodejs.org and download the LTS version.

Real-World Analogy: Think of building a webpage like putting on a play:

• HTML = The stage and props (structure)
• CSS = The costumes and lighting (style)
• JavaScript = The actors bringing everything to life (behavior)

Without JavaScript, your webpage would be like a stage with no actors — static and unable to respond!

🌍 What is JavaScript?

JavaScript (JS) is the core language of the modern web . Every time you click a button, open a dropdown, or see a game running in your browser — JavaScript is behind it.

Technology

Role

Example

HTML

Structure

Buttons, headings, images

CSS

Style

Colors, fonts, spacing

JavaScript

Behavior

Click handlers, animations, data

Together, these three form the foundation of web development .

💡 Why Learn JavaScript?

• ✅ Essential for Web Developers Every website you visit uses JavaScript for interaction — buttons, sliders, animations, and forms.
• ✅ Full-Stack Power You can use JavaScript on the backend with Node.js, creating APIs and databases.
• ✅ Huge Ecosystem Thousands of frameworks like React, Vue, Angular, Express make building complex apps easier.
• ✅ High Demand & Salary JS developers are among the most sought-after, earning between £40,000–£120,000+ per year.
• ✅ Cross-Platform Language Used for mobile apps (React Native), desktop apps (Electron), and even IoT devices.

⚙️ JavaScript in Action

When you type something into a website search bar, submit a form, or click a menu that expands — JavaScript code is what makes it happen instantly without reloading the page .

• Respond to user actions
• Fetch and display live data (e.g., YouTube comments, stock prices)
• Validate input fields before sending to a server
• Build games, tools, calculators, and dashboards

🚀 Your First JavaScript Program

In JavaScript, you use the console.log() function to show output (messages, results, or test results). Let's start with the classic "Hello, World!" example.

When you run this line, your output will appear in the console (the output section below).

💬 What This Does:

• console — is a built-in JavaScript object that lets us send information to the browser console.
• .log() — is a method that prints text, numbers, or values inside parentheses () .
• "Hello, World!" — is a string , a type of text value surrounded by quotes.

Congratulations — you just ran your first JavaScript program! 🎉

🧩 Key JavaScript Concepts (For Absolute Beginners)

Let's go through the most important building blocks one by one.

🟨 Comments

Comments are notes you write for yourself or other developers . They are ignored by the computer.

💡 Tip: Writing good comments helps you and others understand your thought process when revisiting code later.

🟩 console.log()

Used to display output or debug your program.

👉 Debugging means finding problems (bugs) in your code. console.log() helps track what's happening inside your program at different points.

🟧 Strings — Text in JavaScript

A string is any text enclosed in quotes. JavaScript allows:

• • Double quotes "text"
• • Single quotes 'text'
• • Template literals

💡 Template literals (the ones with backticks let name = "Alice"; console.log(\ } 🟦 Numbers and Booleans Numbers in JavaScript can be integers or decimals :

Booleans represent true or false values, used for conditions and logic:

🟥 Variables (Containers for Data)

• • let creates a variable that can be updated later.
• • const creates one that cannot change.
• • var is the old style (avoid using it now).

💡 Best Practice: Always use const unless you know the value will change.

🧮 Basic Arithmetic

JavaScript can perform all common math operations.

✅ Use these for calculators, finance tools, or even game logic.

🧠 Data Types Summary

Type

Description

String

"Hello"

Text

Number

42

Numeric value

Boolean

true

True or false

Null

null

Empty value

Undefined

undefined

Variable declared but not given a value

Object

Data collection

Array

[1, 2, 3]

Ordered list of values

📜 More Key Concepts

🧰 The Role of Semicolons

Semicolons ( ; ) mark the end of a statement. They are optional in JavaScript but strongly recommended for clarity.

It's good habit to use them consistently — especially in larger apps.

⚡ Output Methods

Besides console.log() , JavaScript can display output in other ways:

alert() is good for quick tests. document.write() is rarely used in modern code but useful for learning basics.

⚙️ Case Sensitivity

JavaScript is case-sensitive , meaning Name and name are not the same variable.

📜 Keywords and Identifiers

Keywords are reserved words that have special meaning (like let , const , if , function ). Identifiers are names you choose for variables, functions, etc.

• • Must start with a letter, _ , or $
• • Cannot start with a number
• • Case-sensitive
• • Cannot use reserved words

🧭 Understanding the Execution Flow

JavaScript runs top to bottom — each line in order, unless you use loops or conditions.

🧩 Common Beginner Mistakes

Here are some of the most frequent errors new coders face:

• ❌ Missing quotes: console.log(Hello) → ✅ console.log("Hello")
• ❌ Forgetting parentheses: console.log "Hi" → ✅ console.log("Hi")
• ❌ Typo in console : consle.log() → ✅ console.log()
• ❌ Wrong case: Console.Log() → ✅ console.log()
• ❌ Using = instead of == or === in comparisons

🧠 Debugging Tip

Use the browser console to test small snippets. Open Developer Tools → Console (F12 or right-click → Inspect → Console tab) and type:

You can run JavaScript directly from there — perfect for practice and experimenting.

🧩 Practice Challenges

• Your First Output — Print your name and favorite hobby using console.log() .
• Age Display — Store your age in a variable and print it with a sentence using template literals.
• Quotes Practice — Print three lines using " " , ' ' , and quotes.
• Comments Practice — Add both a single-line and a multi-line comment explaining what your program does.
• Experiment — Try printing numbers, booleans, and mix text + variables.

⚡ What You Learned

• ✅ How to write your first JavaScript program
• ✅ What console.log() does
• ✅ The difference between strings, numbers, and booleans
• ✅ How to use comments
• ✅ How to avoid common syntax errors
• ✅ Why JavaScript is the foundation of the web

📋 Quick Reference — JavaScript Basics

Concept

console.log()

console.log("Hello!");

"hello" or 'hello' or

42 , 3.14

true / false

Comment

// single line or /* multi */

Lesson 1 Complete — Introduction to JavaScript!

You've taken your first step into JavaScript! You now know how JS runs in the browser, how to use console.log() , and the basic data types.

Up next: Variables & Data Types — how to store and name any piece of data your program needs! 📦

Practice quiz

Continue this course

• Next: Variables & Data Types