다음을 통해 공유

Azure에 JavaScript 앱 배포 개요

  • 아티클

JavaScript 기반 앱을 Azure에 배포하려면 HTTP 엔드포인트를 통해 제공될 파일 또는 파일 집합을 Azure로 이동합니다. 파일을 이동하는 프로세스를 배포라고 합니다.

필수 구성 요소

  • Azure 구독 - 하나를 무료로만드세요.
  • Node.js LTS.
  • GitHub 리포지토리에서 배포할 계획이라면 GitHub 계정이 필요합니다.

배포 방법

Azure는 다양한 요구 사항에 맞게 다양한 배포 방법을 제공합니다. 다음은 몇 가지 일반적인 방법입니다.

메서드 세부 정보
Azure Developer CLI 명령줄 도구를 선호하며 리소스의 프로비전 및 배포를 자동화해야 하는 개발자에게 적합합니다.
Visual Studio Code 확장 수동, 테스트 또는 드문 배포에 적합합니다. 관련 Azure 확장이 로컬에 설치되어 있어야 합니다.
Azure CLI 수동 또는 드문드문 배포 작업에 유용합니다. 로컬에 Azure CLI를 설치해야 합니다.
GitHub Actions GitHub 리포지토리의 변경으로 트리거되는 자동화된 또는 지속적인 배포에 가장 적합합니다.

다른 배포 방법은 특정 서비스에 따라 존재합니다. 예를 들어 Azure App Service는 다양한 배포 방법을 지원합니다.

원래 배포할 때 사용하지 않았더라도 제공된 메서드 중 어느 것을 사용하여도 App Service에 다시 배포할 수 있습니다. 메서드를 전환하는 경우 다시 배포하기 전에 일부 구성이 있을 수 있습니다.

빌드 단계

애플리케이션의 복잡성 및 배포 요구 사항에 따라 배포 전이나 배포 중에 JavaScript 앱을 빌드하도록 선택할 수 있습니다.

  • 빌드 후 배포: 복잡하거나 시간이 많이 걸리는 빌드의 경우 애플리케이션을 zip 파일로 패키징한 후 배포합니다. 배포 패키지를 사용하면 배포 전에 빌드를 제어하고 테스트할 수 있습니다.
  • 배포중 빌드: 더 간단한 빌드의 경우 Azure에서 제공하는 환경 변수 SCM_DO_BUILD_DURING_DEPLOYMENT=true를 사용하여 배포 중에 앱을 빌드합니다.

배포 슬롯

Azure App Service에서 배포 슬롯을 사용하면 스테이징 및 프로덕션을 위한 별도의 환경을 만들 수 있습니다. 슬롯을 사용하면 프로덕션 슬롯과 교환하기 전에 스테이징 환경에서 앱을 테스트하여 원활하고 오류 없는 배포를 보장할 수 있습니다. 배포 슬롯에 대해 자세히 알아봅니다.

배포 슬롯을 사용하여 배포 용도를 혼합하지 마세요. 모든 배포 슬롯은 앱 서비스를 공유하므로 트래픽 패턴과 모든 슬롯의 의도된 사용이 동일한지 확인해야 합니다. 별도의 앱 서비스여야 하는 호스트된 테스트 또는 스테이지 환경이 있어야 하는 경우

Azure 개발자 CLI를 사용하여 배포

Azure 개발자 CLI(azd)는 Azure에 앱을 배포하는 프로세스를 간소화합니다. 다음 단계를 수행합니다.

  1. Azure Developer CLI를 설치합니다.

  2. 프로젝트에서 사용하는 동일한 리소스를 많이 사용하는 기존 프로젝트 찾습니다.

  3. 자체 프로젝트의 인프라 템플릿으로 사용할 프로젝트의 로컬 버전을 초기화합니다.

    azd init --template <template-name>

  4. 리소스를 만들고 Azure에 코드를 배포합니다.

    azd up

Visual Studio Code를 사용하여 배포

Visual Studio Code를 사용하여 App Service 앱을 배포하거나 다시 배포하려면 다음 단계를 완료합니다.

  1. AzureApp Service 또는 Azure Functions같은 관련 Azure 확장을 설치합니다.

  2. Azure 탐색기를 엽니다. 기본 사이드바에서 Azure 아이콘을 선택하거나 바로 가기 키(Shift + Alt + A)를 사용합니다.

  3. 리소스 그룹에서 구독 및 서비스를 선택합니다.

  4. 서비스를 마우스 오른쪽 단추로 클릭한 다음 웹앱에 배포...를 선택합니다..

    Visual Studio Code를 사용하여 App Service에 배포 또는 다시 배포

Azure 호스팅 환경에 연결

  • 호스트된 환경에 대한 수동 또는 가끔 액세스 경우 Azure 호스팅 환경파일을 보는 방법을 참조하세요.
  • 자동화되거나 일관된 액세스을 위해 배포 방법 중 하나를 설정하는 단계를 따르세요.

Azure 호스팅 환경에서 파일 보기

호스트된 Azure 웹앱 또는 함수 앱에서 파일을 즉시 볼 수 있는 몇 가지 방법이 있습니다. 호스트된 리소스에서 슬롯을 사용하는 경우 파일을 보기 전에 올바른 슬롯에 있는지 확인해야 합니다.

  • Azure 포털에서 파일을 보고 - 호스팅 리소스에 대한 개발 도구 아래에서 콘솔을 선택합니다.

    웹앱 또는 함수 앱에 대한 Azure Portal의 '개발 도구' 메뉴에서 '콘솔'을 선택합니다.

  • VS Code 확장에서 파일 보기: - 작업 표시줄에서 Azure 아이콘을 선택합니다. 리소스 섹션에서 구독 및 서비스를 선택합니다. 파일 노드는 원격 파일을 볼 수 있게 해 줍니다.

    [Azure App Service 및 Azure Functions 앱 확장은 모두 원격 파일의 보기를 제공합니다.

Azure Portal에서 HTTP 엔드포인트 보기

Azure 포털의 서비스 개요 페이지에서 HTTP 엔드포인트를 확인하십시오.

Azure Portal의 서비스 개요 페이지에서 HTTP 엔드포인트를 봅니다.

관련 콘텐츠