Set up a web server for learning HTTP headers

Motivation

We all follow the client-server model using the HTTP protocol for most of our web apps today. In development, we simply may have a backend API server and a frontend (web pages or mobile apps) only. However, it seemed that a proxy server is always required for production. In fact, most of the hardest issues in production come from integration. The requests and responses might be modified by the proxy server. Therefore, the understanding of HTTP protocol is one of the key skills to resolve those issues.

I wanted to dive deep into HTTP with some core concepts such as caching, cookies, and CORS. I didn't intend to go quickly rather than moved slowly to have a well understanding of what I do.

Prepare a server

The easiest way is to use my laptop as a server then I can just use "localhost". I can also use ngrok to make my web server online. Finally, I use an online tool such as RedBot to check the HTTP headers.

To make it more excited though, I deployed the app on AWS EC2. It was quite easy to launch an EC2 instance by using the wizard setup of AWS. Just simply use default settings for most of the cases. I was just curious about how to creating a new VPC (Virtual Private Cloud). To understand what exactly the IPv4 address and CIDR are, I first started to grab some knowledge about those topics by watching the following videos on YouTube

IPv4 Addressing Lesson 1: Binary and the IP Address

IPv4 Addressing Lesson 2: Network IDs and Subnet Masks

IPv4 Addressing Lesson 3: The Class System

Next, I tried to create and do configure a virtual private network using Cisco Packet Tracer. I needed to configure IP address for involved devices: routers, servers, and laptop. Also, I did configure the routing tables for each router so that I could send packets among devices.

Coding

I used Express for my web server simply serving static files. I configured the HTTP header easily through passing the options of "express.static" middleware.

	'use strict';
	const express = require('express');
	const PORT = process.env.PORT || 8080;
	const app = express();
	app.use(express.static('public', {
	etag: true,
	lastModified: true,
	setHeaders: (res, path) => {
	if (path.endsWith('.html')) {
	res.setHeader('Cache-control', 'no-cache');
	}
	},
	}));
	app.listen(PORT, function() {
	console.log('Your server is running on port ' + PORT);
	});

view raw gnouh.js hosted with ❤ by GitHub

Deployment

Docker is my favourite tool for deployment. I created an image for my container running on my EC2 instance which I have already installed Docker. I also applied some best practices of Node.js and Docker. I built and pushed my Docker image into Docker Hub so that I could pull the image within the EC2 instance.

	FROM node:12
	LABEL author="Huong Nguyen (vnnvanhuong@gmail.com)"
	# Use NODE_ENV=production to ensure that
	# logging is kept to a minimum
	# more caching levels takes
	# don’t install dev node_modules
	ARG NODE_ENV=production
	ARG UID=999
	ARG GUI=999
	ENV NODE_ENV=${NODE_ENV}
	# Use pre-existing "/usr/src/app" rather than create a new dir such as "mkdir /app"
	WORKDIR /usr/src/app
	# change the uid/gid
	RUN groupmod -g ${UID} node && usermod -u ${UID} -g ${GUI} node
	# give another name "gnouh" for user "node"
	RUN usermod -d /home/gnouh -l gnouh node
	# Copy package*.json before copying the source code
	# Docker will cache node_modules as a separated layer
	# Hence, node_modules is not need to installed again if no change in package.json
	COPY package*.json ./
	RUN npm ci
	COPY . .
	EXPOSE 8080
	# bypass the package.json's start command
	CMD [ "node", "server.js" ]
	USER gnouh

view raw gnouh.Dockerfile hosted with ❤ by GitHub

Happy coding!