로드 중...
검색 결과가 없습니다.

Google Cloud 콘솔에서 기술 적용

10

Firebase로 서버리스 앱 개발

700개 이상의 실습 및 과정 이용하기

Firebase로 서버리스 앱 개발: 챌린지 실습

실습 1시간 universal_currency_alt 크레딧 5개 show_chart 중급
info 이 실습에는 학습을 지원하는 AI 도구가 통합되어 있을 수 있습니다.
700개 이상의 실습 및 과정 이용하기

GSP344

Google Cloud 사용자 주도형 실습 로고

개요

챌린지 실습에서는 특정 시나리오와 일련의 작업이 주어집니다. 단계별 안내를 따르는 대신, 과정의 실습에서 배운 기술을 사용하여 스스로 작업을 완료하는 방법을 알아내 보세요. 이 페이지에 표시되어 있는 자동 채점 시스템에서 작업을 올바르게 완료했는지 피드백을 제공합니다.

챌린지 실습을 진행할 때는 새로운 Google Cloud 개념에 대한 정보가 제공되지 않습니다. 학습한 기술을 응용하여 기본값을 변경하거나 오류 메시지를 읽고 조사하여 실수를 바로잡아야 합니다.

100점을 받으려면 시간 내에 모든 작업을 성공적으로 완료해야 합니다.

이 실습은 Firebase로 서버리스 앱 개발 과정에 등록한 수강생에게 권장됩니다. 챌린지에 도전할 준비가 되셨나요?

설정 및 요건

실습 시작 버튼을 클릭하기 전에

다음 안내를 확인하세요. 실습에는 시간 제한이 있으며 일시중지할 수 없습니다. 실습 시작을 클릭하면 타이머가 시작됩니다. 이 타이머는 Google Cloud 리소스를 사용할 수 있는 시간이 얼마나 남았는지를 표시합니다.

실무형 실습을 통해 시뮬레이션이나 데모 환경이 아닌 실제 클라우드 환경에서 실습 활동을 진행할 수 있습니다. 실습 시간 동안 Google Cloud에 로그인하고 액세스하는 데 사용할 수 있는 새로운 임시 사용자 인증 정보가 제공됩니다.

이 실습을 완료하려면 다음을 준비해야 합니다.

  • 표준 인터넷 브라우저 액세스 권한(Chrome 브라우저 권장)
참고: 이 실습을 실행하려면 시크릿 모드(권장) 또는 시크릿 브라우저 창을 사용하세요. 개인 계정과 학습자 계정 간의 충돌로 개인 계정에 추가 요금이 발생하는 일을 방지해 줍니다.
  • 실습을 완료하기에 충분한 시간(실습을 시작하고 나면 일시중지할 수 없음)
참고: 이 실습에는 학습자 계정만 사용하세요. 다른 Google Cloud 계정을 사용하는 경우 해당 계정에 비용이 청구될 수 있습니다.

환경 프로비저닝하기

  1. 프로젝트에 연결합니다.
gcloud config set project $(gcloud projects list --format='value(PROJECT_ID)' --filter='qwiklabs-gcp')
  1. 저장소를 클론합니다.
git clone https://github.com/rosera/pet-theory.git

챌린지 시나리오

이 실습에서는 REST API 및 Firestore 데이터베이스를 사용하여 프런트엔드 솔루션을 만듭니다. Cloud Firestore는 NoSQL 문서 데이터베이스로서 규모에 맞춰 모바일 및 웹 앱용 데이터를 저장, 동기화, 쿼리할 수 있는 Firebase 플랫폼에 포함되어 있습니다. 실습 콘텐츠는 Google Cloud 서버리스 인프라를 활용해 과제를 해결한 실제 사례를 바탕으로 하며

다음 아키텍처를 빌드하게 됩니다.

애플리케이션 아키텍처 다이어그램

작업 1. Firestore 데이터베이스 만들기

이 시나리오에서는 Google Cloud에서 Firestore 데이터베이스를 만듭니다. 아래의 대략적인 아키텍처 다이어그램에는 일반적 아키텍처가 요약되어 있습니다.

