빠른 시작: Visual Studio Code를 사용하여 Azure Functions 프로젝트 만들기Quickstart: Create an Azure Functions project using Visual Studio Code

이 문서에서는 Visual Studio Code를 사용하여 HTTP 요청에 응답하는 함수를 만듭니다.In this article, you use Visual Studio Code to create a function that responds to HTTP requests. 코드를 로컬로 테스트한 후 Azure Functions의 서버리스 환경에 배포합니다.After testing the code locally, you deploy it to the serverless environment of Azure Functions. 이 빠른 시작을 완료하면 Azure 계정에서 USD 센트 이하의 작은 비용이 발생합니다.Completing this quickstart incurs a small cost of a few USD cents or less in your Azure account.

이 문서의 CLI 기반 버전도 있습니다.There is also a CLI-based version of this article.

환경 구성Configure your environment

시작하기 전에 다음 요구 사항을 갖추었는지 확인합니다.Before you get started, make sure you have the following requirements in place:

  • Node.js, 활성 LTS 및 유지 관리 LTS 버전(10.14.1 권장).Node.js, Active LTS and Maintenance LTS versions (10.14.1 recommended). npm --version 명령을 사용하여 버전을 확인합니다.Use the npm --version command to check your version.

로컬 프로젝트 만들기Create your local project

이 섹션에서는 Visual Studio Code를 사용하여 선택한 언어로 로컬 Azure Functions 프로젝트를 만듭니다.In this section, you use Visual Studio Code to create a local Azure Functions project in your chosen language. 이 문서의 뒷부분에서 함수 코드를 Azure에 게시합니다.Later in this article, you'll publish your function code to Azure.

  1. 작업 막대에서 Azure 아이콘을 선택한 다음, Azure: Functions 영역에서 새 프로젝트 만들기... 아이콘을 선택합니다.Choose the Azure icon in the Activity bar, then in the Azure: Functions area, select the Create new project... icon.

    새 프로젝트 만들기 선택

  2. 프로젝트 작업 영역에 대한 디렉터리 위치를 선택하고 선택을 선택합니다.Choose a directory location for your project workspace and choose Select.

    참고

    다음 단계는 작업 영역 외부에서 완료하도록 설계되었습니다.These steps were designed to be completed outside of a workspace. 이 경우 작업 영역에 포함된 프로젝트 폴더를 선택하지 마십시오.In this case, do not select a project folder that is part of a workspace.

  3. 프롬프트에서 다음 정보를 제공합니다.Provide the following information at the prompts:

    • 함수 프로젝트에 대한 언어 선택: C#을 선택합니다.Select a language for your function project: Choose C#.
    • 함수 프로젝트에 대한 언어 선택: JavaScript을 선택합니다.Select a language for your function project: Choose JavaScript.
    • 함수 프로젝트에 대한 언어 선택: TypeScript을 선택합니다.Select a language for your function project: Choose TypeScript.
    • 함수 프로젝트에 대한 언어 선택: PowerShell을 선택합니다.Select a language for your function project: Choose PowerShell.
    • 함수 프로젝트에 대한 언어 선택: Python을 선택합니다.Select a language for your function project: Choose Python.

    • 가상 환경을 만들기 위한 Python 별칭 선택: Python 인터프리터의 위치를 선택합니다.Select a Python alias to create a virtual environment: Choose the location of your Python interpreter. 위치가 표시되지 않으면 Python 이진에 대한 전체 경로를 입력합니다.If the location isn't shown, type in the full path to your Python binary.

    • 프로젝트의 첫 번째 함수에 대한 템플릿 선택: HTTP trigger을 선택합니다.Select a template for your project's first function: Choose HTTP trigger.

    • 함수 이름 입력: HttpExample.Provide a function name: Type HttpExample.

    • 네임스페이스 입력: My.Functions.Provide a namespace: Type My.Functions.
    • 권한 부여 수준: 누구나 함수 엔드포인트를 호출할 수 있도록 하는 Anonymous를 선택합니다.Authorization level: Choose Anonymous, which enables anyone to call your function endpoint. 권한 부여 수준에 대해 알아보려면 권한 부여 키를 참조하세요.To learn about authorization level, see Authorization keys.

    • 프로젝트를 여는 방법 선택: Add to workspace을 선택합니다.Select how you would like to open your project: Choose Add to workspace.

  4. Visual Studio Code는 이 정보를 사용하여 HTTP 트리거를 통해 Azure Functions 프로젝트를 생성합니다.Using this information, Visual Studio Code generates an Azure Functions project with an HTTP trigger. 탐색기에서 로컬 프로젝트 파일을 볼 수 있습니다.You can view the local project files in the Explorer. 생성된 파일에 대한 자세한 내용은 생성된 프로젝트 파일을 참조하세요.To learn more about files that are created, see Generated project files.

