LLM-Assisted Incremental Migration from React to Next.js
Listed in
This article is not in any list yet, why not save it to one of your lists.Abstract
React’s adoption drives development of dynamic, client-rendered web applications, but many organizations now focus on the performance and SEO advantages of server-side rendering with frameworks like Next.js. For older React projects—especially those written in JavaScript, migrating to Next.js and TypeScript tends to be tedious and riddled with errors. This study investigates the possibility of using large language models (LLMs), such as Llama 3 through Ollama running on local machines, to automate crucial migration steps: transitioning from JavaScript to TypeScript and iteratively evolving React applications into Next.js applications. More than one hundred real-world test cases were developed to test TypeScript code generated by the large language model, which passed after minor adjustments. This work also investigates the extent of LLM assistance in transforming React applications into Next.js applications, particularly on routing, data fetching, and overall project design. The primary outcomes are increased developer productivity and precision in migration, demonstrating significant accuracy improvements while still addressing notable shortcomings and needs for further development. The results align with recent literature on automated code migration with LLMs and refactoring, underscoring the potential of AI-assisted web development.