CentOS 8에 Angular CLI 설치하는 방법

Angular는 인기 있는 오픈 소스 애플리케이션 개발 프레임워크입니다. 이는 매우 확장 가능하며 TypeScript/JavaScript를 사용하여 모바일 및 웹 애플리케이션을 개발하는 데 사용됩니다. 이는 처음부터 소규모에서 대규모 애플리케이션을 구축하기 위해 설계되었습니다. Angular 애플리케이션을 생성, 관리, 빌드 및 테스트하기 위한 Angular CLI 유틸리티를 제공합니다.

이 게시물에서는 CentOS 8에 Angular (CLI)를 설치하는 방법을 보여드리겠습니다.

전제 조건

CentOS 8이 실행되는 서버.
서버에 루트 비밀번호가 설정되어 있어야 합니다.

Node.js 설치

Angular를 설치하려면 서버에 Node.js가 설치되어 있어야 합니다. 설치되지 않은 경우 다음 명령어로 설치할 수 있습니다:

curl -sL https://rpm.nodesource.com/setup_14.x | bash -  
dnf install nodejs -y

설치가 완료되면 다음 명령어로 설치된 Node.js 버전을 확인합니다:

node --version

출력:

v14.16.1

다음 명령어를 사용하여 NPM 버전도 확인할 수 있습니다:

npm --version

출력:

6.14.12

Angular/CLI 설치

이제 다음 명령어를 실행하여 Angular/CLI를 설치할 수 있습니다:

npm install -g @angular/cli

설치가 완료되면 다음 명령어로 설치된 Angular/CLI 버전을 확인합니다:

ng --version

다음과 같은 출력을 얻어야 합니다:

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / ? \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    
Angular CLI: 11.2.7
Node: 14.16.1
OS: linux x64

Angular: 
... 
Ivy Workspace: 

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.1102.7 (cli-only)
@angular-devkit/core         11.2.7 (cli-only)
@angular-devkit/schematics   11.2.7 (cli-only)
@schematics/angular          11.2.7 (cli-only)
@schematics/update           0.1102.7 (cli-only)

Angular로 애플리케이션 만들기

Angular/CLI는 프로덕션 및 로컬 환경에서 애플리케이션을 생성하고 배포하는 더 쉬운 방법을 제공합니다.

hello-world라는 새 애플리케이션을 만들려면 다음 명령어를 실행합니다:

ng new hello-world

애플리케이션이 생성되면 hello-world 디렉토리로 이동하고 다음 명령어로 애플리케이션을 실행합니다:

cd hello-world  
gn serve

다음과 같은 출력을 보게 될 것입니다:

 Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ 


? Compiled successfully.
? Browser application bundle generation complete.

Initial Chunk Files | Names  |      Size
styles.css          | styles | 119 bytes

4 unchanged chunks

Build at: 2021-04-07T05:56:55.420Z - Hash: 7af40beb75c73ecdc1c9 - Time: 523ms

? Compiled successfully.

보시다시피, 애플리케이션이 시작되었고 localhost의 포트 4200에서 수신 대기 중입니다.

애플리케이션을 중지하려면 CTRL+C를 누르십시오.

특정 IP 주소나 포트에서 애플리케이션을 실행하려면 다음 명령어를 실행합니다:

gn serve --host 0.0.0.0 --port 3000

다음과 같은 출력을 얻어야 합니다:

Initial Chunk Files | Names         |      Size
vendor.js           | vendor        |   2.69 MB
polyfills.js        | polyfills     | 128.74 kB
main.js             | main          |  56.94 kB
runtime.js          | runtime       |   6.15 kB
styles.css          | styles        | 119 bytes

                    | Initial Total |   2.87 MB

Build at: 2021-04-07T05:58:19.494Z - Hash: d50a7bd2c684713d3b6b - Time: 11348ms

 Angular Live Development Server is listening on 0.0.0.0:3000, open your browser on http://localhost:3000/ 

? Compiled successfully.

Angular 애플리케이션 접근

현재 Angular 애플리케이션이 시작되었고 모든 네트워크 인터페이스에서 포트 3000에서 수신 대기 중입니다. 이제 http://your-server-ip:3000 URL을 사용하여 접근할 수 있습니다. 다음 페이지에서 애플리케이션을 볼 수 있어야 합니다:

Angular 앱

결론

축하합니다! CentOS 8에 Angular를 성공적으로 설치했습니다. 이제 Angular로 첫 번째 애플리케이션을 구축하고 프로덕션 환경에 배포할 수 있습니다.

전제 조건

Node.js 설치

Angular/CLI 설치

Angular로 애플리케이션 만들기

Angular 애플리케이션 접근

결론

새 게시물을 받은 편지함에서 받기