Name: Create a Dynamic Next.js API route
Uploaded: 2022-03-18T17:18:56-05:00
Description: We're going to learn how to read dynamic segments from a URL using dynamic routes.

Create a Static REST Endpoint in Next.js

Create a Dynamic Next.js API route 

Create a Catch All Next.js API route 

Create an Optional Catch-All API Route in Next.js

Handle Different HTTP Verbs in a Next.js API Route

Add a Middleware to a Next.js API Route

Create an API Route Using the next-connect Package

Add Middleware to an API Route Created with next-connect

Hide Sensitive Information from the Consumers of Next.js API

Effectively Build RESTful APIs using Next.js API Routes

We're going to learn how to read dynamic segments from a URL using dynamic routes.

https://app.egghead.io/api/v1/lessons/next-js-create-a-dynamic-next-js-api-route/subtitles

Instructor: [0:01] Let's create a folder called dynamic.

[0:04] Now, let's create a file called openAngleBracketSlugWeCloseTheAngleBracket.js. Let's create a function called handler() that receives a request and a response. What we're going to do is, we are going to extract this log from the request.query. Let's return it as JSON. The last thing that we have to do is to export handler as a default export.

[0:42] Now, we're going to call the API/API/dynamic and let's add 1 here. As we can see, we are returning the 1 in the URL in the JSON response. Let's change 1 with 2 and we'll see that we are returning 2 as a slug. It's worth noting that if we try to visit dynamic/1/2, we get a 404 back, because that route doesn't exist.

[1:11] To recap, in order to create dynamic API routes, we have to create files that start with an angle bracket, then we can add the dynamic segment we want, and then we close the angle bracket. After that, we can get the dynamic segment from the request.query.

Create a Dynamic Next.js API route

Share this video with your friends

Course

Effectively Build RESTful APIs using Next.js API Routes