빠른 시작: ASP.NET 웹앱 배포

이 빠른 시작에서는 첫 번째 ASP.NET 웹앱을 만들고 Azure App Service에 배포하는 방법을 알아봅니다. App Service는 다양한 버전의 .NET 앱을 지원하며 확장성이 뛰어난 자체 패치 웹 호스팅 서비스를 제공합니다. ASP.NET 웹앱은 크로스 플랫폼이며 Linux 또는 Windows에서 호스트할 수 있습니다. 이 빠른 시작을 마치고 나면 App Service 호스팅 계획 및 웹 애플리케이션이 배포된 App Service로 구성된 리소스 그룹이 하나 생깁니다.

사전 요구 사항

  • 활성 구독이 있는 Azure 계정. 체험 계정을 만듭니다.

  • ASP.NET 및 웹 개발 워크로드가 설치된 Visual Studio 2019입니다.

    Visual Studio 2019를 이미 설치한 경우:

    • 도움말 > 업데이트 확인 을 차례로 선택하여 Visual Studio에서 최신 업데이트를 설치합니다.
    • 도구 > 도구 및 기능 가져오기 를 차례로 선택하여 워크로드를 추가합니다.

최신 .NET Core 3.1 SDK를 설치합니다.

최신 .NET Core 3.1 SDK를 설치합니다.

ASP.NET 웹앱 만들기

.NET Core 3.1은 .NET의 현재 LTS(장기 지원) 릴리스입니다. 자세한 내용은 .NET 지원 정책을 참조하세요.

  1. Visual Studio를 연 다음, 새 프로젝트 만들기 를 선택합니다.

  2. 새 프로젝트 만들기 에서 ASP.NET Core 웹앱 을 찾아서 선택한 후 다음 을 선택합니다.

  3. 새 프로젝트 구성 에서 애플리케이션 이름을 MyFirstAzureWebApp 으로 지정한 후 다음 을 선택합니다.

    ASP.NET Core 3.1 웹앱 구성

  4. .NET Core 3.1(장기 지원) 을 선택합니다.

  5. 인증 유형없음 으로 설정되어 있는지 확인합니다. 만들기 를 선택합니다.

    Visual Studio - .NET Core 3.1 및 인증 유형으로 없음을 선택합니다.

  6. Visual Studio 메뉴에서 디버그 > 디버깅하지 않고 시작 을 차례로 선택하여 웹앱을 로컬로 실행합니다.

    Visual Studio - .NET Core 3.1 로컬에서 찾아보기

MyFirstAzureWebApp 이라는 새 폴더를 만들고 Visual Studio Code에서 엽니다. 터미널 을 열고 dotnet new webapp 명령을 사용하여 새 .NET 웹앱을 만듭니다.

dotnet new webapp -f netcoreapp3.1

Visual Studio Code의 터미널 에서 dotnet run 명령을 사용하여 애플리케이션을 로컬에서 실행합니다.

dotnet run

웹 브라우저를 열고 https://localhost:5001의 앱으로 이동합니다.

ASP.NET Core 3.1 웹앱 템플릿이 페이지에 표시됩니다.

Visual Studio Code - .NET Core 3.1을 브라우저에서 로컬로 실행

머신에서 터미널 창을 열고 작업 디렉터리로 이동합니다. dotnet new webapp 명령을 사용하여 새 .NET 웹앱을 만든 후 새로 만든 앱으로 디렉터리를 변경합니다.

dotnet new webapp -n MyFirstAzureWebApp -f netcoreapp3.1 && cd MyFirstAzureWebApp

동일한 터미널 세션에서 dotnet run 명령을 사용하여 애플리케이션을 로컬로 실행합니다.

dotnet run

웹 브라우저를 열고 https://localhost:5001의 앱으로 이동합니다.

ASP.NET Core 3.1 웹앱 템플릿이 페이지에 표시됩니다.

Visual Studio Code - 로컬 브라우저의 ASP.NET Core 3.1

웹앱 게시

웹앱을 게시하려면 먼저 앱을 게시할 수 있는 새 App Service를 만들고 구성해야 합니다.

App Service를 설정하는 과정에서 다음 항목을 만듭니다.

  • 서비스에 필요한 모든 Azure 리소스를 포함할 새 리소스 그룹
  • 앱을 호스팅하는 웹 서버 팜의 위치, 크기 및 기능을 지정하는 새 호스팅 계획

