Skip to main content

πŸ“¦ Custom Middleware

app.use(express.json()); This one basically allows a client to send us JSON, basically.Without this, you would have to manually put together the bits yourself to make JSON work, and that would suck, so this does it for you.

import express from "express";
import router from "./router";
import morgan from "morgan";
const app = express();

app.use(morgan("dev"));
app.use(express.json());

app.get("/", (req, res) => {
morgan;
res.status(200).send({
success: true,
message: "Welcome to the Node.js and Express API",
});
});

app.use("/api", router);

export default app;

So urlencoded allows a client to add things like a query string and parameters and it decodes and encodes that properly.

import express from "express";
import router from "./router";
import morgan from "morgan";
const app = express();

app.use(morgan("dev"));
app.use(express.json());
app.use(
express.urlencoded({
extended: true,
})
);
app.use("/api", router);
export default app;

So I don't know if you've ever seen a query string before, but it's basically a string that comes after a URL that has a bunch of key-value pairs separated by commas or equal signs.

info

URL encoded will take all of this and put it in an object for you.

google.com?a=1,thing=otherthing (for encoding/decoding url)

Creating Custom Middleware​

So now that we have a basic understanding of middleware, let's create our own custom middleware.
So middleware is basically a function that takes in a request and response object, and then it can do something with it.

So let's create a middleware function that will log the request method and URL to the console.
So we can create a new file called logger.js in the src/middleware directory.
So let's create a new file called logger.js in the src/middleware directory.

import { NextFunction, Request, Response } from "express";
const logger = (req: Request, res: Response, next: NextFunction) => {
console.log(`${req.method} ${req.url}`);
next();
};
export default logger;

So this middleware function takes in a request and response object, and then it logs the request method and URL to the console.
So it also calls the next() function to pass control to the next middleware function in the stack.
So now we can use this middleware function in our app.js file.
So let's import the logger middleware and use it in our app.js file.

import express from "express";
import router from "./router";
import morgan from "morgan";
import logger from "./middleware/logger";
const app = express();
app.use(morgan("dev"));
app.use(express.json());
app.use(
express.urlencoded({
extended: true,
})
);
app.use(logger);
app.get("/", (req, res) => {
morgan;
res.status(200).send({
success: true,
message: "Welcome to the Node.js and Express API",
});
});
app.use("/api", router);
export default app;

So now when we make a request to the server, we should see the request method and URL logged to the console.
So let's test this out by making a request to the server.
So we can use a tool like Postman or Insomnia to make a request to the server.
So let's make a GET request to the / endpoint.
So we should see the following output in the console:

GET /

So this shows that the middleware function is working correctly.