Compétences angular-migration
📦

angular-migration

Sûr

AngularJS 에서 Angular 로 마이그레이션

Également disponible depuis: wshobson

이 스킬은 레거시 AngularJS 애플리케이션을 현대적인 Angular 로 마이그레이션하기 위한 포괄적인 가이드를 제공합니다. 하이브리드 설정, 컴포넌트 변환, 서비스 마이그레이션 및 라우팅 패턴을 다룹니다.

Prend en charge: Claude Codex Code(CC)
🥉 75 Bronze
1

Télécharger le ZIP du skill

2

Importer dans Claude

Allez dans Paramètres → Capacités → Skills → Importer un skill

3

Activez et commencez à utiliser

Tester

Utilisation de "angular-migration". 하이브리드 AngularJS/Angular 애플리케이션을 어떻게 설정합니까?

Résultat attendu:

하이브리드 애플리케이션을 설정하려면 다음이 필요합니다:

1. @angular/upgrade 패키지 설치
2. Angular 를 먼저 부트스트랩한 다음 UpgradeModule 을 사용하여 AngularJS 부트스트랩
3. BrowserModule 과 UpgradeModule 모두를 사용하여 AppModule 구성

예시 main.ts:
```typescript
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { UpgradeModule } from '@angular/upgrade/static';
import { AppModule } from './app/app.module';

platformBrowserDynamic()
.bootstrapModule(AppModule)
.then(platformRef => {
const upgrade = platformRef.injector.get(UpgradeModule);
upgrade.bootstrap(document.body, ['myAngularJSApp'], { strictDi: true });
});
```

Utilisation de "angular-migration". 대규모 AngularJS 앱을 마이그레이션하는 최선의 접근 방식은 무엇입니까?

Résultat attendu:

대규모 애플리케이션의 경우 점진적 (하이브리드) 접근 방식이 권장됩니다:

1. **설정 단계**: Angular CLI 설치, ngUpgrade 로 하이브리드 앱 설정
2. **인프라 단계**: 서비스, 유틸리티 및 공유 컴포넌트 마이그레이션
3. **기능 마이그레이션**: 기능을 하나씩 철저히 테스트하며 마이그레이션
4. **정리 단계**: AngularJS 코드와 ngUpgrade 제거

이렇게 하면 애플리케이션을 점진적으로 마이그레이션하면서도 지속적인 제공이 가능합니다.

Audit de sécurité

Sûr
v1 • 2/24/2026

This skill is a documentation file containing code examples and migration guides for AngularJS to Angular migration. Static findings flagged backticks (code fences), example API calls in code blocks, and references to assessment/setup tasks - all false positives. No actual security concerns detected.

1
Fichiers analysés
431
Lignes analysées
0
résultats
1
Total des audits
Aucun problème de sécurité trouvé
Audité par: claude

Score de qualité

38
Architecture
100
Maintenabilité
87
Contenu
50
Communauté
100
Sécurité
100
Conformité aux spécifications

Ce que vous pouvez construire

AngularJS 에서 Angular 로 마이그레이션 계획

레거시 AngularJS 애플리케이션을 현대적인 Angular 로 업그레이드하려는 개발 팀이 이 스킬을 사용하여 마이그레이션 전략을 이해하고 하이브리드 애플리케이션을 설정합니다.

AngularJS 컴포넌트 변환

점진적 마이그레이션을 작업 중인 개발자가 적절한 TypeScript 타입 지정과 함께 AngularJS 컨트롤러와 디렉티브를 Angular 컴포넌트로 변환하는 방법에 대한 가이드가 필요합니다.

Angular 마이그레이션 패턴 학습

Angular 를 처음 접하는 개발자가 AngularJS 와 Angular 간에 의존성 주입이 어떻게 다르게 작동하는지, 그리고 두 프레임워크를 어떻게 연동하는지 이해하려고 합니다.

Essayez ces prompts

