jikime-migration-to-nextjs

Automate migration of legacy frontend apps to Next.js 16 App Router.

5|1|Updated Jan 24, 2026
One-click install
npx skills add https://github.com/jikime/jikime-adk --skill jikime-migration-to-nextjs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: jikime-migration-to-nextjs
Source: https://github.com/jikime/jikime-adk/tree/main/templates/.claude/skills/jikime-migration-to-nextjs
Command: npx skills add https://github.com/jikime/jikime-adk --skill jikime-migration-to-nextjs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and templates (resource) components.

What problem does it solve?

This Skill automates the complex process of migrating legacy frontend projects (Vue, React CRA, Angular, Svelte) to the modern Next.js 16 App Router architecture, ensuring a smooth transition with minimal manual effort.

Core Features & Use Cases

  • Comprehensive Analysis: Detects source framework, dependencies, and architecture.
  • Automated Planning: Generates detailed migration plans and project-specific skills.
  • Code Transformation: Migrates components, routing, state management, and styling.
  • Use Case: Migrate a large Vue.js 2 application with Vuex and Vue Router to Next.js 16, adopting Zustand for state and Tailwind CSS for styling, while preserving all functionality and improving performance.

Quick Start

Use the jikime-migration-to-nextjs skill to migrate the project located at './my-vue-app' to Next.js 16.

Frequently Asked Questions about jikime-migration-to-nextjs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate a legacy Vue.js application to Next.js 16 App Router?

Migrating a legacy Vue.js application to Next.js 16 App Router is automated by orchestrating analysis, planning, component mapping, and code execution for a seamless transition. It detects your source framework and converts routing, state management, and styling automatically.

What is the best way to convert React CRA projects to Next.js 16?

The best way to convert React CRA projects to Next.js 16 is through automated code transformation that updates routing to the App Router and migrates state management. This Skill handles the entire process from dependency detection to component refactoring.

Does this migration tool support converting Redux to Zustand?

Yes, this migration tool supports converting Redux to Zustand during the Next.js 16 transition. It handles state management conversion automatically as part of the comprehensive code transformation process.

Can I migrate Angular and Svelte projects to Next.js using this approach?

You can migrate Angular and Svelte projects to Next.js using this approach. The Skill supports framework detection and component mapping for various legacy frontend applications, ensuring a smooth transition to the modern App Router architecture.

How does styling migration to Tailwind CSS work when moving to Next.js 16?

Styling migration to Tailwind CSS works by automatically transforming your existing styles during the Next.js 16 transition. The Skill orchestrates code execution to update styling alongside routing and state management conversions for a complete migration.

What are the limitations of automating legacy frontend modernization to Next.js?

Automating legacy frontend modernization to Next.js requires a clear source project structure for accurate framework detection and component mapping. Complex custom logic may need manual adjustment after the automated code transformation completes.