nextjs - 💡(How to fix) Fix Docs: Fix broken code examples in Getting Started guides [1 comments, 2 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
vercel/next.js#93272Fetched 2026-04-28 06:23:30
View on GitHub
Comments
1
Participants
2
Timeline
4
Reactions
0
Timeline (top)
closed ×1commented ×1labeled ×1locked ×1
RAW_BUFFERClick to expand / collapse

What is the update you wish to see?

Three code example bugs in the Getting Started section:

  1. project-structure: Extra comma in App Icons table — apple-icon row has `.jpg` `.jpeg`, `.png` (comma after .jpeg) while all other rows use space-separated extensions consistently.

  2. layouts-and-pages (app/ui/post.tsx): The Post component accepts a post prop but ignores it — it calls getPosts() internally and renders the full list. Semantically, a UI component named Post (singular) should not have an unused prop. The post parameter is never referenced in the component body; only posts from the internal fetch is used. The fix is to remove the unused prop and rename the component to Posts to match its actual behavior.

  3. linking-and-navigating (app/layout.js): The JSX version of the Layout component is function Layout() with no parameters, but uses {children} in the body — this would throw ReferenceError: children is not defined at runtime. The TSX version correctly has { children }: { children: React.ReactNode }.

Is there any context that might help us understand?

All three are in docs/01-app/01-getting-started/. Per the contribution guide, code blocks should contain a minimum working example that can be copied and pasted.

Does the docs page already exist? Please link to it.

extent analysis

TL;DR

Fix the three code examples in the Getting Started section by removing the extra comma, fixing the unused prop, and adding the missing children parameter.

Guidance

  • Remove the extra comma in the apple-icon row of the App Icons table to maintain consistency.
  • Rename the Post component to Posts and remove the unused post prop to match its actual behavior.
  • Add the children parameter to the JSX version of the Layout component to fix the ReferenceError.

Example

// Corrected Layout component
function Layout({ children }: { children: React.ReactNode }) {
  // component body
}

Notes

These fixes assume that the code examples are intended to be minimal working examples that can be copied and pasted, as per the contribution guide.

Recommendation

Apply the suggested workarounds to fix the code examples, as they are specific and targeted fixes that address the identified issues.

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING