MEAN 스택을 사용하는 최신 웹 애플리케이션

이 튜토리얼에서는 비용이 발생할 수 있습니다. Cost Estimator를 사용하여 예상 사용량을 기반으로 비용 추정값을 생성하십시오.

이 튜토리얼에서는 널리 사용되는 MEAN 스택을 사용하는 웹 애플리케이션을 작성하는 단계를 안내합니다. 이는 MongoDB, Express 웹 프레임워크, Angular 프론트엔드 프레임워크 및 Node.js 런타임으로 구성됩니다. MEAN 샘플 앱을 로컬에서 실행하는 방법, 관리형 DBasS 생성하고 사용하는 방법, 앱을 IBM Cloud 배포하는 방법, 런타임과 데이터베이스 리소스를 모두 확장하는 방법을 배울 수 있습니다.

목표

  • 로컬에서 Node.js 샘플 앱을 만들고 실행해 보세요.
  • 관리형 Databases for MongoDB 인스턴스를 작성합니다.
  • IBM Cloud® Code Engine 사용하여 Node.js 클라우드에 배포하십시오.
  • 런타임 CPU 및 메모리 리소스를 스케일링합니다.
  • 데이터베이스 메모리 및 디스크 리소스를 스케일링합니다.

아키텍처 다이어그램 * 튜토리얼의
다이어그램

  1. 사용자가 웹 브라우저를 사용하여 애플리케이션에 액세스합니다.
  2. Code Engine에서 실행 중인 Node.js 앱은 Databases for MongoDB 데이터베이스에 액세스하여 데이터를 페치합니다.

시작하기 전에

이 튜토리얼에는 다음 항목이 필요합니다.

  • IBM Cloud CLI - 이 CLI 도구를 사용하여 IBM Cloud와 상호작용할 수 있습니다.
    • Code Engine 자원에 대한 CLI 액세스를 위한 code-engine/ce 플러그인 (code-engine/ce).
    • 컨테이너 이미지 관리를 위한 선택사항 Container Registry 플러그인 (container-registry).
  • git: 소스 코드 저장소를 복제함
  • 선택 사항, 앱을 로컬에서 실행하는 것을 테스트하고 싶다면 Node.js 설치해야 합니다.

튜토리얼 시작하기 안내서에는 사용자 운영 체제에 맞게 이 도구를 다운로드하고 설치하기 위한 지시사항이 있습니다.

이러한 도구의 설치를 피하려면 Cloud Shell IBM Cloud 사용할 수 있습니다.

이 학습서에서는 명령행을 사용하여 데이터베이스, IBM Cloud® Code Engine 프로젝트 및 애플리케이션을 작성하는 방법에 대해 설명합니다. 워크스테이션에서 로컬로 Terraform을 사용하여 프로비저닝하거나 몇 번의 클릭만으로 Schematics 를 사용하여 더 간단한 프로비저닝을 수행하기 위한 지시사항이 함께 제공되는 GitHub 저장소 에 있습니다.

클라우드에서 MongoDB 데이터베이스의 인스턴스 작성

이 절에서는 클라우드에 Databases for MongoDB 인스턴스를 작성합니다. Databases for MongoDB은(는) 구성하기 쉬우며 기본 제공 백업 및 스케일링 기능을 제공하는 DBaaS(Database as a Service)입니다. IBM Cloud카탈로그에는 다양한 유형의 데이터베이스가 있는 것을 볼 수 있습니다. Databases for MongoDB 인스턴스를 작성하려면 아래 단계를 따르십시오.

  1. 로그인하지 않은 경우, ibmcloud login 또는 ibmcloud login --sso 을 사용하여 대화형으로 로그인하십시오. 선호하는 IBM Cloud 지역 및 리소스 그룹을 대상으로 지정하십시오. 아래 예제에서는 ca-tor (Toronto) 리젼 및 default 자원 그룹을 사용합니다.

    ibmcloud target -r ca-tor -g default
    

    문서에 있는 일반 IBM Cloud CLI(ibmcloud) 명령 주제에서 더 많은 CLI 명령을 찾아볼 수 있습니다.

  2. 명령행을 통해, 또는 콘솔 UI를 사용하여 Databases for MongoDB의 인스턴스를 작성하십시오. 이 튜토리얼에서 사용하는 애플리케이션이 이 이름으로 서비스를 찾도록 구성되어 있기 때문에 서비스 이름은 mean-stack-mongodb로 지정해야 합니다. <region>에 대해서는 자신에게 가까운 지역을 선택할 수 있지만, 이 학습서에서는 ca-tor을(를) 사용합니다.

    ibmcloud resource service-instance-create mean-stack-mongodb databases-for-mongodb standard ca-tor
    
  3. 인스턴스가 준비될 때까지 기다리십시오. 다음 명령을 사용하여 프로비저닝 상태를 확인할 수 있습니다.

    ibmcloud resource service-instance mean-stack-mongodb
    
  4. 서비스 상태가 "작성 성공"으로 변경되었음을 확인하고 나면 서비스 키 작성을 진행할 수 있습니다.

    ibmcloud resource service-key-create mean-stack-mongodb-key --instance-name mean-stack-mongodb
    

