- Angular CLI란¿
Angular CLI(Command Line Interface)는 간단한 명령어를 사용하여 Angular 프로젝트 스캐폴딩을 생성, 실행, 빌드 할 수 있으며, Angular의 다양한 구성요소를 선별적으로 추가할 수 있는 커맨드-라인 인터페이스이다. 개발용 서버를 내장하고 있어서 간단히 프로젝트를 실해이켜서 동작을 확일할 수 있다. 또한 Angular CLI는 Angular 프로젝트 스캐폴딩을 간단한 명령어로 생성해 주어 개발환경 구축에 소요되는 시간을 최소화할 뿐 아니라 표준 스타일 가이드를 제공한다.
- 프로젝트 생성
$ ng new <project-name>
ex) $ ng new angular-project
프로젝트가 생성되면 스캐폴딩이 생성된다. Angular 스타일 가이드의 기본 애플리케이션 구조, 네이밍 룰, 코딩 컨벤션 등을 준수하여 생성된 것이다.
- 프로젝트 실행
프로젝트를 로컬 환경에서 실행(preview)하기 위해서는 ng serve 명령어를 사용한다.
$ ng serve <project-name>
ex) ng serve angular-project
--open(-o) 옵션을 사용하면 자동으로 브라우저 실행하여 준다. 아니면 브라우저를 열고 주소창에 localhost:4200을 입력하여 개발용 서버로 접속한다.
$ ng serve --open
ng serve 명령어를 사용한 프로젝트 실행 결과
- 프로젝트 구성요소 생성
| 생성 대상 구성요소 | 명령어 | 축약형 |
| 컴포넌트 | ng generate component <component-name> | ng g c <component-name> |
| 디렉티브 | ng generate directive <directive-name> | ng g d <directive-name> |
| 파이프 | ng generate pipe <pipe-name> | ng g p <pipe-name> |
| 서비스 | ng generate service <service-name> | ng g s <service-name> |
| 모듈 | ng generate module <module-name> | ng g m <module-name> |
| 가드 | ng generate guard <guard-name> | ng g g <guard-name> |
| 클래스 | ng generate class <class-name> | ng g cl <class-name> |
| 인터페이스 | ng generate interface <interface-name> | ng g i <interface-name> |
| Enum | ng generate enum <enum-name> | ng g e <enum-name> |
출처 : Angular Essentials