DEV Community

Muhammad Rizwan Ashiq
Muhammad Rizwan Ashiq

Posted on

How to run JavaScript

To learn and practice JavaScript, you need to run JavaScript locally. There are many ways to run JavaScript locally. In this article, we will learn how to run JS locally using Node.js, and also we will learn how to run JS locally using browser.

Running JS locally

We can run JS using multiple ways, here are some of them:

Tip: You need to download, and install IDE or code editor to develop your project. You can use VS Code, WebStorm, or anyone else. I use VS Code, it's the very popular code editor. It is lightweight, and easy to manage. You can download it from the link.

Using Node.js

Node.js is a JavaScript runtime environment that allows you to run JavaScript on your computer. Node.js runs on the V8 engine, which is the same engine that runs in Google Chrome. Node.js is an open-source, cross-platform, JavaScript runtime environment that executes JavaScript code outside of a browser.

To use Node.js, you need to download and install it from the link first.

After installing, you need to create a file with a .js extension, for example, hello-world.js and then write your JS code in that file like this:

console.log("Hello World!");
Enter fullscreen mode Exit fullscreen mode

Then, you need to open a command prompt or terminal window, navigate to the directory where the file is located, and then type:

node hello-world.js
Enter fullscreen mode Exit fullscreen mode

This will run the JavaScript file and print Hello World! to the console.

Using Browser

In browser, we can run JS by two ways:

Using console

You can run JS locally using browser. You just need to open your browser, and then write your JS code in the browser console. You can open the browser console by pressing F12, or by right-clicking on empty space in the browser, and then clicking on Inspect. Then, click on Console tab. Then, write your JS code in the console.

Caution: Safari browser doesn't support JS console
You can't run JS locally using browser if you are using a browser like Safari. Because Safari doesn't support JS console.

Using script tag

First, you need to create a file with .html extension. For example, index.html. Then, you need to add the following code to the file:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>How to run JS locally</title>
    </head>
    <body>
        <script>
            const name = "Rizwan Ashiq";
            console.log(`Hello, ${name}!`);
        </script>
    </body>
</html>
Enter fullscreen mode Exit fullscreen mode

Then, you need to open the index.html file in the browser. You can use any browser you want. I use Google Chrome. Then, you will see the following result in the console:

Hello, Rizwan Ashiq!
Enter fullscreen mode Exit fullscreen mode

You can also add a separate file for JS code. For example, create a file named script.js and then add the following code to the file:

const name = "Rizwan Ashiq";
console.log(`Hello, ${name}!`);
Enter fullscreen mode Exit fullscreen mode

Then, you need to add the following code to the index.html file:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>How to run JS locally</title>
    </head>
    <body>
        <script src="script.js"></script>
    </body>
</html>
Enter fullscreen mode Exit fullscreen mode

It will run the script.js file in the browser console. So, you will see the following result in the console:

Hello, Rizwan Ashiq!
Enter fullscreen mode Exit fullscreen mode

And then whatever you write in the script.js file, it will be executed in the browser console. For example, if you write the following code in the script.js file:

const name = "Rizwan Ashiq";
const age = 20;

if (age > 18) {
    console.log(`${name} is an adult.`);
} else {
    console.log(`${name} is a child.`);
}
Enter fullscreen mode Exit fullscreen mode

Then, you will see the following result in the console:

Rizwan Ashiq is an adult.
Enter fullscreen mode Exit fullscreen mode

Using Online IDEs

You can run JS locally using online IDEs like JS Fiddle, JS Bin, CodePen, Repl.it, and many others.

You can create a new project on any of these online IDEs, and then write your JS code in that project. You can run your JS code using the Run button.

What do I prefer?

I prefer node.js as it is easy to use, no need to go back and forth between the browser and the code editor. I can run my JS code directly from the terminal. I would recommend you to use node.js. However, you could use any of the above methods to run JS locally.

Conclusion

In this article, we have learned how to run JS locally using Node.js, and also we have learned how to run JS locally using browser. We have also learned how to run JS locally using online IDEs.

Top comments (0)