Skip to main content

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


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.

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.

Happy coding!

Comments

Popular posts from this blog

What the heck is Meteor DDP?

I was using Meteor for my messenger project. I was so curious about the real time connection. I wanted to know how exactly this mechanism works. In this post, I will go through the DDP Specification, an overview of WebSocket, and a simple demo about how to subscribe a publication of Rocket.Chat (containing a DDP server) from an external webpage. At a glance, I knew that Meteor invented a protocol called DDP which uses for handling real time connection. So then, what is DDP? "DDP (Distributed Data Protocol) is the stateful WebSocket protocol that Meteor uses to communicate between the client and the server." [1] All right! Why does DDP matter? "DDP is a standard way to solve the biggest problem facing client-side JavaScript developers: querying a server-side database, sending the results down to the client, and then pushing changes to the client whenever anything changes in the database" . [2] In order to understand deeply the protocol, I decided ...

Strategy Design Pattern

For example, I have a program with an Animal abstract class and two sub-classes Dog and Bird. I want to add new behavior for the class Animal, this is "fly".  Now, I face two approaches to solve this issue: 1. Adding an abstract method "fly" into the class Animal. Then, I force the sub-classes should be implemented this method, something like: public abstract class Animal{ //bla bla public abstract void fly(); } public class Bird extends Animal{ //bla bla public void fly(){ System.out.println("Fly high"); } } public class Dog extends Animal{ //bla bla public void fly(){ System.out.println("Cant fly"); } } 2. Creating an interface with method "fly" inside. The same issue to an abstract class, I force the classes these implement this interface should have a method "fly" inside: public interface Flyable{ public void fly(); } public class Bird implements Flyable{ //bla bla public void fly(){ System.out.pr...

Journal: This Month I Learned (2022-Nov)

This Month I Learned posts are aimed to share what I have learned during the month such as my thoughts, recommend resources, tips, how-to, and so on. Vung Tau beach Engineering Levels I conducted a lot of meetings with HRM to define the standards for evaluation criteria, career path ladder, Personal Appraisal (PA) processes, and onboarding/offboarding processes. I knew more about the expectation from an HRM perspective for engineering levels evaluation criteria. For example Define many enough titles for a long career path development Define general criteria for each level How to calculate score when evaluation with weight matrix applied Anticipate risks before executing a process Team Engineering Lead Organization I collected ideas from different people When having no dedicated leader, every member of the team has a fairly chance to practice leadership skills Scalability strategy: development teams’ size, and new position nomination. Security Awareness Training I conducted this sharing...

Installing NGINX on macOS

I have heard of a lot of NGINX recently. One of them was it can help for security issues; for sure, it much be more. It so happens that our team has got a ton of user stories from a security audit. It's time to delve into it. What is NGINX? In order to get a basic idea and have some fun , I've just picked some available posts from my favorite Vietnamese blogger communities as below: https://kipalog.com/posts/Cau-hinh-nginx-co-ban---Phan-1 https://viblo.asia/hoang.thi.tuan.dung/posts/ZabG912QGzY6 NGINX (pronounce: Engine-X) is a web server (comparing to IIS, Apache). It can be used as a reverse proxy ( this is what I need for security issues with configuration ), load balancer and more. How to get started? I found the below path for learning NGINX by googling "learn nginx": https://www.quora.com/What-are-some-good-online-resources-to-learn-Nginx In this post, I only went first step. This is installing NGINX on macOS and taking a first look at the confi...

Only allow input number value with autoNumeric.js

autoNumeric is a jQuery plugin that automatically formats currency and numbers as you type on form inputs. I used autoNumeric 1.9.21 for demo code. 1. Dowload autoNumeric.js file from  https://github.com/BobKnothe/autoNumeric 2. Import to project <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="js/autoNumeric.js"></script> 3. Define a function to use it <script type="text/javascript"> /* only number is accepted */ function txtNumberOnly_Mask() { var inputOrgNumber = $("#numberTxt"); inputOrgNumber.each(function() { $(this).autoNumeric({ aSep : '', aDec: '.', vMin : '0.00' }); }); } </script> 4. Call the function by event <form> <input type="text" value="" id="numberTxt"/>(only number) </form> <script ty...