1. Home
  2. Training Library
  3. Programming
  4. Programming Courses
  5. Introduction to Express - Route Parameters

Introduction to Express - Route Parameters

Contents

keyboard_tab
Intro to Express - Route Parameters
Introduction to Express - Route Parameters
Overview
Difficulty
Intermediate
Duration
5m
Students
7
Ratings
5/5
starstarstarstarstar
Description

In this course, you will learn about Express Route Parameters. A route parameter is a named segment of a route. Route parameters are typically used to create a route to select a specific resource.

Learning Objectives

  • Explain the route parameter
  • Learn how to implement a route parameter
  • Understand the req.params object
  • Learn how to access the route parameter from the req.params object
  • Learn the structure of a route to accept multiple route parameters


Intended Audience

  • This course is intended for anyone who wants to learn about Express

Prerequisites

Transcript

Introduction to Express - Route Parameters. To begin, I want to discuss the setup for this video. As part of this  Express application, I have a JavaScript file with mark data of an array of 10 users. Each user is represented by an object that has an ID, full name, and email property. This data is imported as the user's variable and is currently residing inside of an API route and responding back with data as demonstrated in Insomnia on the right side of the screen. But this presents an interesting issue. What if I wanted a single user?

Is there a route structure to send back an individual user? There is, and that involves the route parameter. The route parameter, which is sometimes called by other frameworks the path parameter, is a name segment of the route. Route parameters are typically used to select a specific resource of data. So, what would be a single resource of data from this user's array? An individual user. So, I will convert this route over to extract a single user based on its ID. To create this route parameter, after the word API, I will add a forward slash then a colon. The colon is what denotes the name segment of a route. After the colon, I will type id. Essentially, ID is a variable that's part of this segment of the route.

Now for demonstration purposes, inside of the route, I will replace res.json with console.log(req.params). Now off the screen, I'm going to send a GET request to the route listed below through Insomnia. And the one point of emphasis here is that for the ID, the name segment of the route, I'm using the value of five. In the terminal, there is a console.log of an object with an ID that has a value of five. So, the specific resource that I'm selecting is the user with the ID of five. And this is a common use case for a route parameter.

So, this leads to another question. What is request.params? Request.params is an object that's part of the request object, which will capture the name-route parameter as a key-value pair. In this case, keeping the ID and the value being five. I'm going to convert this route over in order to return the user based on the ID given through the route parameter. First to give a little bit more clarity to this route. I'm going to rewrite it and what I'm going to do is add the word user in front of the forward slash before the ID parameter.

Now I have created a specific user route matching the use case for route parameters; implying that I'm looking for a user with a specific ID. Now I'm going to replace the console.log into code that will find the user from my users array based on the ID given. const user = users.find. Passing in the arrow function and using this structuring for ID. And I'm looking for the ID that matches the req.params.id. One thing to note is that route parameters are strings. So, I need to convert the string to an integer using the parseInt method.

On the following line, I will console.log(user). And off screen again I will send a request using Insomnia for the same ID as demonstrated earlier. And in the terminal is the user with the ID of five, along with their full name and email address. Off the screen, I will change 5 to 7 and click 'Send' again and there is that specific users data. Now I want to send back a proper JSON response. So, I'm going to change the console.log to res.json and go into Insomnia and directly send the request. Transitioning to Insomnia. I'm going to change the 7204 to get eight different users' data. I will click on 'Send' and there is the JSON response to the right of the screen. One thing to note, as demonstrated below, you can have multiple route parameters within a single route. Of course, this is dependent on the complexity of your use case. And that's it. Thanks for watching at Cloud Academy.

About the Author
Students
3555
Labs
23
Courses
55
Learning Paths
24

Farish has worked in the EdTech industry for over six years. He is passionate about teaching valuable coding skills to help individuals and enterprises succeed.

Previously, Farish worked at 2U Inc in two concurrent roles. Farish worked as an adjunct instructor for 2U’s full-stack boot camps at UCLA and UCR. Farish also worked as a curriculum engineer for multiple full-stack boot camp programs. As a curriculum engineer, Farish’s role was to create activities, projects, and lesson plans taught in the boot camps used by over 50 University partners. Along with these duties, Farish also created nearly 80 videos for the full-stack blended online program.

Before 2U, Farish worked at Codecademy for over four years, both as a content creator and part of the curriculum experience team.

Farish is an avid powerlifter, sushi lover, and occasional Funko collector.