Upgrade to Next.js 15

[wei]

https://nextjs.org/docs/app/building-your-application/upgrading/version-15

[shubhamkhan]

Hi @wei, /assign me this, I am interested to upgrade.

[KemingHe]

Hi, I'll be happy to deliver this in the next few days. Getting a branch going on my fork right now... Edit: separated comments for clarity

[KemingHe]

@wei I understood as you'd like to upgrade to 15 first and then do the page router > app router migration?

Doing it in this order might cause unexpected issues, from the docs I've read so far; but I can first try and let you know.

[wei]

@KemingHe We can migrate in one go, no need to separate.

[KemingHe]

@KemingHe We can migrate in one go, no need to separate.

It's actually 3 separate migrations:

• Next 14 to 15
• React 18 to 19
• Page router to app router

and only the last one is confirmed stable. Should I keep the page router when doing the first two steps (they are bundled together by NextJS)? What's your recommendation?

[wei]

only the last one is confirmed stable

Can you explain what you mean? I believe Next 15 and React 19 are both stable now. I'll let you decide the best workflow~

[KemingHe]

I see, okay. I will try a couple different ways and let you know then.

---

This is what I was referring to:

Ref https://nextjs.org/docs/app/building-your-application/upgrading/version-15

Good to know:

If you see a peer dependencies warning, you may need to update react and react-dom to the suggested versions, or you use the --force or --legacy-peer-deps flag to ignore the warning. This won't be necessary once both Next.js 15 and React 19 are stable.

and we are instructed to use react@rc react-dom@rc (release candidate) instead of react@latest, meaning it's unstable.

[wei]

Sounds good, React 19 just turned stable so they probably need to update their docs.

I just noticed https://nextjs.org/docs/messages/no-stylesheets-in-head-component please also fix as part of the upgrade if you don't mind or I can do a separate PR as well.

[KemingHe]

I just noticed https://nextjs.org/docs/messages/no-stylesheets-in-head-component please also fix as part of the upgrade if you don't mind or I can do a separate PR as well.

No worries, this is already part of the page router > app router upgrade like you mentioned.

On it right now.

[KemingHe]

Hi @wei , I've been making great progress on the page > app router migration so far. All static elements (metadata, 404, landing page, header, footer...) plus unit tests are done.

Would you like me to add API endpoint testing while I'm at it? (This will roughly double the delivery time but a must-have to ensure api consistency.)

Any recommendations you'd like me to be aware of?

[KemingHe]

Additional context: NextJS 14+ app router calls for complete API refactor, so that's why even if the api behaviors are fine (Playwright), I want a future-proof way of making sure they are internally consistent.

[wei]

That's fantastic!

Let's add api testing in a separate pr after this one.

Can you create an issue with your proposal of how you plan to implement api testing? I've used nock before but open to other options.

[KemingHe]

Hello @wei , I think it'd be really helpful to the page > app router migration if we could talk through the architecture of Socialify over Zoom. What's your top 3 most available time slots in the next few days? I'm very flexible.

Hear from you soon!

[KemingHe]

Awesome news: API migration confirmed working, AND the simplest way to add testing is to use Playwright to expect match snapshot, since the endpoints mostly return images.

Very close to full site migration to app router. Still would appreciate a Zoom meeting to speed things up.

[wei]

Excellent, let's coordinate over dm

[KemingHe]

Talk to you soon in LinkedIn. 🌻

[wei]

Resolved in #450 🚀