How to Update Next.js on Your Website Safely

To update Next.js safely, check which version you're on, upgrade within your current major version first (for example pnpm update next react react-dom), then run a production build, click through the result locally and redeploy. A patch or minor update usually takes ten minutes. Moving to a new major version takes longer, so do it separately, with the official upgrade codemod and the version guide open. This guide walks through each step and explains how to tell which security fixes actually matter for your site.

Why this matters this week#

On 8 October 2026 the Next.js team announced an out-of-band security update for Wednesday 14 October 2026. It covers three vulnerabilities in upstream dependencies, two rated Critical and one High, and the full advisories (impact, affected versions and upgrade instructions) are published with the update. The team's advice is to upgrade to a patched version as soon as it's available.

It isn't a one-off. The Next.js security advisories page lists two Critical remote code execution advisories published on 25 August 2026, another on 22 September and several more on 30 September. If a Next.js site is part of your business, a regular update routine is worth more than any single patch.

Step 1: Find out which version you're running#

Open a terminal in your project folder and run:

pnpm list next react react-dom

This shows the versions actually installed, which can be newer than the minimum written in package.json. To see what's available, run pnpm outdated, which compares your installed packages with the newest releases (pnpm docs). If you use npm instead, npm ls next and npm outdated do the same.

Then compare your major version with the Next.js support policy. At the time of writing:

A major version stays in Maintenance LTS for two years after its first release. Next.js 15 was released on 21 October 2024, so by that policy its support ends around 21 October 2026, a week from today. If you're on 15 or older, plan the move to 16 now (see Step 4).

The newest stable release on npm at the time of writing is 16.4.0, released on 6 October 2026. The 15.x line's latest backport is 15.5.27. Both numbers will move once today's security update ships, so check npm or the releases page rather than copying a version from an article.

Step 2: Read the advisory before you panic#

Each advisory names the affected versions, the patched versions and the feature that's vulnerable. That last part tells you how urgent the update is for your site.

Many recent advisories concern features that run on a server at request time, such as the Image Optimization API, caching of server-rendered pages or the next/og image generator. If your site is a static export (output: "export" in next.config.ts), the static export guide lists what it can't use: Image Optimization with the default loader, Proxy, Server Actions, Incremental Static Regeneration, Draft Mode and other features that need a Node.js server. Your host serves plain HTML, CSS and JavaScript files.

All the Freeframe Next.js templates are static exports with unoptimised images, for exactly this reason (the deploying docs explain the setup). That often means a server-side advisory doesn't reach the live site. Don't assume it, though: read the "affected" section of each advisory, because Next.js still runs on your computer and on your host's build servers. If in doubt, update. A patch release is cheap.

If your site runs Next.js on a server (on Vercel, Netlify or your own Node.js host, with API routes, middleware or server rendering), treat Critical and High advisories as same-day work.

Step 3: Apply a patch or minor update#

Start on a clean copy so you can undo easily: commit your work in Git first, or make a copy of the project folder.

Next, update Next.js and React together:

pnpm update next react react-dom eslint-config-next

pnpm update stays inside the version ranges in your package.json (pnpm docs). With "next": "^16.3.8" it installs the newest 16.x release and never jumps to 17. That's what you want for security fixes. To pin to a major line explicitly, use pnpm update next@16.

The alternative is the official upgrade codemod, which updates Next.js, React and React DOM and runs any code changes the new version needs (codemod docs):

npx @next/codemod upgrade patch   # e.g. 16.0.7 -> 16.0.8
npx @next/codemod upgrade minor   # the default

If you're on an older major version that's still supported and only want the security fix, upgrade within it: pnpm update next@15 for the 15.x line, for example. Fixes for Maintenance LTS versions can arrive as minor releases, according to the support policy.

Step 4: Move to a new major version (separately)#

Major versions remove or change APIs, so give them their own branch and an hour or two. Open the matching guide from the upgrade guides index (for 15 to 16, the version 16 guide), then run:

npx @next/codemod upgrade major

It asks which codemods to apply and whether to upgrade React. Read the changes it makes with git diff before you build. Lines marked @next-codemod-error need you to finish the change by hand.

Next.js 16.4 also added npx next@canary upgrade --agent=latest, which prepares the migration guides, codemods and checks for a coding agent to work through (Next.js 16.4 release post). It's useful on a large app. On a small site the codemod and the guide are usually enough, and you stay in control of each change.

Step 5: Build, check and redeploy#

An update isn't finished until the built site has been checked. In the project folder:

pnpm lint
pnpm typecheck
pnpm build
pnpm start

In a Freeframe Next.js template, pnpm build writes the site to out/ and pnpm start serves that folder locally. Then check:

• Every page loads. Click through the menu, the footer links and the 404 page.
• Interactive parts work. Mobile menu, sliders, filters, the contact or quote form (send a real test message).
• Nothing looks different. Compare a few pages with the live site side by side. Fonts and spacing are the usual suspects after a big update.
• The build log is clean. Read any new warnings; they often flag something the next major version will remove.

Commit the updated package.json and pnpm-lock.yaml. The lockfile is what makes your host install the exact versions you tested. Then deploy as usual: push to the connected repository on Netlify, Vercel or Cloudflare Pages, or upload the new out/ folder. Once it's live, open the site in a private window to make sure you aren't seeing a cached copy.

Step 6: Make updates routine#

A few habits keep this to a quick monthly job rather than an emergency:

• Turn on Dependabot security updates if your code is on GitHub. In the repository, open Settings, then Advanced Security, and click Enable next to Dependabot security updates (GitHub docs). GitHub then opens a pull request when a dependency has a known vulnerability, and your host can build a preview of it.
• Watch the Next.js blog. Security releases are announced at nextjs.org/blog, sometimes a few days ahead, as this week's was.
• Let Next.js remind you. From 16.4, the experimental agentUpgrade option in next.config.ts can flag upgrades that fix known vulnerabilities in your installed version when you run next dev or next build; its default policy, 'security', does exactly that.
• Keep the site small. The fewer packages a site depends on, the fewer advisories apply to it. A brochure site rarely needs more than Next.js, React and Tailwind CSS.

Updating a site made from a template#

Updating Next.js is separate from updating the template itself. A template is a starting point, not a dependency: once you've customised it, pnpm update changes the framework underneath and leaves your pages alone. When a new template version adds something you want, follow Versions and updates to compare and copy over just those files.

If you're choosing a stack for a new site and would rather not think about framework updates at all, a plain HTML template has nothing to patch. Our comparison of Next.js, Astro and plain HTML covers the trade-offs, and every Next.js template ships as a static export that any host can serve.