다음 단계에 따라 App Service를 만들고 웹앱을 게시합니다.

  1. 솔루션 탐색기 에서 마우스 오른쪽 단추로 MyFirstAzureWebApp 프로젝트를 클릭하고 게시 를 선택합니다.

  2. 게시 에서 Azure 를 선택한 후 다음 을 선택합니다.

    Visual Studio - 웹앱 게시 및 대상 Azure

  3. 옵션은 Azure에 이미 로그인했는지 여부와 Azure 계정에 연결된 Visual Studio 계정이 있는지 여부에 따라 달라집니다. 계정 추가 또는 로그인 중 하나를 선택하여 Azure 구독에 로그인합니다. 이미 로그인한 경우 원하는 계정을 선택합니다.

    Visual Studio - Azure에 로그인 선택 대화 상자

  4. 특정 대상Azure App Service(Linux) 또는 Azure App Service(Windows) 중 하나로 선택합니다.

    중요

    ASP.NET Framework 4.8을 대상으로 하는 경우 Azure App Service(Windows) 를 사용합니다.

  5. App Service 인스턴스 오른쪽에서 + 를 선택합니다.

    Visual Studio - 새 App Service 앱 대화 상자

  6. 구독 의 경우 나열된 구독을 수락하거나 드롭다운 목록에서 새 구독을 선택합니다.

  7. 리소스 그룹 에 대해 새로 만들기 를 선택합니다. 새 리소스 그룹 이름 에서 myResourceGroup 을 입력하고, 확인 을 선택합니다.

  8. 호스팅 계획 에서 새로 만들기 를 선택합니다.

  9. 호스팅 계획: 새로 만들기 대화 상자에서 다음 표에 지정된 값을 입력합니다.

    설정 제안 값 Description
    호스팅 계획 MyFirstAzureWebAppPlan App Service 플랜의 이름입니다.
    위치 서유럽 웹앱이 호스팅된 데이터 센터입니다.
    크기 Free 가격 책정 계층은 호스팅 기능을 결정합니다.

    새 호스팅 계획 만들기

  10. 이름 에서 유효한 문자(a-z, A-Z, 0-9-)만 포함된 고유한 앱 이름을 입력합니다. 자동으로 생성된 고유한 이름을 적용할 수 있습니다. 웹앱의 URL은 http://<app-name>.azurewebsites.net이며, 여기서 <app-name>은 앱 이름입니다.

  11. 만들기 를 선택하여 Azure 리소스를 만듭니다.

    Visual Studio - 앱 리소스 만들기 대화 상자

    마법사가 완료되면 Azure 리소스가 생성되고 게시할 준비가 완료됩니다.

  12. 마침 을 선택하여 마법사를 닫습니다.

  13. 게시 페이지에서 게시 를 선택합니다. Visual Studio는 앱을 Azure에 빌드, 패키지 및 게시한 다음, 기본 브라우저에서 앱을 시작합니다.

    ASP.NET Core 3.1 웹앱이 페이지에 표시됩니다.

    Visual Studio - Azure의 ASP.NET Core 3.1 웹앱

Visual Studio Azure 도구 확장을 사용하여 웹앱을 배포하려면:

  1. Visual Studio Code에서 명령 팔레트를 엽니다(Ctrl+Shift+P).

  2. "Azure App Service: 웹앱에 배포"를 검색하여 선택합니다.

  3. 프롬프트에 다음과 같이 응답합니다.

    • MyFirstAzureWebApp 을 배포할 폴더로 선택합니다.
    • 메시지가 나타나면 구성 추가 를 선택합니다.
    • 메시지가 나타나면 기존 Azure 계정에 로그인합니다.

    Visual Studio Code - Azure에 로그인

    • 구독 을 선택합니다.
    • 새 웹앱 만들기...고급 을 선택합니다.
    • 전역적으로 고유한 이름 입력 에는 모든 Azure에서 고유한 이름을 사용합니다(유효한 문자: a-z, 0-9- ). 회사 이름과 앱 식별자를 조합하여 사용하는 것이 좋습니다.
    • 새 리소스 그룹 만들기 를 선택하고, myResourceGroup와 같은 이름을 지정합니다.
    • 런타임 스택 선택 메시지가 나타나면:
      • .NET Core 3.1 의 경우 .NET Core 3.1(LTS) 을 선택합니다.
      • .NET 5.0 의 경우 .NET 5 를 선택합니다.
      • .NET Framework 4.8 의 경우 ASP.NET V4.8 을 선택합니다.
    • 운영 체제(Windows 또는 Linux)를 선택합니다.
      • .NET Framework 4.8 의 경우 Windows가 암시적으로 선택됩니다.
    • 새 App Service 계획 만들기 를 선택하고, 이름을 제공하고, F1 체험 가격 책정 계층을 선택합니다.
    • Application Insights 리소스에 대해 지금 건너뛰기 를 선택합니다.
    • 가까운 위치를 선택합니다.
  4. 게시가 완료되면 알림에서 웹 사이트 찾아보기 를 선택하고 메시지가 나타나면 열기 를 선택합니다.

    ASP.NET Core 3.1 웹앱이 페이지에 표시됩니다.

    Visual Studio Code - Azure의 ASP.NET Core 3.1 웹앱