기본 마이그레이션 전략
AngularJS 애플리케이션을 Angular 로 마이그레이션해야 합니다. 사용 가능한 주요 마이그레이션 전략은 무엇이며, 대규모 엔터프라이즈 애플리케이션에는 어떤 전략을 선택해야 합니까?
하이브리드 앱 설정
ngUpgrade 를 사용하여 하이브리드 AngularJS/Angular 애플리케이션을 어떻게 설정합니까? 부트스트랩 과정과 모듈 구성을 보여주세요.
컴포넌트 변환
이 AngularJS 컨트롤러를 Angular 컴포넌트로 변환하세요: (AngularJS 코드 제공). 적절한 import 와 데코레이터가 포함된 TypeScript 컴포넌트를 보여주세요.
서비스와 DI 마이그레이션
AngularJS 에서 사용할 수 있도록 Angular 서비스를 downgrade 하는 방법과 Angular 에서 작동하도록 AngularJS 팩토리를 upgrade 하는 방법은 무엇입니까?

Bonnes pratiques

  • UI 컴포넌트보다 변환이 더 쉬운 서비스부터 마이그레이션 시작
  • 마이그레이션 중 타입 안전성을 활용하기 위해 처음부터 TypeScript 사용
  • 마이그레이션 과정에서 문제를 조기에 발견하기 위해 각 단계에서 지속적으로 테스트
  • 마이그레이션 중 작성하는 모든 새 코드에 대해 공식 Angular 스타일 가이드 준수

Éviter

  • 적절한 스테이징 유효성 검사와 롤백 계획 없이 빅뱅식 전환 수행 금지
  • 비즈니스 로직과 서비스를 마이그레이션하기 전에 UI 컴포넌트를 마이그레이션하지 말 것
  • 동일한 기능 내에서 AngularJS 와 Angular 패턴을 일관성 없이 혼합하지 말 것

Foire aux questions

ngUpgrade 란 무엇이며 왜 필요한가요?
ngUpgrade 는 AngularJS 와 Angular 를 동일한 애플리케이션에서 실행할 수 있도록 도와주는 Angular 라이브러리입니다. UpgradeModule 을 제공하여 Angular 애플리케이션 내에서 AngularJS 컴포넌트를 부트스트랩하고 AngularJS 코드에서 Angular 서비스를 사용할 수 있게 해줍니다.
어떤 마이그레이션 전략을 선택해야 합니까?
소규모 애플리케이션에는 빅뱅 전략을, 지속적 제공이 필요한 대규모 애플리케이션에는 점진적 (하이브리드) 전략을, 명확한 기능 모듈이 있는 중규모 앱에는 수직 슬라이스 전략을 선택하세요.
AngularJS 템플릿 안에서 Angular 컴포넌트를 사용할 수 있나요?
네, @angular/upgrade/static 의 downgradeComponent 를 사용하여 AngularJS 템플릿 내에서 사용할 수 있도록 Angular 컴포넌트를 downgrade 할 수 있습니다.
의존성 주입 차이는 어떻게 처리합니까?
AngularJS 는 문자열 이름을 사용한 암시적 의존성 주입을 사용합니다. Angular 는 클래스와 Inject 데코레이터를 사용한 명시적 의존성 주입을 사용합니다. downgradeInjectable 과 upgradeModule 을 사용하여 프레임워크 간 서비스를 연동하세요.
리액티브 폼과 템플릿 기반 폼 중 어느 것으로 마이그레이션해야 합니까?
대부분의 경우 리액티브 폼이 권장됩니다. 더 나은 타입 안전성, 더 쉬운 테스트, 폼 유효성 검사 로직에 대한 더 많은 제어를 제공하기 때문입니다.
AngularJS 에서 Angular 로의 마이그레이션은 일반적으로 얼마나 걸립니까?
마이그레이션 시간은 애플리케이션 크기, 복잡성 및 팀 경험에 따라 달라집니다. 일반적인 일정은 다음과 같습니다: 설정 (1-2 주), 인프라 (2-4 주), 기능 마이그레이션 (앱 크기에 따라 다름), 정리 (1-2 주).

Détails du développeur

Structure de fichiers

📄 SKILL.md