JavaScript is one of the most popular programming languages used for web development. It allows you to add interactivity and dynamic behavior to your websites. In this blog post, we will dive into the basics of JavaScript by creating a simple ‘Hello World’ program. Let’s get started!
Setting Up the HTML File
To begin, create an HTML file and name it “index.html”. Open the file in your preferred text editor and add the following code:
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
</head>
<body>
<script src="script.js"></script>
</body>
</html>
In this code, we have included a reference to an external JavaScript file named “script.js” using the <script> tag.
Creating the JavaScript File
Now, let’s create the JavaScript file. In the same directory as the HTML file, create a new file named “script.js”. Open the file and add the following code:
// script.js
// Displaying 'Hello World' in the browser console
console.log("Hello World");
// Displaying 'Hello World' in an alert box
alert("Hello World");
// Displaying 'Hello World' on the web page
document.write("Hello World");
In this code, we have used three different methods to display the ‘Hello World’ message. The console.log() method prints the message to the browser console. The alert() function displays the message in a pop-up alert box. However, it’s important to note that the document.write() method, which writes the message directly on the web page, is not recommended. This method replaces the entire content of the webpage with the new message, which can lead to unintended consequences.
Viewing the Result
To see the output of our ‘Hello World’ program, open the “index.html” file in a web browser. Open the browser’s developer console (usually by right-clicking on the page and selecting “Inspect” or “Inspect Element”) to view the console output. You should see the ‘Hello World’ message displayed in the console. Additionally, an alert box should appear with the message, and the text “Hello World” will be written on the web page itself.
Conclusion
Congratulations! You have successfully created a ‘Hello World’ program in JavaScript. You learned how to set up an HTML file, link it to a JavaScript file, and use various methods to display output. This is just the beginning of your JavaScript journey. With JavaScript, you can create interactive web applications and bring your ideas to life. Keep exploring and building upon this foundation to unlock the full potential of JavaScript.
If you wish to learn more about JavaScript, please subscribe to our newsletter today and continue your JavaScript learning journey with us! 😊