Firebase 챌린지 실습 아키텍처 다이어그램

요구사항:

필드
Cloud Firestore 기본 모드
위치

Firestore 데이터베이스 만들기

이 섹션을 성공적으로 완료하려면 다음을 구현해야 합니다.

  • Cloud Firestore 데이터베이스
  • Firestore 기본 모드 사용
  • 위치 추가

내 진행 상황 확인하기를 클릭하여 위 작업을 수행했는지 확인합니다. Firestore 데이터베이스 만들기

작업 2. 데이터베이스 채우기

이 시나리오에서는 테스트 데이터를 사용하여 데이터베이스를 채웁니다.

아래의 대략적인 아키텍처 다이어그램에는 일반적 아키텍처가 요약되어 있습니다.

Firebase 챌린지 실습 아키텍처

데이터베이스 채우기

Firestore 스키마 예시:

컬렉션 문서 필드
데이터 70234439 [데이터 세트]

Netflix 프로그램 데이터 세트에 포함된 정보는 다음과 같습니다.

필드 설명
show_id: 모든 영화/TV 프로그램의 고유 ID
type: 식별자 - 영화 또는 TV 프로그램
title: 영화/TV 프로그램의 제목
director: 영화의 감독
cast: 영화/프로그램에 출연한 배우
country: 영화/프로그램이 제작된 국가
date_added: Netflix에 추가된 날짜
release_year: 영화/프로그램의 실제 출시 연도
rating: 영화/프로그램의 등급
duration: 전체 시간 - 분 단위 또는 시즌 수

이 섹션을 완료하려면 다음 작업을 구현해야 합니다.

  1. pet-theory/lab06/firebase-import-csv/solution의 샘플 코드를 사용합니다.
npm install
  1. CSV를 가져오려면 pet-theory/lab06/firebase-import-csv/solution/index.js 노드를 사용합니다.
node index.js netflix_titles_original.csv 참고: Firestore UI에서 데이터를 확인하여 Firestore 데이터베이스가 업데이트되었는지 확인합니다.

내 진행 상황 확인하기를 클릭하여 위 작업을 수행했는지 확인합니다. Firestore 데이터베이스 채우기

작업 3. REST API 만들기

이 시나리오에서는 REST API 예시를 만듭니다.

아래의 대략적인 아키텍처 다이어그램에는 일반적 아키텍처가 요약되어 있습니다.

Firebase 챌린지 실습 아키텍처 다이어그램

Cloud Run 개발

필드
Container Registry 이미지 rest-api:0.1
Cloud Run 서비스 netflix-dataset-service
권한 --allow-unauthenticated

이 섹션을 완료하려면 다음 작업을 구현해야 합니다.

  1. pet-theory/lab06/firebase-rest-api/solution-01에 액세스합니다.
  2. 코드를 Google Container Registry에 빌드하고 배포합니다.
  3. 이미지를 Cloud Run 서비스로 배포합니다.
참고: 최대 1개의 인스턴스를 사용하여 서비스를 배포해야 Cloud Run 인스턴스의 최대 한도를 초과하지 않습니다.
  1. Cloud Run으로 이동하여 netflix-dataset-service를 클릭한 후 서비스 URL을 복사합니다.
  • SERVICE_URL을 위해 netflix-dataset-service에서 URL을 복사합니다.
  • curl -X GET $SERVICE_URL이 {"status":"Netflix Dataset! Make a query."}로 응답해야 합니다.

내 진행 상황 확인하기를 클릭하여 위 작업을 수행했는지 확인합니다. REST API 배포하고 테스트하기

작업 4. Firestore API 액세스

이 시나리오에서는 코드의 업데이트된 버전을 배포하여 Firestore DB에 액세스합니다.

아래의 대략적인 아키텍처 다이어그램에는 일반적 아키텍처가 요약되어 있습니다.

Firebase 챌린지 실습 아키텍처 다이어그램

Cloud Run 버전 0.2 배포하기

