Skip to content
Balaguru Ravi

WorkDeveloper ToolsBuilding

Next.js App Router Migration Framework

Script-based tooling that migrates Pages Router apps onto App Router conventions.

November 2024 – Present

A proof-of-concept automation framework for Next.js 13+ that rewrites legacy page-level data fetching and repairs alias, dynamic import, and component boundaries that stall an App Router conversion.

Problem
Pages Router applications do not become App Router applications by renaming folders. getServerSideProps and getStaticProps encode caching and request assumptions the App Router will not infer, and path aliases plus dynamic imports break when those files move.
Solution
Built a script-based framework that converts those data-fetching functions into App Router patterns, then handles alias paths, dynamic imports, and component refactoring so remaining work is review rather than transcription.

Architecture notes

  1. Data fetching is transformed first. That is the actual change in the routing model; JSX movement is secondary.
  2. Alias resolution and dynamic imports are handled with the rewrite so generated modules do not point at Pages Router assumptions.
  3. The tool shortens the manual cycle. It does not replace a review of caching, auth, and request-scoped data.

Stack

  • TypeScript
  • Next.js App Router
  • AST codemods
  • Webpack

Related

  • Test Auditor

    NPM CLI that orchestrates Jest test-quality audits, structured reports, and project-scoped report upload.

  • Performance Apparel CMS

    Amplience content modeling, page workflows, and Next.js extensions for a high-traffic storefront.