로컬에서 함수 실행Run the function locally

Visual Studio Code는 Azure Functions Core Tools와 통합되어 Azure에 게시하기 전에 로컬 개발 컴퓨터에서 이 프로젝트를 실행할 수 있습니다.Visual Studio Code integrates with Azure Functions Core Tools to let you run this project on your local development computer before you publish to Azure.

  1. 함수를 호출하려면 F5를 눌러 함수 앱 프로젝트를 시작합니다.To call your function, press F5 to start the function app project. 핵심 도구의 출력이 터미널 패널에 표시됩니다.Output from Core Tools is displayed in the Terminal panel.

  2. Azure Functions Core Tools를 아직 설치하지 않은 경우 프롬프트에서 설치를 선택합니다.If you haven't already installed Azure Functions Core Tools, select Install at the prompt. 핵심 도구가 설치되면 터미널 패널에서 앱이 시작됩니다.When the Core Tools are installed, your app starts in the Terminal panel. 로컬에서 실행 중인 HTTP 트리거 함수의 URL 엔드포인트를 볼 수 있습니다.You can see the URL endpoint of your HTTP-triggered function running locally.

    Azure 로컬 출력

  3. Core Tools를 실행 중인 상태에서 다음 URL로 이동하여 ?name=Functions 쿼리 문자열이 포함된 GET 요청을 실행합니다.With Core Tools running, navigate to the following URL to execute a GET request, which includes ?name=Functions query string.

    http://localhost:7071/api/HttpExample?name=Functions

  4. 브라우저에서 다음과 같이 표시되는 응답이 반환됩니다.A response is returned, which looks like the following in a browser:

    브라우저의 localhost 함수 응답

  5. 요청에 대한 정보는 터미널 패널에 표시됩니다.Information about the request is shown in Terminal panel.

    터미널 패널에서 함수 실행

  6. Ctrl + C를 눌러 Core Tools를 중지하고 디버거 연결을 끊습니다.Press Ctrl + C to stop Core Tools and disconnect the debugger.

로컬에서 함수 실행Run the function locally

