Does it support converting directives?

Yes, it provides specific code patterns for transforming legacy AngularJS directives into modern Angular components with Inputs and Outputs.

How does it handle services between frameworks?

The skill includes strategies for both 'downgrading' new Angular services for use in legacy code and 'upgrading' AngularJS services for use in new components.

Is it compatible with the latest Angular versions?

Yes, the migration patterns are designed to align with modern Angular best practices, including Standalone Components and current CLI standards.

Can I migrate my app incrementally?

Yes, this skill specializes in the hybrid approach using ngUpgrade, allowing you to run AngularJS and Angular side-by-side while migrating feature by feature.

Angular Framework Migration

Name: Angular Framework Migration
Author: HermeticOrmus

byHermeticOrmus

0•

Developer Tools

Facilitates the transition from legacy AngularJS 1.x to modern Angular through hybrid mode patterns, component rewriting, and dependency injection updates.

This skill provides a comprehensive roadmap for developers modernizing legacy web applications by migrating from AngularJS (1.x) to modern Angular (2+). It supports various strategies including 'Big Bang' rewrites and incremental hybrid migrations using ngUpgrade, allowing both frameworks to run side-by-side during the transition. With detailed patterns for converting controllers to components, migrating services, and updating routing or forms, it helps reduce the complexity and risk associated with major framework version jumps.

Key Features

010 GitHub stars

02Hybrid application setup using UpgradeModule for side-by-side execution

03Patterns for downgrading and upgrading services across the Dependency Injection barrier

04Forms modernization patterns for Template-driven and Reactive Form architectures

05Step-by-step conversion of AngularJS controllers and directives to modern Angular components

06Routing system transition guides from $routeProvider to Angular Router

Use Cases

01Implementing a hybrid architecture to deliver new features in Angular while maintaining legacy code

02Upgrading legacy enterprise AngularJS 1.x applications to current Angular versions

03Modernizing outdated JavaScript factory patterns to TypeScript-based Dependency Injection

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add hermeticormus/floraheritage angular-migration

For use in Claude.ai and ChatGPT

Download Skill