From a79f27f1139c4b6bf753e93d571fa3722af002f6 Mon Sep 17 00:00:00 2001
From: Alejandra Rodriguez <30965660+malejaroti@users.noreply.github.com>
Date: Thu, 23 Apr 2026 13:57:34 +0200
Subject: [PATCH] Clarify JSON response handling in README
Updated README to explain the use of Response.json for cleaner JSON responses and when to use new Response for custom control.
---
.../02_twitter_clone/01_milestone/README.md | 39 ++++++++++++++++++-
1 file changed, 38 insertions(+), 1 deletion(-)
diff --git a/projects/02_twitter_clone/01_milestone/README.md b/projects/02_twitter_clone/01_milestone/README.md
index ec4c931..6cba4d3 100644
--- a/projects/02_twitter_clone/01_milestone/README.md
+++ b/projects/02_twitter_clone/01_milestone/README.md
@@ -81,9 +81,46 @@ export async function GET() {
{ id: 1, user: "JohnDoe", content: "Hello Next.js!", timestamp: "2m ago" },
{ id: 2, user: "JaneDoe", content: "Loving React & Next.js!", timestamp: "10m ago" }
];
- return new Response(JSON.stringify(tweets), { status: 200 });
+ return Response.json(tweets);
}
```
+ ```return Response.json(tweets);``` is used instead of ```return new Response(JSON.stringify(tweets), { status: 200 }); ``` because ```Response.json(data)``` is the cleaner built-in way to return JSON from a route handler. It automatically returns:
+- a JSON body
+- status 200
+- Content-Type: application/json
+
+Which would be roughly equivalent to
+``` return new Response(JSON.stringify(tweets), { status: 200, headers: { "Content-Type": "application/json" } })```
+which is longer and harder to read.
+
+As for when to use ```Response``` or ```new Response(...)```, the later is the better choice when you need lower-level control over the response.
+
+Common cases:
+
+- Custom headers
+Example: cache headers, cookies, CORS headers, content disposition.
+- Non-JSON content
+Such as plain text, HTML, XML, CSV, a file, or a stream.
+- Custom status handling with a custom body format
+For example, returning an empty body with 204, or a text error message.
+- Streaming responses
+Useful for SSE, AI/chat streaming, or large generated content.
+- Binary data
+Such as images, PDFs, ZIP files, or blobs.
+
+Examples:
+- JSON with full manual control:
+```return new Response(JSON.stringify(tweets), { status: 200, headers: { "Content-Type": "application/json", "Cache-Control": "no-store" } })```
+- Plain text:
+```return new Response("OK", { status: 200, headers: { "Content-Type": "text/plain" } })```
+- No content:
+```return new Response(null, { status: 204 })```
+- File download:
+```return new Response(fileBuffer, { headers: { "Content-Type": "application/pdf", "Content-Disposition": "attachment; filename=\"report.pdf\"" } })```
+
+Rule of thumb:
+- Use ```Response.json(...)``` when returning normal JSON data.
+- Use ```new Response(...)``` when you need custom response behavior.
---