The magic of JavaScript on server side

Francabel
4 min readMay 18, 2020

The previous article (The world of the Internet)is about the basic knowledge of the Internet. Now, we can use an environment, Node.js, to make a simple web server, so you will understand more clearly about the HTTP request. Before making the web server, I highly recommend to having some basic knowledge of NPM and some node module.

Node.js is a platform that allows developers use JavaScript on a server. So, when we want to build a web application ourselves, we can just run JavaScript. And we can read, delete, and update files to the server.

Let’s make a simple web server with Node.js.

First, we need to load three node modules, http, path, and fs and use a function called createServer() to build a http server. In this function, we have req, res as parameters. Req is for the request from client, and res is the response from the server.

Next, we call listen() function because we need to know which port we send a request. However, it is not always run on a specific port, so we need to use process.env.PORT to identify the port in the environment or it calls the port of 5000.

Second, you may notice that when you create a web server, every time, when you make a change, you have to stop your web server. Then, run again, so the change can be shown on your screen.

In order to see the instantaneous condition, we can use nodemon. It is a npm’s module that we can watch your application instantly. We go to package.json and install nodemon. Next, changing the script. The reason for changing it is that when people use your web app, they may not know your main files are because it could be something else. So, here we added dev to run nodemon index.js (main file).

Thirdly, we would like to read different page from our public folder. So, we need to decide which path should be loaded. If the request url is slash, the server will feedback index page, otherwise, it depends on the request url.

Due to different type of file, the content type should distinguish what kind of page is. So, we can use switch-case. If the page’s extension is .js, the content type is “text/javascript”. If the page’s extension is .json, it is “application/json”.

Finally, using fs to read files in the public folder. It will the same of two parrmeters, the file path and callback function. Firstly, if the npm output an error and the error code is ENOENT, it means there is no content user requests, so we need to load 404.html. After loading the 404 page, the header should be shown the http status code (200, successfully read the page) and the server responses the content of 404 page. Secondly, there are lots of error, maybe on the client side or the server side, so we need to identify in the else statement.

Thirdly, if not error, the page should load the content of the page. The following photo illustrates the difference from three page. The left-hand-side is the index.html, the middle is 404 page, and the right-hand-side is about.html.

There are tons of web applications related Node.js. The above I shared is a simple example for help you understand what Node.js works and to learn more practically how Internet runs.

Hoping my article is helpful for people who is a beginner of Node.js.

Reference to Lidemy and Traversy Media

--

--

Francabel

從業務轉換跑道,目前正朝著前端工程師邁進,寫code是生活,是工作,也是態度。轉職是一段旅行,享受旅行的過程,並指引到夢想處