Next.js Integration
Add your AEO blog to a Next.js application with built-in rewrites.
Next.js has built-in rewrite support, making this the easiest integration of all. You add a single rewrite rule in your config file and Next.js handles everything: proxying, header forwarding, and path matching. No external server configuration needed.
Requirements
This method requires a running Next.js server (not a static export):
- Next.js 9.5+ (rewrites were introduced in 9.5).
- Works with both Pages Router and App Router.
- Must be running as a Node.js server (not static export via "next export" or output: "export").
- If you use static export, use the Nginx, Apache, or cloud hosting method instead.
Open your Next.js config file
Find next.config.js (or next.config.ts / next.config.mjs) in the root of your project.
Add the rewrites configuration
Add an async rewrites() function to your Next.js config:
/** @type {import("next").NextConfig} */ const nextConfig = { async rewrites() { return [ { source: "/blog", destination: "https://aeo.how/blog", }, { source: "/blog/:path*", destination: "https://aeo.how/blog/:path*", }, ]; }, };
module.exports = nextConfig;The first rule handles the blog homepage (/blog). The second rule handles all sub-paths (/blog/article-slug, /blog/sitemap.xml, etc.).
If you already have other rewrites, just add these two entries to the existing array.
Restart your dev server
Stop and restart your Next.js dev server for the config changes to take effect. Then visit localhost:3000/blog to test.
Deploy
Deploy your updated config to production. The rewrites work the same way in production as in development. Next.js automatically forwards the Host header.
Next.js rewrites proxy at the server level; the browser URL stays as yourdomain.com/blog (no redirect).
If you're using static export (output: "export"), rewrites don't work. Use Vercel rewrites or Nginx instead.
On Vercel, Next.js rewrites work out of the box with no extra configuration.