az webapp up 명령을 사용하여 로컬 MyFirstAzureWebApp 디렉터리에 코드를 배포합니다.

az webapp up --sku F1 --name <app-name> --os-type <os>
  • az 명령이 인식되지 않으면 사전 요구 사항의 설명대로 Azure CLI가 설치되어 있는지 확인합니다.
  • <app-name>을 모든 Azure에서 고유한 이름으로 바꿉니다(유효한 문자는 a-z, 0-9- ). 좋은 패턴은 회사 이름과 앱 식별자의 조합을 사용하는 것입니다.
  • --sku F1 인수는 무료 가격 책정 계층에 웹앱을 만듭니다. 이 인수를 생략하여 더 빠른 프리미엄 계층을 사용합니다. 이 경우 시간당 비용이 발생합니다.
  • <os>linux 또는 windows로 바꿉니다. ASP.NET Framework 4.8 을 대상으로 하는 경우 windows를 사용해야 합니다.
  • 선택적으로 인수 --location <location-name>을 포함할 수 있습니다. 여기서 <location-name>은 사용 가능한 Azure 지역입니다. Azure 계정에 허용되는 지역 목록은 az account list-locations 명령을 실행하여 검색할 수 있습니다.

이 명령을 완료하는 데 몇 분 정도 걸릴 수 있습니다. 실행되는 동안 리소스 그룹, App Service 계획 및 호스팅 앱 만들기, 로깅 구성, ZIP 배포 수행에 대한 메시지가 제공됩니다. 그런 다음, 앱의 URL이 포함된 메시지가 출력됩니다.

You can launch the app at http://<app-name>.azurewebsites.net

웹 브라우저를 열고 URL로 이동합니다.

ASP.NET Core 3.1 웹앱이 페이지에 표시됩니다.

CLI - Azure의 ASP.NET Core 3.1 웹앱

앱 업데이트 및 재배포

웹앱을 업데이트하고 다시 배포하려면 다음 단계를 수행합니다.

  1. 솔루션 탐색기 의 프로젝트 아래에서 Index.cshtml 을 엽니다.

  2. 첫 번째 <div> 요소를 다음 코드로 바꿉니다.

    <div class="jumbotron">
        <h1>.NET 💜 Azure</h1>
        <p class="lead">Example .NET app to Azure App Service.</p>
    </div>
    

    변경 내용을 저장합니다.

  3. Azure에 다시 배포하려면 솔루션 탐색기 에서 MyFirstAzureWebApp 프로젝트를 마우스 오른쪽 버튼으로 클릭하고 게시 를 선택합니다.

  4. 게시 요약 페이지에서 게시 를 선택합니다.

    게시가 완료되면 Visual Studio가 웹앱의 URL로 브라우저를 시작합니다.

    업데이트된 ASP.NET Core 3.1 웹앱이 페이지에 표시됩니다.

    Visual Studio - Azure의 업데이트된 ASP.NET Core 3.1 웹앱

  1. Index.cshtml 이 열립니다.

  2. 첫 번째 <div> 요소를 다음 코드로 바꿉니다.

    <div class="jumbotron">
        <h1>.NET 💜 Azure</h1>
        <p class="lead">Example .NET app to Azure App Service.</p>
    </div>
    

    변경 내용을 저장합니다.

  3. Visual Studio Code 사이드바 를 열고 Azure 아이콘을 선택하여 옵션을 확장합니다.

  4. APP SERVICE 노드에서 구독을 확장하고 MyFirstAzureWebApp 을 마우스 오른쪽 단추로 클릭합니다.

  5. 웹 앱에 배포... 를 선택합니다.

  6. 메시지가 나타나면 배포 를 선택합니다.

  7. 게시가 완료되면 알림에서 웹 사이트 찾아보기 를 선택하고 메시지가 나타나면 열기 를 선택합니다.

    업데이트된 ASP.NET Core 3.1 웹앱이 페이지에 표시됩니다.

    Visual Studio Code - Azure의 업데이트된 ASP.NET Core 3.1 웹앱