Azure Functions Core Tools는 Visual Studio Code와 통합되어 사용자가 Azure Functions 프로젝트를 로컬로 실행하고 디버그할 수 있도록 합니다.Azure Functions Core Tools integrates with Visual Studio Code to let you run and debug an Azure Functions project locally. Visual Studio Code에서 디버그하는 방법에 대한 자세한 내용은 PowerShell Azure Functions를 로컬로 디버그를 참조하세요.For details on how to debug in Visual Studio Code, see Debug PowerShell Azure Functions locally.

  1. F5 키를 눌러 함수 앱 프로젝트를 시작합니다.Press F5 to start the function app project. 핵심 도구의 출력이 터미널 패널에 표시됩니다.Output from Core Tools is displayed in the Terminal panel.

  2. 터미널 패널에서 HTTP 트리거 함수의 URL 엔드포인트를 복사합니다.In the Terminal panel, copy the URL endpoint of your HTTP-triggered function.

    Azure 로컬 출력

  3. 쿼리 문자열을 이 URL에 ?name=<yourname>을 추가한 다음, 두 번째 PowerShell 명령 프롬프트에서 Invoke-RestMethod를 사용하여 다음과 같이 요청을 실행합니다.Append the query string ?name=<yourname> to this URL, and then use Invoke-RestMethod in a second PowerShell command prompt to execute the request, as follows:

    PS > Invoke-RestMethod -Method Get -Uri http://localhost:7071/api/HttpTrigger?name=PowerShell
    Hello PowerShell
    

    다음 URL의 브라우저에서 GET 요청을 실행할 수도 있습니다.You can also execute the GET request from a browser from the following URL:

    http://localhost:7071/api/HttpExample?name=PowerShell

    name 매개 변수를 쿼리 매개 변수로 또는 본문에 전달하지 않고 HttpTrigger 엔드포인트을 호출하는 경우 이 함수는 BadRequest 오류를 반환합니다.When you call the HttpTrigger endpoint without passing a name parameter either as a query parameter or in the body, the function returns a BadRequest error. run.ps1의 코드를 검토하면 의도적으로 이 오류가 발생하는 것을 확인할 수 있습니다.When you review the code in run.ps1, you see that this error occurs by design.

  4. 요청에 대한 정보는 터미널 패널에 표시됩니다.Information about the request is shown in Terminal panel.

    터미널 패널에서 함수 실행

  5. 완료되면 Ctrl + C를 눌러 Core Tools를 중지합니다.When done, press Ctrl + C to stop Core Tools.

함수가 로컬 컴퓨터에서 제대로 실행되는지 확인한 후에 해당 프로젝트를 Azure에 게시해야 합니다.After you've verified that the function runs correctly on your local computer, it's time to publish the project to Azure.

함수가 로컬 컴퓨터에서 제대로 실행되는지 확인한 후에 Visual Studio Code를 사용하여 프로젝트를 Azure에 직접 게시합니다.After you've verified that the function runs correctly on your local computer, it's time to use Visual Studio Code to publish the project directly to Azure.

Azure에 로그인Sign in to Azure

앱을 게시하기 전에 Azure에 로그인해야 합니다.Before you can publish your app, you must sign in to Azure.

  1. 아직 로그인하지 않은 경우 작업 막대에서 Azure 아이콘을 선택한 다음, Azure: Functions 영역에서 Azure에 로그인... 을 선택합니다. 계정이 없는 경우 무료 Azure 계정 만들기를 수행할 수 있습니다.If you aren't already signed in, choose the Azure icon in the Activity bar, then in the Azure: Functions area, choose Sign in to Azure.... If you don't already have one, you can Create a free Azure account.

    브라우저의 localhost 함수 응답

    이미 로그인한 경우 다음 섹션으로 이동합니다.If you're already signed in, go to the next section.

  2. 브라우저에 메시지가 표시되면 Azure 계정을 선택하고 Azure 계정 자격 증명을 사용하여 로그인합니다.When prompted in the browser, choose your Azure account and sign in using your Azure account credentials.

  3. 성공적으로 로그인한 후에는 브라우저 창을 닫을 수 있습니다.After you've successfully signed in, you can close the new browser window. Azure 계정에 속하는 구독은 세로 막대에 표시됩니다.The subscriptions that belong to your Azure account are displayed in the Side bar.

Azure에 프로젝트 게시Publish the project to Azure

