Introduction
In this article, we will learn how we can develop a web application using Node.js. Let's start step by step.
I attached a link about the introduction of Nodejs and get an idea of What Nodejs is? and how to install Node js step by step to get the idea.
Step 1. Go to the NodeJS website and download NodeJS
Download the Windows Installer from Nodejs official website ( https://nodejs.org/en/download ). Make sure you have downloaded the latest version of NodeJs. It includes the NPM package manager. Already install the node js and skip the above step.
Step 2. Make sure Node and NPM are installed and their PATHs defined
Check If you have a doubt whether you have installed everything correctly or not, let's verify it with "Command Prompt"
Picture 1. Get the Command Prompt
To verify the installation and confirm whether the correct version was installed,
Enter the following command to Check the node version.
Node --version or Node -v
Check the npm version, and run this command:
npm --version or npm -v
Picture 2. Node version: 18.10.0 and npm version: 8.19.2
Step 3. Create a new project
You can create a project folder wherever you want on your computer and name it whatever you want.
Picture 3. I create a new folder in my E:/ drive and as a Project name sample_nodejs
Picture 4. Open the Project folder directory in the vs-code
Step 4. Create a new js file
Create a .js File By using the .js file extension
Picture 5. I mentioned the above picture about the New File. From the File Explorer toolbar, press the New File button.
I Create an app.js file in the project folder. Create a simple string variable in app.js and send the contents of the string to the console: save the file.
var message= “Hi C# Corner”;
console.log(message);
Step 5. Run the App
It's simple to run app.js with Node.js. From a terminal, just type: Node .\app.js
Picture 6. View > Terminal (Ctrl+` with the backtick character) will open the integrated terminal, and you can run node .\app.js
there:
You can see the "Hi C# Corner" output to the terminal, and then Node.js returns
Step 6. Install NPM Packages
install npm package Go to the terminal and type npm init -y this command line, we highlight -y when we install in npm' npm init' Does that time ask a question: package name? We can give the package name as yourself. Otherwise, it takes the default name Project Folder Name. If entered, the command line npm init -y takes the saver name as the default.
Picture 7. Package.json was created.
I'm going to run this Project in package.js, So I have to add a line in scripts at package.js "serve": "node app.js".
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"serve": "node app.js"
},
I'm going to run the application with this command npm run serve.
Picture 8. You can see the "Hi C# Corner" output to the terminal, and then Node.js returns.
What Is Express JS?
Express is a node js web application framework that provides broad features for building web and mobile applications. It is used to build a single page, multipage, and hybrid web application.
Features of Express Framework
- Allows to set up middlewares to respond to HTTP Requests.
- Defines a routing table that is used to perform different actions based on HTTP Method and URL.
- Allows to dynamically render HTML Pages based on passing arguments to templates
Let's start with the Express framework in our Project. https://www.npmjs.com/package/express
npm install express or npm i express
Installed the Express in the app directory and saved it in the dependencies list, Express version - 4.18.2
I recommend the nodemon package for Node. js-based applications by automatically restarting the node application when the file changes in the directory are detected. Link here- https://www.npmjs.com/package/nodemon.
nodemon will be installed globally on your system path.
npm install -g nodemon # or using yarn: yarn global add nodemon
Step 8. Write down the following code in the app.js file
const express = require("express");
const app = express();
const port = 3000;
//routes
app.get("/", (req, res) => {
res.send("HI C# Corner!");
});
app.listen(port, () => {
console.log(`My Sample Nodejs App Listening On Port ${port}`);
});
Following is a very basic Express app that starts a server and listens on port 3000 for the connection.
app.listen(port, () =>
{console.log(`My Sample Nodejs App Listening On Port ${port}`)
})
The app responds with "HI C# Corner!" for requests to the root URL (/) or route.
app.get('/', (req, res) => {
res.send('HI C# Corner!')
})
Simple to run an app; open the integrated terminal, and you can run'npm run serve`
`npm run serve`
This app starts a server and listens on port 3000 for connections.
Step 9. Now you can see the output on your browser
Now go to http://localhost:3000/ in the browser, and you will see the following output:
Summary
In this article, we will learn how to create a Node project and how we can develop a web application using Node.js. It is a runtime environment and library for running JavaScript code outside the browser. It must be installed on the system by downloading the software from the Node.js website and setting the path in the environment variables section.