【초보자용】Azure로 서버리스인 간이 Web 어플리케이션을 만드는 핸즈온

Microsoft Azure에서 간단한 서버리스 웹 애플리케이션을 만드는 핸즈온을 만들었습니다.

이 핸즈온으로 배울 수 있는 것

초보자용입니다.
이 핸즈온에서는 Azure Functions로 간이 REST API를 만들어(프록시 기능을 이용), Vue.js 베이스로 간단하게 만든 페이지를 Blob Storage의 정적 웹 사이트 호스팅 기능으로 공개해 API와 연결하는 것으로 간편하게 Web 앱이 할 수 있는 것을 경험할 수 있습니다.

Azure Functions와 Cosmos DB의 연계(입출력 바인드)

데이터스토어는 Cosmos DB를 사용하며, Functions와의 연계의 간편함도 체험할 수 있습니다.

Azure Functions는 Azure의 FaaS(Function as a Service)이지만 Azure 포털에서 간편하게 코딩하거나 풍부한 트리거 및 입출력 바인딩 기능으로 Azure 내외의 다른 서비스와의 연계를 간단하게 할 수 있습니다.
이 핸즈온에서는 Cosmos DB에의 CRUD를, 입출력 바인드의 기능을 이용하는 것으로, 번거로운 설정이나 복잡한 코딩 없이 직관적으로 간단하게 실시할 수 있는 것을 체험합니다.

참고 : Azure Functions 2.x의 Azure Cosmos DB 바인딩

Blob Storage로 정적 웹 사이트 게시

Azure Blob Storage를 사용하면 놀랍도록 쉽게 정적 웹 사이트를 게시할 수 있습니다.
이 핸즈온을 사용하면 HTML 및 JavaScript 파일을 스토리지에 배치하고 Functions에서 만든 REST API에 액세스하여 서버리스 웹 애플리케이션을 만들 수 있습니다.

참고 : Azure Storage의 정적 웹 사이트 호스팅

소요시간

대체로 1시간 정도로 할 수 있을까 생각합니다.

핸즈온의 존재

절차와 사용하는 코드는 GitHub에 게시됩니다.



※↑의 화상은 htps // gh ㎃ k 또는 rd. 코m/ 로 작성했습니다

핸즈온 내용

본 핸즈온은 다음 단계에서 실시합니다.

STEP1 Azure Cosmos DB 계정 컨테이너 생성

STEP2 Azure Functions에서 API 만들기

STEP3 Azure Blob Storage의 정적 웹 사이트 호스팅

사전에 준비가 필요한 것

Chrome, Firefox, Edge와 같은 주요 현대 브라우저가 실행되는 PC 또는 Mac

유효한 Azure 계정 및 구독

주의점

작성하는 앱은 인증등을 특별히 실시하지 않으므로, 어디까지나 학습용 교재로서 사용해 주세요.

Function App, 웹 화면용 소스 코드는 (거의) 완성된 것을 사용합니다.

모든 핸즈온이 끝나면 리소스를 삭제합시다. 특히 Cosmos DB는 방치해 두면 많은 과금이 발생해 버립니다.

뭔가 이상한 곳이나 이해하기 어려운 부분이 있으면, 코멘트 나 풀릭 주시면 대응하므로 알려주십시오.