필드
Container Registry 이미지 rest-api:0.2
Cloud Run 서비스 netflix-dataset-service
권한 --allow-unauthenticated

이 섹션을 완료하려면 다음 작업을 구현해야 합니다.

  1. pet-theory/lab06/firebase-rest-api/solution-02에 액세스합니다.
  2. 업데이트된 애플리케이션을 빌드합니다.
  3. Cloud Build를 사용하여 이미지 버전을 Container Registry에 태그하고 배포합니다.
  4. 새 이미지를 Cloud Run 서비스로 배포합니다.
참고: 최대 1개의 인스턴스를 사용하여 서비스를 배포해야 Cloud Run 인스턴스의 최대 한도를 초과하지 않습니다.
  1. Cloud Run으로 이동하여 netflix-dataset-service를 클릭한 후 서비스 URL을 복사합니다.
  • SERVICE_URL을 위해 netflix-dataset-service에서 URL을 복사합니다.
  • curl -X GET $SERVICE_URL/2019이 JSON 데이터 세트로 응답해야 합니다.

내 진행 상황 확인하기를 클릭하여 위 작업을 수행했는지 확인합니다. REST API 배포하고 테스트하기

작업 5. 스테이징 프런트엔드 배포

이 시나리오에서는 스테이징 프런트엔드를 배포합니다.

아래의 대략적인 아키텍처 다이어그램에는 일반적 아키텍처가 요약되어 있습니다.

Firebase 챌린지 실습 아키텍처 다이어그램

프런트엔드 배포하기

필드
REST_API_SERVICE REST API 서비스 URL
Container Registry 이미지 frontend-staging:0.1
Cloud Run 서비스 frontend-staging-service

이 섹션을 완료하려면 다음 작업을 구현해야 합니다.

  1. pet-theory/lab06/firebase-frontend에 액세스합니다.
  2. 프런트엔드 스테이징 애플리케이션을 빌드합니다.
  3. Cloud Build를 사용하여 이미지 버전을 Container Registry에 태그하고 배포합니다.
  4. 새 이미지를 Cloud Run 서비스로 배포합니다.
참고: 최대 1개의 인스턴스를 사용하여 서비스를 배포해야 Cloud Run 인스턴스의 최대 한도를 초과하지 않습니다.
  1. 프런트엔드를 통해 REST API 및 Firestore 데이터베이스에 액세스합니다.
  2. 프런트엔드 서비스 URL에 액세스합니다.
참고: 여기에서는 화면의 항목을 보여주기 위해 데모 데이터 세트를 사용하고 있습니다.

서버리스 웹페이지 소개

내 진행 상황 확인하기를 클릭하여 위 작업을 수행했는지 확인합니다. 스테이징 프런트엔드 배포하기

작업 6. 프로덕션 프런트엔드 배포하기

이 시나리오에서는 스테이징 프런트엔드를 업데이트하여 Firestore 데이터베이스를 사용합니다.

아래의 대략적인 아키텍처 다이어그램에는 일반적 아키텍처가 요약되어 있습니다.

Firebase 챌린지 실습 아키텍처 다이어그램

프런트엔드 배포하기

필드
REST_API_SERVICE REST API 서비스 URL
Container Registry 이미지 frontend-production:0.1
Cloud Run 서비스 frontend-production-service

이 섹션을 완료하려면 다음 작업을 구현해야 합니다.

  1. pet-theory/lab06/firebase-frontend/public에 액세스합니다.
  2. 프런트엔드 애플리케이션(예: app.js)을 업데이트하여 REST API를 사용합니다.
  3. SERVICE_URL에 연도를 추가하는 것을 잊지 마세요.
  4. Cloud Build를 사용하여 이미지 버전을 Container Registry에 태그하고 배포합니다.
  5. 새 이미지를 Cloud Run 서비스로 배포합니다. 참고: 최대 1개의 인스턴스를 사용하여 서비스를 배포해야 Cloud Run 인스턴스의 최대 한도를 초과하지 않습니다.
  6. 프런트엔드를 통해 REST API 및 Firestore 데이터베이스에 액세스합니다.

