Learning NodeJS Part 4: Introduction to Express

In late fall of 2020, I went on a mission to better understand Node. I wanted to improve the way I use it, how I might be able to use more of its features, and moreover grow my front end knowledge to full stack. This series includes the notes I've compiled from my learnings over at The Odin Project. The lessons also include general web concepts necessary to better work with Node.

The purpose of this section is to gain familiarity with what Express is, how it superpowers Node with the functionalities it provides, and the main building blocks of an Express application.

Understanding Express

Why use a web framework?

Common web-development tasks are not directly supported by Node itself. If you want to add specific handling for different HTTP verbs (e.g. GET, POST, DELETE, etc.), handle requests at different URL paths ("routes"), serve static files, or use templates to dynamically create the response, Node won't be of much use on its own. You will either need to write the code yourself, or you can avoid reinventing the wheel and use a web framework.

Explain the general process of how a dynamic web app functions. Where does Express fit into this?

In a traditional data-driven website, a web application waits for HTTP requests from the web browser (or other client). When a request is received the application works out what action is needed based on the URL pattern and associated information contained in POST / GET data. Depending on what is required it may then read or write information from a database or perform other tasks required to satisfy the request. The application will then return a response to the web browser, often dynamically creating an HTML page for the browser to display by inserting the retrieved data into placeholders in an HTML template.

After the request is received, this is when Express can come in handy. From Node's perspective, Express is just another package that you need to install using NPM and then require in your own code.

Express is often described as 'unopinionated', what does that mean?

Unopinionated frameworks have far fewer restrictions on the best way to glue components together to achieve a goal, or even what components should be used. They suggest the best setup is the one you think would work optimally for use case.

Write "Hello World" with Express

const express = require('express'); // import express module
const app = express(); // create an Express application
const port = 3000;

// route definition, callback function that will be invoked whenever
// there is an HTTP GET request with a path relative to the site root
// callback function takes a request and a response object as arguments
// and calls send() on the response to return the string "Hello World!"
app.get('/', (req, res) => {
  res.send('Hello World!')
});

// starts up the server on a specified port ('3000')
// prints a log comment to the console
app.listen(port, () => {
  console.log('Example app listening on port ${port}!')
});

Databases with Express

How do CRUD operations correlate to HTTP methods in Express?

The CRUD operations roughly correlate to the HTTP methods that you can employ in an express app. This definition can be somewhat flexible, but in general create correlates to POST (or app.post() in an express app), read correlates to GET (app.get()), update to PUT (app.put()) and delete to DELETE (app.delete()).

What are two common ways for interacting with a database and the benefits of each?

• Using the databases' native query language (e.g. SQL), which results in the best performance
• Using an Object Data Model ("ODM") or an Object Relational Model ("ORM"). An ODM/ORM represents the website's data as JavaScript "objects" or "models", which are mapped to the underlying database by the ORM. Some ORMs are tied to a specific database, while others provide a database-agnostic backend. The benefit here is that programmers can continue to think in terms of JavaScript objects rather than database semantics.

When designing your models it makes sense to have separate models for every "object". What are "objects"? If you were thinking of making an app to represent the functionings of a library, what would be some example objects you might have?

Objects are a group of related information. Some obvious candidates for a library project's models are books, book instances, and authors.

You might also want to use models to represent selection-list options (e.g. like a drop-down list of choices), rather than hard-coding the choices into the website itself — this is recommended when all the options aren't known up front or may change.

Once we've decided on our models and fields, we need to think about the relationships between them. How is this planned?

With a UML association diagram.

Let's move onto setting up a working development environment with Express.