개발이 좋아서/Angular가 좋아서

Angular - 튜토리얼01

zoaseo 2022. 9. 26. 15:40

1) 설치순서

1. Node.js 설치

2. Node.js 설치 이휴 타입스크립트와 앵귤러 빌드 툴 설치

- cmd 창에서 명령 입력 : npm install -g typescript

- cmd 창에서 명령 입력 : npm i @angular/cli -g

3. 비쥬얼 스튜디오 코드 설치

확장팩 설치

ng new 프로젝트 명 : 프로젝트 생성

ng serve : 프로젝트를 임시 서버로 돌리는 역할

 

N 다음 CSS 입력
만든 폴더 study 열기
메인 컴포넌트격

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'study';

  constructor() { // 생성자...?
    console.log('Working'); 
    var number = 1; 
    console.log('number -> ',number);
    console.log(number * 10);
  }
}

명령창에 ng serve 입력 후

http://localhost:4200 접속 후 콘솔창 열기

만약 4200번 포트가 사용중이라면 --port  라는 옵션을 주어 실횅

ng serve --port 포트