연습 - CLI를 사용하여 Azure 웹 사이트 만들기

완료됨

다음으로, Azure CLI를 사용하여 리소스 그룹을 만든 다음, 이 리소스 그룹에 웹앱을 배포하겠습니다.

무료 샌드박스를 사용하면 Azure 글로벌 지역의 일부 하위 지역에 리소스를 만들 수 있습니다. 리소스를 만들 때 다음 목록에서 지역을 선택합니다.

  • westus2
  • southcentralus
  • centralus
  • eastus
  • westeurope
  • southeastasia
  • japaneast
  • brazilsouth
  • australiasoutheast
  • centralindia

리소스 그룹 사용

자체 머신 및 Azure 구독으로 작업하는 경우 az login 명령을 사용하여 Azure에 로그인해야 합니다. 그러나 브라우저 기반 Cloud Shell 샌드박스 환경을 사용하는 경우에는 로그인이 필요 없습니다.

다음으로, 보통 az group create 명령과 관련된 모든 Azure 리소스에 대해 리소스 그룹을 만들지만 이러한 연습에서는 [샌드박스 리소스 그룹 이름]이라는 리소스 그룹이 이미 생성되어 있습니다.

참고

이 연습에서는 미국 동부를 지역으로 사용합니다. 앱 서비스 플랜을 만들 때 문제가 발생하는 경우 이전 목록에서 다른 지역을 선택합니다.

  1. 이 연습의 첫 번째 단계는 후속 명령에서 사용할 여러 변수를 만드는 것입니다.

    export RESOURCE_GROUP=<rgn>[sandbox resource group name]</rgn>
    export AZURE_REGION=eastus
    export AZURE_APP_PLAN=popupappplan-$RANDOM
    export AZURE_WEB_APP=popupwebapp-$RANDOM
    
  2. 테이블에 모든 리소스 그룹을 나열하도록 Azure CLI에 요청할 수 있습니다. 무료 Azure 샌드박스를 사용하는 동안 하나의 리소스 그룹이 있어야 합니다.

    az group list --output table
    

    복사 단추를 사용하여 클립보드에 명령을 복사할 수 있습니다. 붙여넣으려면 Cloud Shell 터미널에서 새 줄을 마우스 오른쪽 단추로 클릭하고 붙여넣기를 선택하거나 Shift+Insert 바로 가기 키(macOS의 경우 ⌘+V)를 사용합니다.

  3. Azure 개발과 마찬가지로 여러 리소스 그룹이 생성될 수 있습니다. 그룹 목록에 여러 항목이 있는 경우 --query 옵션을 추가하여 반환 값을 필터링할 수 있습니다. 다음 명령을 시도합니다.

    az group list --query "[?name == '$RESOURCE_GROUP']"
    

    쿼리는 JSON 요청에 대한 표준 쿼리 언어인 JMESPath를 사용하여 형식이 지정됩니다. 이 강력한 필터 언어에 대한 자세한 내용은 http://jmespath.org/를 참조하세요. 또한 Azure CLI를 사용하여 VM 관리 모듈에서 쿼리에 대해 더 자세히 다룹니다.

서비스 계획 설계 단계

Azure App Service를 사용하여 Web Apps를 실행하는 경우 앱에서 사용하는 Azure 컴퓨팅 리소스에 대한 요금이 청구되며, 리소스 비용은 Web Apps와 연결된 App Service 요금제에 따라 달라집니다. 서비스 계획은 앱 데이터 센터에 사용되는 지역, 사용되는 VM 수 및 가격 책정 계층을 결정합니다.

  1. 앱을 실행할 App Service 계획을 만듭니다. 다음 명령은 체험용 가격 책정 계층을 지정하지만 az appservice plan create --help를 실행하여 다른 가격 계층을 볼 수 있습니다.

    참고 항목

    앱과 플랜의 이름은 모든 Azure에서 고유해야 합니다. 이전에 만든 변수는 임의의 값을 접미사로 할당하여 고유한 값을 유지합니다. 그러나 리소스를 만들 때 오류가 발생할 경우 이전에 나열된 명령을 실행하여 모든 변수를 새로운 임의의 값으로 재설정해야 합니다.

    리소스 그룹에 대한 오류가 표시되면 이전에 나열된 명령을 다른 리소스 그룹 값으로 실행합니다.

    az appservice plan create --name $AZURE_APP_PLAN --resource-group $RESOURCE_GROUP --location $AZURE_REGION --sku FREE
    

    이 명령을 완료하는 데 몇 분 정도 걸릴 수 있습니다.

  2. 모든 플랜을 표에 나열하여 서비스 플랜이 성공적으로 생성되었는지 확인합니다.

    az appservice plan list --output table
    

    다음 예와 같은 응답이 나타납니다.

    Kind    Location    MaximumNumberOfWorkers    Name                NumberOfSites    ResourceGroup                               Status
    ------  ----------  ------------------------  ------------------  ---------------  ------------------------------------------  --------
    app     East US     3                         popupappplan-54321  0                Learn-12345678-1234-1234-1234-123456789abc  Ready
    