이제 서비스가 배포되었으므로 Firestore 데이터베이스의 콘텐츠를 프런트엔드 서비스를 사용하여 볼 수 있습니다.

서버리스 웹페이지 소개

내 진행 상황 확인하기를 클릭하여 위 작업을 수행했는지 확인합니다. 프로덕션 프런트엔드 배포하기

수고하셨습니다

수고하셨습니다. 이 실습에서는 Firestore 데이터베이스를 만들고, DB를 데이터로 채우고, REST API를 만들고, Firestore 데이터베이스 및 REST API와 상호작용하는 프런트엔드 애플리케이션을 배포했습니다. 또한 스테이징 및 프로덕션 프런트엔드 애플리케이션을 배포하는 방법도 배웠습니다.

Develop Serverless Apps with Firebase 기술 배지

다음 기술 배지 획득

이 사용자 주도형 실습은 Develop Serverless Apps with Firebase 기술 배지 과정의 일부입니다. 이 기술 배지 과정을 완료하면 위의 배지를 획득하여 수료를 인증할 수 있습니다. 이력서 및 소셜 플랫폼에 배지를 공유하고 #GoogleCloudBadge 해시태그를 사용해 스스로 달성한 업적을 널리 알리세요.

Google Cloud 교육 및 자격증

Google Cloud 기술을 최대한 활용하는 데 도움이 됩니다. Google 강의에는 빠른 습득과 지속적인 학습을 지원하는 기술적인 지식과 권장사항이 포함되어 있습니다. 기초에서 고급까지 수준별 학습을 제공하며 바쁜 일정에 알맞은 주문형, 실시간, 가상 옵션이 포함되어 있습니다. 인증은 Google Cloud 기술에 대한 역량과 전문성을 검증하고 입증하는 데 도움이 됩니다.

설명서 최종 업데이트: 2024년 5월 2일

실습 최종 테스트: 2024년 5월 2일

Copyright 2025 Google LLC. All rights reserved. Google 및 Google 로고는 Google LLC의 상표입니다. 기타 모든 회사명 및 제품명은 해당 업체의 상표일 수 있습니다.

이전 다음

시작하기 전에

  1. 실습에서는 정해진 기간 동안 Google Cloud 프로젝트와 리소스를 만듭니다.
  2. 실습에는 시간 제한이 있으며 일시중지 기능이 없습니다. 실습을 종료하면 처음부터 다시 시작해야 합니다.
  3. 화면 왼쪽 상단에서 실습 시작을 클릭하여 시작합니다.

시크릿 브라우징 사용

  1. 실습에 입력한 사용자 이름비밀번호를 복사합니다.
  2. 비공개 모드에서 콘솔 열기를 클릭합니다.

콘솔에 로그인

    실습 사용자 인증 정보를 사용하여
  1. 로그인합니다. 다른 사용자 인증 정보를 사용하면 오류가 발생하거나 요금이 부과될 수 있습니다.
  2. 약관에 동의하고 리소스 복구 페이지를 건너뜁니다.
  3. 실습을 완료했거나 다시 시작하려고 하는 경우가 아니면 실습 종료를 클릭하지 마세요. 이 버튼을 클릭하면 작업 내용이 지워지고 프로젝트가 삭제됩니다.

현재 이 콘텐츠를 이용할 수 없습니다

이용할 수 있게 되면 이메일로 알려드리겠습니다.

감사합니다

이용할 수 있게 되면 이메일로 알려드리겠습니다.

한 번에 실습 1개만 가능

모든 기존 실습을 종료하고 이 실습을 시작할지 확인하세요.

시크릿 브라우징을 사용하여 실습 실행하기

이 실습을 실행하려면 시크릿 모드 또는 시크릿 브라우저 창을 사용하세요. 개인 계정과 학생 계정 간의 충돌로 개인 계정에 추가 요금이 발생하는 일을 방지해 줍니다.
미리보기