migrate-page

Migrate Angular pages to a one-ui monorepo with DDD principles.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/Michael0520/milo-claudekit --skill migrate-page
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: migrate-page
Source: https://github.com/Michael0520/milo-claudekit/tree/main/plugins/one-ui-migration/skills/migrate-page
Command: npx skills add https://github.com/Michael0520/milo-claudekit --skill migrate-page

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill automates the complex process of migrating Angular pages from older versions (like Angular 16) to newer versions (like Angular 20) while adhering to Domain-Driven Design (DDD) principles and a specific one-ui monorepo structure.

Core Features & Use Cases

  • Automated Migration Analysis: Generates a detailed analysis document of the source page, covering file structure, components, form validation, API calls, and translation keys.
  • DDD Structure Generation: Creates the necessary library structures within a one-ui monorepo using Nx plugins.
  • Layer-by-Layer Migration Guidance: Provides step-by-step instructions for migrating the domain, UI, features, and shell layers.
  • Syntax Modernization: Guides the application of modern Angular syntax and specific library patterns (e.g., OneValidators, CommonTableComponent).
  • Use Case: A development team needs to upgrade a large Angular application to Angular 20. This Skill can be used to systematically migrate individual pages, ensuring consistency and adherence to the new architecture.

Quick Start

Use the migrate-page skill to migrate a page from /Users/jayden/f2e-networking-jayden/apps/mxsecurity-web/src/app/pages/account to libs/mxsecurity/account-page.

Frequently Asked Questions about migrate-page

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

FAQPage Schema
How do I migrate Angular pages to a DDD monorepo structure?

To migrate Angular pages to a DDD monorepo structure, this skill analyzes source code, generates Domain-Driven Design compliant libraries using Nx plugins, and guides layer-by-layer modernization for the domain, UI, features, and shell layers.

Can I upgrade Angular 16 to Angular 20 using automated modernization?

Yes, you can upgrade Angular 16 to Angular 20 using this automated modernization tool. It facilitates the transition by analyzing legacy source code and guiding specific syntax transformations required for newer Angular versions.

What is the best way to convert legacy Angular components to a one-ui monorepo?

The best way to convert legacy Angular components to a one-ui monorepo is by generating a detailed analysis document of the source page first, then creating the necessary DDD library structures and applying specific library patterns like CommonTableComponent.

Does migrating Angular applications to Domain-Driven Design require manual file structure analysis?

Migrating Angular applications to Domain-Driven Design does not require fully manual file structure analysis because this skill automates the generation of detailed analysis documents covering components, form validation, API calls, and translation keys.

How to handle syntax modernization when upgrading Angular pages to a new architecture?

To handle syntax modernization when upgrading Angular pages, this skill provides step-by-step instructions for applying modern Angular syntax and specific library patterns such as OneValidators during the layer-by-layer migration process.

Why use Domain-Driven Design principles for Angular monorepo migration?

You use Domain-Driven Design principles for Angular monorepo migration to ensure architectural consistency. This approach systematically separates domain, UI, features, and shell layers, making large-scale code modernization manageable and maintainable.