이 섹션에서는 Azure 구독에서 함수 앱 및 관련 리소스를 만든 다음, 코드를 배포합니다.In this section, you create a function app and related resources in your Azure subscription and then deploy your code.

  1. 작업 막대에서 Azure 아이콘을 선택한 다음, Azure: Functions 영역에서 함수 앱에 배포... 단추를 선택합니다.Choose the Azure icon in the Activity bar, then in the Azure: Functions area, choose the Deploy to function app... button.

    Azure에 프로젝트 게시

  2. 프롬프트에서 다음 정보를 제공합니다.Provide the following information at the prompts:

    • 구독 선택: 사용할 구독을 선택합니다.Select subscription: Choose the subscription to use. 구독이 한 개만 있으면 이 메시지가 표시되지 않습니다.You won't see this if you only have one subscription.

    • Azure에서 함수 앱 선택: + Create new Function App(Advanced 아님)을 선택합니다.Select Function App in Azure: Choose + Create new Function App (not Advanced). 이 문서는 고급 게시 흐름을 지원하지 않습니다.This article doesn't support the advanced publishing flow.

    중요

    기존 함수 앱에 게시하면 Azure에서 해당 앱의 콘텐츠를 덮어씁니다.Publishing to an existing function app overwrites the content of that app in Azure.

    • 함수 앱에 대해 전역적으로 고유 이름을 입력합니다. URL 경로에 유효한 이름을 입력합니다.Enter a globally unique name for the function app: Type a name that is valid in a URL path. 입력한 이름이 Azure Functions에서 고유한지 확인하기 위해 유효성을 검사합니다.The name you type is validated to make sure that it's unique in Azure Functions.
    • 런타임 선택: 로컬에서 실행 중인 Python 버전을 선택합니다.Select a runtime: Choose the version of Python you've been running on locally. python --version 명령을 사용하여 버전을 확인할 수 있습니다.You can use the python --version command to check your version.
    • 런타임 선택: 로컬에서 실행 중인 Node.js 버전을 선택합니다.Select a runtime: Choose the version of Node.js you've been running on locally. node --version 명령을 사용하여 버전을 확인할 수 있습니다.You can use the node --version command to check your version.
    • 새 리소스의 위치 선택: 성능을 향상시키려면 근처에 있는 지역을 선택합니다.Select a location for new resources: For better performance, choose a region near you.
  3. 완료되면 구독에 다음과 같은 Azure 리소스가 생성됩니다.When completed, the following Azure resources are created in your subscription:

    • 리소스 그룹 : 만든 Azure 리소스를 모두 포함합니다.Resource group: Contains all of the created Azure resources. 이름은 함수 앱 이름을 기반으로 합니다.The name is based on your function app name.
    • 스토리지 계정 : 표준 스토리지 계정은 함수 앱 이름을 기반으로 하는 고유한 이름으로 만들어집니다.Storage account: A standard Storage account is created with a unique name that is based on your function app name.
    • 호스팅 계획 : 소비 계획은 서버리스 함수 앱을 호스트할 미국 서부 지역에 생성됩니다.Hosting plan: A consumption plan is created in the West US region to host your serverless function app.
    • 함수 앱: 프로젝트가 이 새 함수 앱에 배포되고 실행됩니다.Function app: Your project is deployed to and runs in this new function app.
    • Application Insights: 함수 앱에 연결된 인스턴스는 함수 이름에 따라 만들어집니다.Application Insights: An instance, which is connected to your function app, is created based on your function name.

    함수 앱을 만들고 배포 패키지가 적용되면 알림이 표시됩니다.A notification is displayed after your function app is created and the deployment package is applied.

  4. 이 알림에서 출력 보기를 선택하여 사용자가 만든 Azure 리소스를 포함한 만들기 및 배포 결과를 표시합니다.Select View Output in this notification to view the creation and deployment results, including the Azure resources that you created. 알림이 누락된 경우 오른쪽 아래 모서리에 있는 종 모양 아이콘을 선택하여 다시 확인합니다.If you miss the notification, select the bell icon in the lower right corner to see it again.

    전체 알림 만들기

