DEV Community

Cover image for #2 Pure NodeJs: simple server (Part 2)
Bashar
Bashar

Posted on • Edited on

#2 Pure NodeJs: simple server (Part 2)

In this tutorial we will continue the previews article to learn how to create simple Node Js server and show you different between serving plain text and html as response with no packages at all just pure Node Js core modules.

programs and versions:
nodejs: v18.19.0
npm: v10.2.3
vscode: v1.85.2

should work on any nodejs > 14

Lets Start:

I assume that you had read the simple server (Part 1) article if not this the code we used:

const http = require('http');

const server = http.createServer((req, res) => {
  res.end('Hello World!');
});

const PORT = 2121;
server.listen(PORT, 'localhost', () => {
  console.log(`server run on port ${PORT}`);
});

Enter fullscreen mode Exit fullscreen mode

we will add this code before the res.end(..):

res.writeHead(200, { 'Content-Type': 'text/plain' });
Enter fullscreen mode Exit fullscreen mode

the "res.writeHead" It is used to write the response header to the request. It takes two arguments: the HTTP status code (like: 200 success, 204 no content, 404 not found etc..) and an object containing the response headers.
so in this example we set the 'Content-Type' to be 'text/plain' but the default is 'text/html'.
the different between the 'text/plain' and the 'text/html' 'Content-Type' that the 'text/plain' will be wrap it with "pre" html tag so even if we write it like this:

res.end('<h1>Hello World!</h1>');
Enter fullscreen mode Exit fullscreen mode

and run the server by this command (the file name is server.js):

node server.js
Enter fullscreen mode Exit fullscreen mode

open the browser you will find the page show the text as it

<h1>Hello World!</h1>
Enter fullscreen mode Exit fullscreen mode

but if we don't write the header or if we write it as:

res.writeHead(200, { 'Content-Type': 'text/html' });
Enter fullscreen mode Exit fullscreen mode

there result in browser will be big bold "Hello World!" as should it be with "h1" html tag

Most common Content-Type:

  • text/plain: Plain text
  • text/html: HTML documents
  • text/css: Cascading Style Sheets (CSS)
  • application/json: JSON data
  • application/javascript: JavaScript code
  • application/xml: XML data
  • image/jpeg: JPEG images
  • image/png: PNG images
  • image/gif: GIF images
  • audio/mpeg: MP3 or other MPEG audio files
  • video/mp4: MP4 video files
  • application/pdf: PDF documents

the complete code:

const http = require('http');

const server = http.createServer((req, res) => {
  res.writeHead(200, { 'Content-Type': 'text/html' });
  res.end('<h1>Hello World!</h1>');
});

const PORT = 2121;
server.listen(PORT, 'localhost', () => {
  console.log(`server run on port ${PORT}`);
});

Enter fullscreen mode Exit fullscreen mode

Conclusion:

In this article we show you the different 'text/plain' and 'text/html' and list most used Content-Type header value.

In the upcoming article I'll guide you through the process of serving HTML file as a response

Top comments (0)