How to run JavaScript
Tags: javascript, webdev, beginners, programming
Published: 2023-05-27 05:17:07

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:

- [Using Node.js](#using-nodejs)
- [Using Browser](#using-browser)
- [Using Online IDEs](#using-online-ides)

Tip: You need to download, and install IDE or code editor to develop your project. You can use [VS Code](https://code.visualstudio.com/), [WebStorm](https://www.jetbrains.com/webstorm/download/), 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](https://code.visualstudio.com/).

## 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](https://nodejs.org/en/download/) 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:

```js
console.log("Hello World!");
```

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

```bash
node hello-world.js
```

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` in inspect element](#using-console)
- [Using `script` tag in HTML](#using-script-tag)

### 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:

```html
<!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>
```

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:

```bash
Hello, Rizwan Ashiq!
```

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:

```js
const name = "Rizwan Ashiq";
console.log(`Hello, ${name}!`);
```

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

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

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

```bash
Hello, Rizwan Ashiq!
```

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:

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

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

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

```bash
Rizwan Ashiq is an adult.
```

## Using Online IDEs

You can run JS locally using online IDEs like [JS Fiddle](https://jsfiddle.net/), [JS Bin](https://jsbin.com/?html,output), [CodePen](https://codepen.io/), [Repl.it](https://repl.it/languages/javascript), 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.