vercel / vercel/next-learn

Server Warning: Each child in a list should have a unique "key" prop, when using route group folders with the parenthesis

Open
#828 3 comments 4 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
4.8k
Forks
2.2k
PR merge metrics
No merged PRs in 30d

Description

I noticed every time I would create a route group folder to then put the loading.tsx and page.tsx file in, I would get a warning in the browser console that states : "Server Warning: Each child in a list should have a unique "key" prop".

When I didn't use a route group folder, I wouldn't get the warning.

I was just wondering if this is anything to be concerned about for building apps with next.js? Is this something you can ignore or is it something to work on correcting because it could lead to problems when scaling out? What is the preferred solution?

For my current project repo, I decided not to use the route group folders so I would not encounter the issue. And everything still loads fine with all of the fallback skeletons.

Did anyone else notice this warning while building the app?

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the browser warning with a route group folder containing loading.tsx and page.tsx, then compare it with the equivalent non-grouped routes. Confirm whether the warning is caused by the route group setup and define done as removing the warning without breaking the fallback skeleton behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
next.js, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.