Frontend Tools and a Simple HTTP Website
Before we start I would like to take a moment to acknowledge that I am simply a confused student at best and definitely not an expert. And I am writing to share my views as a beginner and hopefully help other people who are in the same situation.
The complexity of frontend toolchains can be mind-blowing. It’s been a couple of years since the last time I learned JavaScript stuff, but honestly, I don't think I understood many of the techniques I learned. It really surprises me to know how simple it can be to use Nginx to serve just a couple of HTML files, and that you don’t have to use web frameworks, docker containers, and reverse proxy servers all the time. I must say, I only began to see how these pieces can fit together just now.
Server
The term “server” can refer to either a physical computer that usually lives in a data centre or a server program that receives internet requests and serves content.
Nginx/Web Server
Just like other web server programs, Nginx itself can be used to serve HTML files and config related settings such as SSL, but at the same time, Nginx is also often used as a reverse proxy server, that is, you can run a web program using port 8080 or whatever, and Nginx can redirect traffic from port 80 to port 8080 for you.
Web Frameworks
While web frameworks usually come with built-in servers, which allow developers to run their files locally and easily using port 8080, for example, they are actually meant for building and testing web pages, and that’s why developers are often encouraged to use a mature web server application such as Nginx to serve their sites, using Nginx either as a plain web server that serves static files or as a reverse proxy server that simply redirects traffic.
It’s also easy to confuse routing with serving since it looks like it’s the routing “engine” that takes us everywhere, and some web frameworks focus more on routing and other backend stuff, such as ExpressJS, but actually, the responsibility of a server program is actually just to answer requests and serve the files in the specified directory (by default the index.html file).
Docker
Well, Docker is a very versatile tool. It is more of an operating system tool for web applications and simplifies a lot of things by using virtual machines. For example, developers can pack their files and the built-in server into a docker container and runs everything on virtual machines. When you feel ready to deploy your site, you don't need to install and configure npm, node, git and stuff, you just install Docker, run the container and you are good to go. If you need even more automation, you can use Docker Compose or Kubernetes.
Conclusion
Of course, these tools have all been developed to solve specific problems and have made deploying and scaling much easier for large projects. However, it’s still sad to see how difficult it has been to tell them apart and how easy it is for a beginner to get carried away and feel lost in this vast forest. So many people are talking about these advanced tools that it seems like an almost daunting task even if you just want to see your HTML file go live.
