How to Plugin Html and css using Express (Node JS Framework)

Express is a Node JS Framework for Web based application. Express can be used to plugin static resources in the web project mainly the html and css files.

We will see here how can we plugin these files using express with example.

Example To Plugin Html CSS

Before we get started on these, certain pre-requisite packages need to be installed.

One is the Node js itself which can be easily installed from online. it will be available as a exe and can be installed with default settings just like normal application.

Once the Node js is installed we can verify if the installation is proper with the help of command node --version in the powershell.

Node JS version check

Once Node is installed we need to install the required node packages using the node packet manager(npm).

Suggested Read : Creating Node JS Webserver

Some of the packages required for this will be express, which can be installed with the help of commands npm init and npm install express.

We will see the progress of the installation in the PowerShell window where we have executed the command. Once the installation is done the installed package version is added to the package.json file which gets created during the npm init phase.

Package file for node

We can add the following code to the app.js startup file which is created during the init phase.

Referring html files in the express app

In the arguments for path.join() we have to specify the relative path of the folder where the html and css file resides as in my case its "../_html_css".Then run the node server with the command node <startup js file name> in the PowerShell.

Comments

Popular posts from this blog

Creating RESTful Minimal WebAPI in .Net 6 in an Easy Manner! | FastEndpoints

Step By Step Guide to Detect Heap Corruption in Windows Easily

How to dynamically add Properties in C# .NET?