로컬로 MEAN 앱 실행

이 절에서는 MEAN 샘플 코드를 복제하고 애플리케이션을 로컬로 실행하여 IBM Cloud에서 실행 중인 MongoDB 데이터베이스에 대한 연결을 테스트합니다.

  1. MEAN 샘플 코드를 복제합니다.

    git clone https://github.com/IBM-Cloud/nodejs-MEAN-stack
    cd nodejs-MEAN-stack
    
  2. .env.example 파일을 .env 에 복사합니다.

    cp .env.example .env
    
  3. .env 파일에 자신의 SESSION_SECRET을 추가하십시오. MONGODB_URL 및 CERTIFICATE_BASE64에 대해서는 아래 명령을 실행하십시오.

    ibmcloud resource service-key mean-stack-mongodb-key --output json
    

    리턴된 JSON 출력에서 MONGODB_URL에 필요한 값은 credentials -> connection -> mongodb -> composed, CERTIFICATE_BASE64에 필요한 값은 credentials -> connection -> mongodb -> certificate -> certificate_base64에서 찾을 수 있습니다. .env에 추가된 값에 따옴표나 공백이 포함되어 있지 않은지 확인하십시오.

  4. 선택사항 - 필요한 패키지를 설치하십시오.

    npm install
    
  5. 선택사항 - 애플리케이션을 로컬로 실행하십시오. 출력에 제공된 URL을 사용하여 앱에 액세스하고, 새 사용자를 작성하여 로그인하십시오.

    node server.js
    

클라우드 쉘을 사용하면 오른쪽 상단에 있는 아이콘을 클릭하고 포트 8080 에서 미리보기를 클릭하여 애플리케이션을 열 수 있습니다.

앱을 클라우드에 배치

IBM Cloud® Code Engine 웹 앱, 마이크로서비스, 이벤트 기반 기능, 배치 작업 등 컨테이너화된 작업 부하를 실행하는 완전 관리형 서버리스 플랫폼입니다. 이 절에서는 Code Engine 프로젝트를 작성하고 컨테이너화된 Node.js 앱을 프로젝트에 배치합니다. 이전 섹션에서, 소스 코드는 로컬에 있는 .env 를 읽어 MongoDB URL 과 자격 증명을 얻습니다. 여기서는 앱이 실행될 때 읽을, 이와 동일한 키/값을 포함하도록 프로젝트에 시크릿을 작성합니다.

