Route handlers (route.ts) in NextJS - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the purpose of a route.ts file in Next.js?

A route.ts file defines server-side route handlers that respond to HTTP requests like GET, POST, etc., for a specific API route in Next.js.

beginner

How do you export a GET handler in route.ts?

You export an async function named GET that takes a Request object and returns a Response object.

intermediate

Why should route handlers in Next.js be asynchronous?

Because they often perform tasks like fetching data or writing to a database, which are asynchronous operations. Using async lets the server wait for these tasks without blocking.

beginner

What is the difference between a route handler and a React component in Next.js?

A route handler in route.ts runs on the server to handle HTTP requests, while a React component runs on the client or server to render UI.

beginner

How can you send JSON data from a route handler?

Return a Response with JSON.stringify data and set the Content-Type header to application/json.

Which function name is used to handle POST requests in route.ts?

A POST

B getPost

C handlePost

D postHandler

In Next.js route handlers, you export an async function named exactly POST to handle POST requests.

What should a route handler return in Next.js?

A A React component

B A Response object

C A JSON object directly

D An HTML string

Route handlers must return a Response object that represents the HTTP response.

Where do route handler files like route.ts live in a Next.js project?

A In the <code>components</code> folder

B In the <code>pages/api</code> folder

C Anywhere in the project

D In the <code>app</code> directory under the route folder

In Next.js App Router, route handlers live inside the app directory within the folder for the route.

How do you access the request body in a POST route handler?

A Using <code>await request.json()</code>

B Using <code>request.body</code> directly

C Using <code>request.params</code>

D Using <code>request.query</code>

You use await request.json() to parse the JSON body from the incoming request.

Which HTTP methods can you handle in route.ts files?

A Only GET

B Only GET and POST

C GET, POST, PUT, DELETE, PATCH, OPTIONS, HEAD

D Only POST and PUT

You can export async functions named after any HTTP method to handle them in route handlers.

Explain how to create a simple GET route handler in Next.js using route.ts.

Think about how to respond to a GET request with JSON.

Describe the difference between client-side React components and server-side route handlers in Next.js.

Consider what each part does and where it runs.