웹앱 만들기

다음으로, 서비스 플랜에 웹앱을 만듭니다. 코드를 동시에 배포할 수 있지만, 이 예제에서는 웹앱을 만들고 코드를 별도의 단계로 배포합니다.

  1. 웹앱을 만들려면 위에서 이전에 만든 앱 계획의 이름과 웹앱 이름을 입력합니다. 앱 플랜 이름과 마찬가지로 웹앱 이름은 고유해야 합니다. 이전에 만든 변수는 이 연습에 충분한 임의의 값을 할당합니다. 이 명령은 완료하는 데 잠시 시간이 걸릴 수 있습니다.

    az webapp create --name $AZURE_WEB_APP --resource-group $RESOURCE_GROUP --plan $AZURE_APP_PLAN
    
  2. 모든 앱을 표에 나열하여 앱이 성공적으로 생성되었는지 확인합니다.

    az webapp list --output table
    

    다음 예와 같은 응답이 나타납니다.

    Name               Location    State    ResourceGroup                               DefaultHostName                      AppServicePlan
    -----------------  ----------  -------  ------------------------------------------  -----------------------------------  ------------------
    popupwebapp-12345  East US  Running  Learn-12345678-1234-1234-1234-123456789abc  popupwebapp-12345.azurewebsites.net  popupappplan-54321
    

    표에 나열된 DefaultHostName을 기록합니다. 이는 새 웹 사이트에 연결할 수 있는 웹 주소입니다. Azure는 azurewebsites.net 도메인에서 고유한 앱 이름을 통해 웹 사이트를 사용할 수 있게 합니다. 예를 들어 앱 이름이 “popupwebapp-12345”인 경우 웹 사이트 URL은 http://popupwebapp-12345.azurewebsites.net입니다. 다음 스크립트를 사용하여 HTTP 주소를 반환할 수도 있습니다.

    site="http://$AZURE_WEB_APP.azurewebsites.net"
    echo $site
    
  3. 샘플 앱의 기본 HTML을 가져오려면 DefaultHostName과 함께 CURL을 사용합니다.

    curl $AZURE_WEB_APP.azurewebsites.net
    

    다음 예와 같은 응답이 나타납니다.

    <!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Microsoft Azure App Service - Welcome</title><link rel="shortcut icon" href="https://appservice.azureedge.net/images/app-service/v4/favicon.ico" type="image/x-icon"/><link href="https://appservice.azureedge.net/css/app-service/v4/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous"/><style>html, body{height: 100%; background-color: #ffffff; color: #000000; font-size: 13px;}*{border-radius: 0 !important;}</style> ... (continued)
    

GitHub에서 코드 배포

  1. 최종 단계는 GitHub 리포지토리에서 웹앱으로 코드를 배포하는 것입니다. 실행 시 “Hello World!”를 표시하는 Azure 샘플 GitHub 리포지토리의 기본적인 PHP 페이지를 사용해 보겠습니다. 직접 만든 웹앱 이름을 사용해야 합니다. 이 명령은 완료하는 데 잠시 시간이 걸릴 수 있습니다.

    az webapp deployment source config --name $AZURE_WEB_APP --resource-group $RESOURCE_GROUP --repo-url "https://github.com/Azure-Samples/php-docs-hello-world" --branch master --manual-integration
    
  2. 배포가 완료되면 브라우저 또는 CURL을 사용하여 사이트를 다시 방문합니다.

    curl $AZURE_WEB_APP.azurewebsites.net
    

    페이지에 "Hello World!"가 표시됩니다.

    Hello World!
    

이 연습에서는 대화형 Azure CLI 세션의 일반적인 패턴을 살펴보았습니다. 먼저 표준 명령을 사용하여 새 리소스 그룹을 만들었습니다. 그런 다음, 명령 집합을 사용하여 이 리소스 그룹에 리소스(이 예제에서는 웹앱)를 배포했습니다. 이 명령 집합을 셸 스크립트에 간단하게 결합하고, 동일한 리소스를 만들어야 할 때마다 실행할 수 있습니다.