애플리케이션에 대한 컨테이너 이미지 빌드와 공용 IBM Cloud Container Registry(으)로의 푸시는 이미 수행했습니다. 여기서는 이 사전 빌드된 컨테이너 이미지를 사용하여 애플리케이션을 배치합니다.

  1. IBM Cloud Code Engine에서 프로젝트를 작성하십시오.

    ibmcloud code-engine project create --name mean-stack
    
  2. 애플리케이션을 로컬로 실행하기 위해 이전에 사용한 .env 파일의 키/값을 포함하는 프로젝트에서 시크릿을 작성하십시오. 이 시크릿은 클라우드에서 실행되는 애플리케이션이 사용합니다. 시크릿에 대한 자세한 정보는 시크릿에 대한 작업 을 참조하십시오.

    ibmcloud code-engine secret create --name mean-stack-secrets --from-env-file .env
    
  3. https://github.com/IBM-Cloud/nodejs-MEAN-stack 저장소에서 다운로드한 것과 동일한 소스 코드를 기반으로 하는 공용 컨테이너 이미지를 기반으로 애플리케이션을 작성하십시오. 이 이미지를 작성하는 데 사용되는 단계에 관심이 있는 경우에는 create-container-image.md를 검토할 수 있습니다.

    ibmcloud code-engine application create --name mean-stack-application --image icr.io/solution-tutorials/tutorial-mean-stack --env-from-secret mean-stack-secrets
    
  4. 코드가 푸시되고 나면 브라우저에서 앱을 볼 수 있습니다. 다음과 같은 호스트 이름이 생성되었습니다: https://mean-stack.<CE_SUBDOMAIN>.ca-tor.codeengine.appdomain.cloud/. CE_SUBDOMAIN은(는) 프로젝트에 삽입되며 그 값은 프로젝트 작성 중에 결정되는 변수입니다. 애플리케이션 URL은 콘솔 대시보드 또는 명령행에서 얻을 수 있습니다. 애플리케이션에 접속하면 다음과 같은 화면이 나타납니다:

    라이브 앱
    라이브 앱

Code Engine에서의 컴퓨팅 리소스 스케일링

Code Engine은(는) 시스템 내 요청의 수를 모니터하고, 애플리케이션에 대한 HTTP 연결을 비롯한 수신 요청의 로드를 충족하기 위해 애플리케이션 인스턴스를 스케일링 업 또는 다운합니다. 서비스에 추가 컴퓨팅 리소스가 필요하거나 할당된 컴퓨팅 리소스의 양을 줄이려는 경우에는 특정 애플리케이션 페이지에서 이러한 변경을 수행할 수 있습니다.

  1. Code Engine 프로젝트 페이지로 이동하십시오.

  2. 이전에 작성된 mean-stack 프로젝트를 클릭하십시오.

  3. 요약에서 애플리케이션을 클릭하십시오.

  4. 이전에 작성된 mean-stack-application을 클릭하십시오.

  5. 구성을 클릭한 후 런타임을 클릭하여 현재 구성을 보십시오.

    자원 스케일링
    자원 스케일링

  6. 편집 및 새 개정판 작성을 클릭하여 CPU 및 메모리, 최소/최대 인스턴스 수, 동시성 등을 조정하십시오.

  7. 저장 및 작성을 클릭하여 변경을 트리거하십시오. 이는 완료되면 애플리케이션이 DeployingReady임을 표시합니다.

Databases for MongoDB에서의 데이터베이스 리소스 스케일링

서비스에서 추가 스토리지를 필요로 하거나 서비스에 할당된 스토리지 양을 줄이려는 경우에는 리소스를 스케일링하여 이를 수행할 수 있습니다.

  1. 데이터베이스아래의 리소스 목록 에서 Databases for MongoDB 서비스 인스턴스에 액세스하십시오.
  2. 리소스 패널을 클릭하십시오.
    자원 스케일링
    자원 스케일링
  3. 슬라이더를 조정하여 Databases for MongoDB 데이터베이스 서비스에 할당되는 스토리지를 늘리거나 줄이십시오.
  4. 배치 스케일링을 클릭하여 스케일링을 트리거하고 대시보드 개요로 돌아가십시오. 재스케일링이 진행 중임을 표시합니다.
  5. 또는 사용량이 증가함에 따라 데이터베이스 리소스를 자동으로 늘리도록 Auto-Scaling 규칙을 구성하십시오.

자원 제거

리소스를 제거하려면 다음 단계를 수행하십시오.

  1. 아래 명령을 사용하여 프로젝트를 삭제하면 모든 구성 요소(애플리케이션, 작업 등)가 삭제됩니다.
    ibmcloud code-engine project delete --name mean-stack
    
  2. Databases for MongoDB 서비스 키를 삭제합니다.
    ibmcloud resource service-key-delete mean-stack-mongodb-key
    
  3. Databases for MongoDB 서비스를 삭제하십시오.
    ibmcloud resource service-instance-delete mean-stack-mongodb
    

리소스에 따라 즉시 삭제되지 않고 보유될 수 있습니다(기본 7일 동안). 리소스를 영구적으로 삭제하여 재확보하거나 보유 기간 내에 리소스를 복원할 수 있습니다. 리소스 재확보 사용 방법은 이 문서를 참조하십시오.

관련 컨텐츠