티스토리 뷰
Step 1. Set up the Development Environment
$> npm install -g @angular/cli
Step 2. Create a new project
$> ng new my-app
dd
dd
Step 3: Serve the applicatio
$> cd my-app $> ng serve --open실제로 확인해보니 다음과 같다.
/src/my-app/src/app/app.component.ts을 살펴보면 다음과 같다
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'my First Angular app ';
}
저 중 Title을 변경하면 실제 Title이 동적으로 변경됨을 알 수 있다.
--> 아래 처럼 choi라는 문구가 동적으로 변경됨을 알 수 있다.
이어서 css도 변경하여 보자
src/app/app.component.css에 내용추가
h1 { color: #369; font-family: Arial, Helvetica, sans-serif; font-size: 250%; }
역시 title이 동적으로 변경 되었음을 알 수 있다.
일단.. 동작함을 확인하였으니 다음을 살펴보자
참고 페이지 : https://angular.io/guide/quickstart
댓글