JavaScript is a programming language used to make websites interactive. It runs in browsers (e.g., Chrome) and can also work outside browsers with Node.js. This tutorial focuses on writing and running a simple program that outputs "Hello, World!".
- A computer with a web browser (e.g., Google Chrome).
- A text editor (Notepad is fine, but Visual Studio Code is recommended—free at code.visualstudio.com).
- Optional: Node.js (we’ll guide you through installation for Method 2).
- No coding experience needed.
This method uses a browser to run JavaScript, displaying the output in the browser’s console.
- Open your text editor (e.g., Notepad or VS Code).
- Create a new file and name it
index.html. Save it in a folder, likeC:\Users\YourName\Documents\JS_Tutorial.
- Copy and paste the following code into
index.html:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>My First JavaScript Program</title> </head> <body> <h1>Hello, World! Program</h1> <script> console.log("Hello, World!"); </script> </body> </html>
- Save the file (
Ctrl+SorFile > Save).
What’s happening here?
<!DOCTYPE html>: Declares the file as HTML.<script>: Contains JavaScript code.console.log("Hello, World!");: Prints "Hello, World!" to the browser’s console.
- Navigate to your folder (e.g.,
C:\Users\YourName\Documents\JS_Tutorial). - Double-click
index.htmlto open it in your default browser, or drag the file into an open browser window (e.g., Chrome). - The browser will display a page with the heading "Hello, World! Program".
- Open the browser’s Developer Tools:
- On Chrome: Right-click the page, select Inspect, or press
Ctrl+Shift+I(Windows) orCmd+Option+I(Mac). - Go to the Console tab.
- On Chrome: Right-click the page, select Inspect, or press
- You should see "Hello, World!" in the console.
- If you don’t see it, check for typos in the code or ensure the file was saved.
- To show "Hello, World!" directly on the page, modify the
<script>section inindex.html:<script> document.write("Hello, World!"); </script>
- Save the file and refresh the browser (
F5orCtrl+R). - The text "Hello, World!" will appear on the web page below the heading.