Skip to content

Angular 환경 설정 #
Find similar titles

You are seeing an old version of the page. Go to latest version

angluar 개발에 필요한것 #

  • 편리한 개발을 위한 필수 소프트웨어 IDE(VScode)
  • Node.js 기반의 패키지 관리를 위한 Node.js와 NPM
  • 편리한 프로젝트 생성 및 관리를 위한 Angular CLI

node.js 설치 #

아래주소에 접속 후 OS 버전에 맞도록 다운로드 후 설치한다.

  • 주소

    https://nodejs.org/ko/download
    
  • node 설치 확인

    node -v
    
  • npm 설치 확인

    npm -v
    

typescript 설치 #

  • typescript설치

    npm install -g typescript
    

angular/cli 설치 #

  • angular/cli 설치

    npm install -g @angular/cli@latest
    
  • angular cli 설치를 확인

    g -v
    

vscode 설치 #

아래주소에 접속 후 OS버전에 맞도록 다운로드 후 설치한다.

  • 주소

    https://code.visualstudio.com/download
    

angular HelloWorld만들기 #

  • angular프로젝트 생성

    ng new HelloWorldProject
    
  • HelloWorldProject로 이동

    cd HelloWorldProject
    
  • vscode로 현재 프로젝트를 오픈 app.componentts의 title 값을 변경

    code .
    
  • angualr 프로젝트 서버 실행 -o : 실행 후 브라우져에서 열림

    ng serve -o
    

angular cli #

  • angular 프로젝트 생성

    ng new 프로젝트
    
  • component 생성

    ng generate component 컴포넌트
    
  • alias를 통해 component 생성

    ng g c 컴포넌트
    
  • dry run 옵션을 주면 실제 생성되지는 않음. 생성되는 파일 목록을 보여줌

    ng g c 컴포넌트 --dry-run
    
  • service 생성

    ng generate service 서비스
    
  • alias를 통해 service 생성

    ng g s 서비스
    
  • dry run 옵션을 주면 실제 생성되지는 않음. 생성되는 파일 목록을 보여줌

    ng g s 서비스 --dry-run
    
  • ng help를 통하면 더 많은 기능을 확인 할 수 있다.

    ng help
    

참고 #

0.0.1_20210630_7_v33