Skip to content

docs: fix broken Next.js integration link and add inline setup guide#331

Open
tranhoangtu-it wants to merge 1 commit intowelldone-software:masterfrom
tranhoangtu-it:fix/update-nextjs-integration-link
Open

docs: fix broken Next.js integration link and add inline setup guide#331
tranhoangtu-it wants to merge 1 commit intowelldone-software:masterfrom
tranhoangtu-it:fix/update-nextjs-integration-link

Conversation

@tranhoangtu-it
Copy link
Copy Markdown

Problem

The Next.js integration link in the README points to https://github.com/zeit/next.js/tree/canary/examples/with-why-did-you-render which is broken for two reasons:

  1. The GitHub organization moved from zeit to vercel
  2. The with-why-did-you-render example was removed from the Next.js repository

This was reported in #295.

Solution

  • Remove the broken external link
  • Add an inline Next.js setup code snippet (Pages Router pattern — the most common usage)
  • Link to the existing community discussion (Integration with Next.js 13 app folder? #266) for App Router and advanced setups

Changes

  • README.md: replaced dead link with inline wdyr.js setup example and a link to the integration discussion

Fixes #295

The previous link to zeit/next.js example was broken as:
1. The GitHub org moved from zeit to vercel
2. The with-why-did-you-render example was removed from the repo

Replaces the dead link with inline Next.js Pages Router setup instructions.

Fixes welldone-software#295
Copilot AI review requested due to automatic review settings March 28, 2026 10:14
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Updates the documentation to remove a dead Next.js example link and replace it with an inline setup snippet plus a pointer to the existing Next.js integration discussion, addressing the broken-link report in #295.

Changes:

  • Removed the broken external Next.js example link (old zeit/next.js URL / removed example).
  • Added an inline wdyr.js setup snippet for Next.js.
  • Linked to the Next.js integration discussion (#266) for broader/App Router guidance.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.


## Integration With Other Libraries
* [Next.js example](https://github.com/zeit/next.js/tree/canary/examples/with-why-did-you-render)
* **Next.js**: Create a `wdyr.js` file and import it as the **first import** in `pages/_app.js` (Pages Router) or `app/layout.js` (App Router). See the [Next.js integration discussion](https://github.com/welldone-software/why-did-you-render/issues/266) for setup details.
Copy link

Copilot AI Mar 28, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The README suggests importing wdyr.js as the first import in app/layout.js for the App Router. In Next.js App Router, app/layout.js is a Server Component by default, and importing/initializing why-did-you-render there can cause build/runtime issues (and won’t reliably apply to client components). Consider removing the app/layout.js instruction or changing it to a client-only entry point (e.g., a 'use client' provider/component imported by the layout) and keep the README pointing to the #266 discussion for App Router specifics.

Suggested change
* **Next.js**: Create a `wdyr.js` file and import it as the **first import** in `pages/_app.js` (Pages Router) or `app/layout.js` (App Router). See the [Next.js integration discussion](https://github.com/welldone-software/why-did-you-render/issues/266) for setup details.
* **Next.js**: Create a `wdyr.js` file. For the **Pages Router**, import it as the **first import** in `pages/_app.js`. For the **App Router**, initialize it from a client-only entry point (for example, a `'use client'` provider/component) and follow the recommendations in the [Next.js integration discussion](https://github.com/welldone-software/why-did-you-render/issues/266).

Copilot uses AI. Check for mistakes.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Next.js example is missing

2 participants