Azure에서 함수 실행Run the function in Azure

  1. Azure: Functions 영역으로 돌아가서 구독의 새 함수 앱을 확장합니다.Back in the Azure: Functions area in the side bar, expand the new function app under your subscription. Functions를 확장하고 HttpExample에서 (Windows) 또는 Ctrl + 클릭(MacOS)을 마우스 오른쪽 단추로 클릭한 다음, 함수 URL 복사를 선택합니다.Expand Functions, right-click (Windows) or Ctrl + click (MacOS) on HttpExample, and then choose Copy function URL.

    새 HTTP 트리거에 대한 함수 URL 복사

  2. HTTP 요청에 대한 이 URL을 브라우저의 주소 표시줄에 붙여넣고 name 쿼리 문자열을 이 URL의 끝에 ?name=Functions로 추가한 다음, 요청을 실행합니다.Paste this URL for the HTTP request into your browser's address bar, add the name query string as ?name=Functions to the end of this URL, and then execute the request. HTTP 트리거 함수를 호출하는 URL은 다음 형식이어야 합니다.The URL that calls your HTTP-triggered function should be in the following format:

     http://<functionappname>.azurewebsites.net/api/httpexample?name=Functions 
    

    다음 예제에서는 함수에서 반환된 원격 GET 요청에 대한 브라우저의 응답을 보여 줍니다.The following example shows the response in the browser to the remote GET request returned by the function:

    브라우저의 함수 응답

리소스 정리Clean up resources

다음 단계인 함수에 Azure Storage 큐 바인딩 추가를 계속 진행하는 경우 이미 수행한 작업을 기반으로 모든 리소스를 제자리에 유지해야 합니다.When you continue to the next step, Add an Azure Storage queue binding to your function, you'll need to keep all your resources in place to build on what you've already done.

그렇지 않으면 다음 단계를 수행하여 추가 비용이 발생하지 않도록 함수 앱 및 관련 리소스를 삭제할 수 있습니다.Otherwise, you can use the following steps to delete the function app and its related resources to avoid incurring any further costs.

  1. Visual Studio Code에서 F1 키를 눌러 명령 팔레트를 엽니다.In Visual Studio Code, press F1 to open the command palette. 명령 팔레트에서 Azure Functions: Open in portal을 검색하여 선택합니다.In the command palette, search for and select Azure Functions: Open in portal.

  2. 함수 앱을 선택한 다음, Enter 키를 누릅니다.Choose your function app, and press Enter. 함수 앱 페이지는 Azure Portal에서 열립니다.The function app page is opened in the Azure portal.

  3. 개요 탭에서 리소스 그룹 아래에 있는 명명된 링크를 선택합니다.In the Overview tab, select the named link under Resource group.

    함수 앱 페이지에서 삭제할 리소스 그룹을 선택합니다.

  4. 리소스 그룹 페이지에서 포함된 리소스 목록을 검토하고 삭제하려는 항목인지 확인합니다.In the Resource group page, review the list of included resources, and verify that they are the ones you want to delete.

  5. 리소스 그룹 삭제를 선택하고 지시를 따릅니다.Select Delete resource group, and follow the instructions.

    삭제는 몇 분 정도 소요됩니다.Deletion may take a couple of minutes. 완료되면 알림이 잠시 표시됩니다.When it's done, a notification appears for a few seconds. 페이지 위쪽의 종 모양 아이콘을 선택해도 알림을 확인할 수 있습니다.You can also select the bell icon at the top of the page to view the notification.

함수 비용에 대한 자세한 내용은 소비 계획 비용 예측을 참조하세요.To learn more about Functions costs, see Estimating Consumption plan costs.

다음 단계Next steps

Visual Studio Code를 사용하여 간단한 HTTP 트리거 함수가 있는 함수 앱을 만들었습니다.You have used Visual Studio Code to create a function app with a simple HTTP-triggered function. 다음 문서에서는 출력 바인딩을 추가하여 해당 함수를 확장합니다.In the next article, you expand that function by adding an output binding. 이 바인딩은 HTTP 요청의 문자열을 Azure Queue Storage 큐의 메시지에 씁니다.This binding writes the string from the HTTP request to a message in an Azure Queue Storage queue.