로컬 디렉터리에서 Index.cshtml 파일을 엽니다. 첫 번째 <div> 요소를 바꿉니다.

<div class="jumbotron">
    <h1>.NET 💜 Azure</h1>
    <p class="lead">Example .NET app to Azure App Service.</p>
</div>

변경 내용을 저장한 다음, az webapp up 명령을 사용하여 앱을 다시 배포합니다.

ASP.NET Core 3.1은 크로스 플랫폼이며, 이전 배포에 따라 <os>linux 또는 windows로 바꿉니다.

az webapp up --os-type <os>

이 명령은 앱 이름, 리소스 그룹 및 App Service 계획을 포함하여 .azure/config 파일에서 로컬로 캐시된 값을 사용합니다.

배포가 완료되면 앱으로 이동 단계에서 열린 브라우저 창으로 다시 전환하고 새로 고침을 누릅니다.

업데이트된 ASP.NET Core 3.1 웹앱이 페이지에 표시됩니다.

CLI - Azure의 업데이트된 ASP.NET Core 3.1 web app

Azure 앱 관리

웹앱을 관리하려면 Azure Portal로 이동하고, App Services 를 검색하여 선택합니다.

Azure Portal - App Services 선택 옵션

App Service 페이지에서 웹앱의 이름을 선택합니다.

Azure Portal - 예제 웹앱이 선택된 App Services 페이지

웹앱의 개요 페이지에는 찾아보기, 중지, 시작, 다시 시작, 삭제와 같은 기본 관리 옵션이 포함되어 있습니다. 왼쪽 메뉴는 앱을 구성하기 위한 추가 페이지를 제공합니다.

Azure Portal - App Service 개요 페이지

리소스 정리

이전 단계에서 Azure 리소스를 리소스 그룹에 만들었습니다. 나중에 이러한 리소스가 필요하지 않은 경우에 리소스 그룹을 삭제하여 삭제할 수 있습니다.

  1. Azure Portal의 웹앱 개요 페이지에서 리소스 그룹 아래에 있는 myResourceGroup 링크를 선택합니다.
  2. 리소스 그룹 페이지에서 나열된 리소스가 삭제하려는 항목인지 확인합니다.
  3. 삭제 를 선택하고, 텍스트 상자에 myResourceGroup 을 입력한 다음, 삭제 를 선택합니다.

리소스 정리

이전 단계에서 Azure 리소스를 리소스 그룹에 만들었습니다. 나중에 이러한 리소스가 필요하지 않은 경우에 리소스 그룹을 삭제하여 삭제할 수 있습니다.

  1. Azure Portal의 웹앱 개요 페이지에서 리소스 그룹 아래에 있는 myResourceGroup 링크를 선택합니다.
  2. 리소스 그룹 페이지에서 나열된 리소스가 삭제하려는 항목인지 확인합니다.
  3. 삭제 를 선택하고, 텍스트 상자에 myResourceGroup 을 입력한 다음, 삭제 를 선택합니다.

리소스 정리

이전 단계에서 Azure 리소스를 리소스 그룹에 만들었습니다. 나중에 이러한 리소스가 필요하지 않을 것 같으면 Cloud Shell에서 다음 명령을 실행하여 리소스 그룹을 삭제합니다.

az group delete --name myResourceGroup

이 명령을 실행하는 데 1분 정도 걸릴 수 있습니다.

다음 단계

이 빠른 시작에서는 ASP.NET 웹앱을 만들고 Azure App Service에 배포했습니다.

다음 문서로 넘어가서 .NET Core 앱을 만들고 SQL Database에 연결하는 방법을 알아보세요.