Setup Development Environment for JavaScript. #JS-Shorts [6]

How to Run JavaScript Code in Live Server. JS-Shorts Start Now Free Course. For any one wish to learn JavaScript. #Code #Debug #Test and #Release.

Setup Development Environment for JavaScript. #JS-Shorts [6]

(How to Run JavaScript Code in Live Server.)

1) In order to write JavaScript code we need a code editor.

SIMPLE, LIGHT-WEIGHT, CROSS-PLATFORM AND POWERFUL CODE-EDITORS ARE:

Click on the link above and install one of the code editor in your system.

2) The second thing we want to install is Nodejs.

Download and install Node from Nodejs.org

We actually don't need Node to run JavaScript code, because JavaScript code can be run on browsers. But we need to have Nodejs on our machines to install third-party liberaries. (Don't panic, will later explain what is third-party liberaries.)

After installing Node. We will see the preview of Node by running JS-code using Node outside of  browser.
(In the previous article we have learnt to run JavaScript code within the browser)

3) Get ready to Run JavaScript code using Node.

  1. Create a folder called js-node (or any name is fine)
  2. Open this folder in VSCode (or any editor that you have installed)
  3. Add new file index.html in the folder.
Create a folder called js-node (or any name is fine)
Open this folder in VSCode (or any editor that you have installed)
Add new file index.html in the folder.

Start writing code:

Type ! (exclamation mark) and press tab. This will generate some basic HTML boilerplate.

Type ! (exclamation mark) and press tab. This will generate some basic HTML boilerplate.

Now, install live-server:

  1. Open the extensions tab in VSCode.
  2. Search for live server
  3. Click on install. Then restart VSCode.
I have already installed - that is why its showing Uninstall for me.

Next, right click on index.html file and click on open with live server.

Right click on index.html file and click on Open with Live Server

This will open up chrome or default browser and serve our web application page. It should show us empty page at URL http://127.0.0.1:5500/index.html

Your first web page is empty web page!

Add H1 tag <h1>Hello World</h1> in our HTML file.

See line no. 10 added H1 tag

The browser will automatically refresh and display Hello World.

Web page serving Hello World

Next

Start Code in JavaScript. #JS-Shorts [7]
Start writing Code in JavaScript. JS-Shorts Start Now Free Course. For any one wish to learn JavaScript. #Code #Debug #Test and #Release.