Using Node.js, ExpressJS, and Socket.io for Real-Time Web Applications
When you navigate to a web page, the server that houses the files for that page receives a request, and sends the appropriate files to the client (your computer). In a lot of cases, this would be an HTML file that probably links to a CSS file and might also link to a JavaScript file on the same server. Generally, on a static website, the HTML file will contain all of the content elements for the website, the CSS would apply some styling properties to elements in the HTML, and the JavaScript might perform some computations that could be informed by user interactions. These are the standard building blocks of many websites, and they are the primary elements of what we refer to as front-end or client-side web development. However, as technology advances, as our reliance on technology increases, and as more people develop (no pun intended) web skills, the value of server-side knowledge is increasing.
I have just recently started exploring server-side web development, so my knowledge is still very limited, but through this post, I hope to share the value that I am finding in it and give a bit of insight towards its usefulness. I won’t include any code examples or much meaningful technical insight, but at the end of the post, I will include a couple of the resources that have been helpful to me as I have started exploring this realm of web development.
What is Node.js?
Node.js is a framework that allows us to build server-side programs with JavaScript. An understanding of fundamental JavaScript concepts (the general syntax structure, variables, loops, functions, and the Document Object Model) is somewhat necessary before jumping into Node.js, but with at least a basic understanding of those things, it is fairly easy to get started with Node.js. JavaScript has traditionally been used for front-end computations like programming responses to user interactions. PHP is -and will continue to be- the standard for server-side programming, but Node.js allows those who are familiar with JavaScript as a tool for front-end development to quickly jump into server-side work.
What is ExpressJS?
ExpressJS is a library for Node.js that simplifies HTTP methods. HTTP (HyperText Transfer Protocol) is the method used for transferring files between servers and clients. The primary methods of HTTP are: Get, Post, Put, and Delete. When you navigate to a web page within a web browser, the server receives a Get request. When the server receives that request, it responds by serving the client with the file that was asked for (often an HTML file), and the browser renders it. If the server receives a Post request, it is being asked to add something new. A Put request prompts the server to update an existing object. A Delete request asks the server to remove an object. Basically, ExpressJS makes these methods easy to engage and manipulate through JavaScript in Node.js.
What is Socket.io?
Socket.io is another Node.js library. It uses the Web Sockets API to create connections between clients. With Socket.io, the server can interpret requests and send responses to all (or any) of the clients connected to the server.
Why would we use these things?
With a basic understanding of JavaScript, we can combine Node.js with the Express and Socket.io libraries to build RTAs (Real-Time Applications). This means that, when a client connects with a server (rather than just serving static files), we can continuously update the content that users see- in real time- without them having to refresh their browser. Socket.io specifically allows us to update the content in one user’s browser as a response to the actions of another user connected to the server. In this way, we can develop web applications like instant messengers, multi-player games, collaborative tools, and a whole bunch of other things that we might not have even considered.
Why should we care?
We could use these tools to build something that changes the world.
“How do I get started?”
The very first steps would be cultivating an understanding of how the internet works in general. If you have a pretty good understanding of the roles of files, clients, and servers, learning the fundamentals of HTML, CSS, and JavaScript (in that order) would be the next step. If these are new to you, w3schools.com is an excellent resource for learning web technologies. Once you understand how JavaScript works, it will also be useful to know what the Terminal/Command Line is and generally how to work within it. With some knowledge of these things, you will be ready to use Node.js to communicate with a server through JavaScript.
As I started exploring these concepts, I found these tutorials from tutorialspoint.com very thorough and helpful:
For node.js:
for ExpresJS:
for Socket.io:
