How to Build a REST API with Next.js 13

⭐ Become a full-stack web dev with Zero To Mastery Courses:

👇 Follow Me On Social Media:

(00:00) Intro
(00:05) Welcome
(00:43) When to use API Routes for your app & when not to
(02:24) Create a new project & Next 13.3 changes
(05:15) Environment variables & API keys
(07:51) GET route handler
(12:43) DELETE route handler
(18:34) POST route handler
(21:55) PUT route handler
(26:03) Dynamic API route
(29:57) Next steps

📚 Tutorial References:

#nextjs #rest #api

[minimumtn]

This tutorial is absolutely amazing for people who have no idea how api routes work (me). The way you go in depth explaining things is by far the best I've seen, you make it so easy to understand. Fantastic content!

[tinymurky]

Dynamic Route can also been get like below

export async function GET ({ params }:{params:{id:string} }) {
const { id } = params
}

[andreaswu]

your teaching skills are immense Dave. you're one of the best in the business. always enjoying your series!

[socialultra]

Hi, I just wanted to say a big thank you.
I've been searching across the internet to find the answer you just gave.

It's only now I know you can create api routes in the backend (calling external apis) and then call the api routes in the frontend to grab that data. I would have never thought of that, if it wasn't for you.

Thank you very much.

[shaikhsanuar]

Waiting for more from you sir. Hope u will teach Nextjs 13 in depth. Thanks a lot 🎉

[akosbalint]

There is a much simpler way to get params from a dynamic route
export async function GET(
request: NextRequest,
{ params }: { params: ParamsType }
) {
const { id } = params;

[webcompares]

Thank you Dave for great content.
I have one question though. Isn't it better to use below code for getting "id" in "Dynamic Api route" section of your video:

export async function GET(request: Request, { params }: {
params: { id: string }
}) {
const id= params.id;
}

Regards

[onelastkiwi]

this is now my favorite teaching channel

[kynjal]

i am forever grateful sir, been searching for a teacher that teaches next js

[saswatpranat]

Sir is it possible to start side hustle using html and css

[zebrox]

Thanks, sir!
btw shouldn't we create PUT and DELETE functions inside the dynamic route rather than passing 'id' in the body? I think putting 'id' inside the body when using the DELETE operation instead of using a dynamic route is often discouraged but I am not sure.

[igbrowns]

Thanks so much sir🙇. We love❤️ to practice and see more of this

[amansinghbhadauria]

const todos : Todo[] = (await res).json();
This code gives the below error :
Type 'Promise<any>' is missing the following properties from type 'Todo[]': length, pop, push, concat, and 29 more.ts(2740)


Had to make these changes to get the todos
const response = await res; // Wait for the Promise to resolve
const todos: Todo[] = await response.json(); // Wait for JSON parsing to complete

[shazeemalichishty]

Thanks Dave, i finally get it to work.

[davidjohn]

I'm struggling to get my head around where to fetch data (content) from a CMS. I set it up with a Route Handler, and fetched it in a server component. Now after watching this I'm thinking I don't need the API. I use an environment variable(secret), but I understood that would still be secure without the API. Is that correct? You're a legend, Dave

[AmodeusR]

In the last section about the Dynamic API Route I missed the explanation to why we were doing that route. It would be nice if you could explain what or why we're doing what we are going to do next time :)

[azharmahmood]

Impressed with your teaching skills Dave, really impressive, please keep it up. I hope will learn a lot from you.

[mywaycoding]

Sir thank you 💕 you are really best for me

[justiceessiel]

Concerning when and when not to use the page routes . You said the page routes and the generateParams are built at the same and its not advisable to use it . but what if we want to acutallly protected some APi keys and that is why we are using the page routes at build time to fetch the data

[RhysLopez]

u make it easy to understand 😭thank youu