오늘날 정적 웹 사이트를 호스팅하는 가장 인기 있는 플랫폼은 Netlify와 Google App Engine(GAE)입니다.

Netlify는 동일한 플랫폼에서 정적 웹 사이트 구축 및 배포와 통합된 경험을 제공하기 때문에 최근 많은 인기를 얻었습니다.

GAE는 비정적 웹 사이트도 지원한다는 점에서 더 유연하지만 Netlify가 제공하는 통합 수준이 확실히 부족합니다. 그렇다면 많은 경우에 여전히 GAE를 사용하는 이유는 무엇입니까? 답은 간단합니다. GAE는 더 나은 가격 옵션을 자주 제공합니다. 동시에 이 기사에서 설명할 몇 가지 간단한 도구(GitHub Actions 및 Reliza Hub)를 사용하여 Netlify의 모든 기능을 포함할 수 있습니다.

 가격
먼저 GAE + GitHub Actions 콤보가 더 합리적인 가격 책정 시나리오를 다루겠습니다. 요점은 빌드 시간입니다. NetlifyâÃÂÃâ의 프리 티어는 매월 300분의 빌드 시간만 제공하며 이는 어떤 계정에서도 그리 많지 않습니다. 정적으로 만든 node.js 앱과 같은 것을 사용하고 빌드에 평균 2-3분이 소요되는 경우 Netlify에서 한 달에 약 100개 이상의 빌드만 얻을 수 있으며 이는 쉽게 충분하지 않을 수 있습니다. 특히 웹사이트가 두 개 이상인 경우

Netlify에서 더 많은 빌드 시간이 필요한 경우 추가 500분당 $7를 지불하거나 1000분이 포함된 다음 계층으로 이동하지만 비용은 월 $45입니다. 반면에 GitHub Actions에서는 개인 리포지토리에 대해 2000분의 무료 빌드 시간과 공개 리포지토리의 경우 무제한 빌드 시간을 얻을 수 있습니다. 문서 웹 사이트를 구축 중이고 GitHub âÃÂÃÂ에 공개하기로 결정했다고 가정해 보겠습니다. 큰 차이

다음 고려 사항은 교통 비용입니다. Netlify는 관대한 프리 티어에 포함된 월 100GB 대역폭 송신을 제공합니다. Google은 매일 1GB의 이그레스를 무료로 제공하므로 한 달에 약 30GB가 됩니다. 따라서 egress가 30GB에서 100GB 사이인 경우 Netlify에서 더 나은 거래를 얻을 수 있습니다. 그러나 100GB를 넘으면 Netlify는 그 달에 바로 다음 100GB에 대해 20달러를 청구합니다. Google에는 $0.12의 비용이 드는 GB 송신당 가격 책정 정책이 있습니다. Netlify에서 $12/100GB âÃÂÃâ와 $20/100GB를 지불한다는 의미

따라서 트래픽에 따라 Netlify 또는 egress 잠재 고객의 GAE에서 더 나을 수 있습니다. 그러나 많은 경우에 GAE는 여기에서도 더 나은 가치를 제공할 것입니다.
가격 책정에 대한 최종 결정 âÃÂà빌드에 GitHub Actions 또는 CircleCI와 같은 것을 사용하는 경우 여전히 Netlify âÃÂÃâ에 배포할 수 있습니다. GitHub Actions 더 유연한 시스템

 Google App Engine 프로젝트 구성
먼저 httpsconsole.cloud.google.com/appengine으로 이동하여 새 프로젝트를 생성합니다. 이미 있는 경우 âÃÂà먼저 상단에서 프로젝트 이름을 클릭한 다음
**새 프로젝트**

프로젝트 이름을 입력하고 여기에 받을 프로젝트 ID를 기록해 둡니다(나중에 필요함). 제 경우에는 다음과 같습니다.
*âÃÂÃÂevie-landing-tutorialâÃÂÃÂ* âÃÂÃâ를 클릭하고 **CREATE를 클릭한 다음 다음으로 전환합니다. 페이지 상단의 프로젝트 선택기에서 이 프로젝트

클릭
**애플리케이션 생성**하고 원하는 지역을 선택합니다. 그런 다음 정적 애플리케이션의 경우 Python 및 표준 환경을 선택합니다(프리 티어는 표준 환경에만 적용됨). 이 시점에서 귀하의 애플리케이션은 다음 단계를 위한 준비가 되었습니다.

도메인 이름이 이 애플리케이션을 가리키도록 하려면 httpsconsole.cloud.google.com/appengine/settings/domains로 이동하세요.

그리고 클릭
**맞춤 도메인 추가 안내에 따라 도메인의 DNS를 GoogleâÃÂÃÂ에서 제공하는 레코드로 지정합니다. 이 작업이 완료되면 Google은 자동으로 도메인을 이 애플리케이션으로 가리키고 SSL 인증서도 관리합니다.

마지막으로 자동 배포를 담당할 서비스 계정을 준비해야 합니다. httpsconsole.cloud.google.com/iam-admin/serviceaccounts?project=your_project_id로 이동합니다(대체
*your_project_id *실제 프로젝트 ID가 포함된 이 링크에서 제 경우에는 *evie-landing-tutorial이 됩니다. 다음 메뉴 페이지로 이동합니다.
App Engine 기본 서비스 계정 근처의 작업 열에서 점 3개 아이콘을 클릭합니다. 그리고 선택
드롭다운 메뉴의 **키 만들기** 옵션

키 유형으로 JSON을 선택하고 클릭
**CREATE 그러면 .json 파일이 컴퓨터에 다운로드됩니다. 여기서 마지막으로 해야 할 일은 이 파일을 base64 형식으로 인코딩하는 것입니다. 나중에 GitHub Actions로 이동할 때 필요합니다.

이것은 다음과 같이 명령줄을 사용하여 수행할 수 있습니다.
base64 your_json_file.json >키.base64
그런 다음 key.base64 파일에는 base64로 인코딩된 키가 있습니다.

**이 json 및 base64 키 파일을 사용하면 GAE 프로젝트를 제어할 수 있으므로 GitHub Actions에 추가한 후(아래에 표시됨) 파쇄하는 것이 좋습니다. 이 파일을 삭제하십시오. 이것은 다음과 같이 cli에서 수행할 수 있습니다.
key_file_name 파쇄&& rm 키_파일_이름
키를 얻은 후에는 Google App Engine API âÃÂÃÂ를 활성화해야 합니다. httpsconsole.developers.google.com/apis/api/appengine 페이지를 방문하십시오. .googleapis.com/overview를 클릭하고 클릭합니다.
**할 수 있게 하다**

 GitHub 리포지토리 및 GitHub 작업 설정
마지막으로 GitHub 저장소를 준비할 시간입니다. 이 튜토리얼은 Undraw에 의한 Evie 테마 설정을 다룹니다. (이것은 현재 Reliza Hub 랜딩 페이지에 사용하고 있는 테마입니다!) 원래 Evie 테마는 여기에서 호스팅되지만 이 저장소에서 RelizaâÃÂÃÂ의 포크를 사용할 것입니다.

다른 기사에서 이미 언급했듯이 요즘 내 빌드 철학은 모든 것을 도킹하고 사용하는 것입니다.
여러 플랫폼에서 통합 CI 빌드 환경으로 docker 빌드. 따라서 Dockerfile, nginx 구성을 추가하고 원래 Evie 테마와 관련하여 npm 버전을 업데이트하여 도커화된 빌드가 작동하도록 했습니다.

이제 우리가
RelizaâÃÂÃÂs Evie 리포지토리 콘텐츠에 대한 docker 빌드 명령, 포트 80에 대한 문서 없이 Evie 테마를 제공하는 nginx 기반 이미지를 빌드합니다.

이제 GitHub Actions 스크립트를 준비할 차례입니다. 우리는 전체 프로세스를 간단하게 만드는 actions-hub/gcloud@master 작업을 사용할 것입니다.

작업에 필요한 2개의 GitHub Actions 암호를 설정하는 것으로 시작합니다. 설정 ->GitHub 리포지토리 내부의 비밀로 이동하고 클릭합니다.
다음 2가지 비밀을 설정할 **새 비밀**:
- GCLOUD_PROJECT_ID âÃÂÃâ 프로젝트를 생성할 때 기록된 프로젝트 ID로 설정: 제 경우에는 evie-landing-tutorial

- GOOGLE_APPLICATION_CREDENTIALS âÃÂà위의 Google 서비스 계정에 대해 얻은 base64 인코딩 json-key 파일의 콘텐츠로 설정

이제 저장소에서 .github 디렉토리를 생성한 다음 그 안에 workflows 디렉토리를 생성합니다. 그리고 그 안에 gae_build.yml을 만듭니다. 또한 GAE 구성이 포함된 app.yaml 파일을 추가해야 하며 내가 가지고 있는 정적 앱 사용 사례에 대해 매우 간단합니다.

이 코드를 푸시하면 GitHub Actions 빌드가 트리거되어 GAE 애플리케이션에 배포되고 서비스가 활성화됩니다! GitHub에 대한 모든 후속 푸시는 자동으로 새로운 GitHub Actions 빌드를 트리거하고 GAE에서 애플리케이션을 자동으로 업데이트합니다.

이제 정적 웹 사이트를 위한 기본 CICD 파이프라인이 준비되었습니다! 여기에서 중지하거나 Reliza Hub를 사용하여 승인 및 배포 가시성 기능을 추가하는 방법을 계속 읽을 수 있습니다.

 보너스: Reliza Hub를 사용하여 승인 및 가시성 추가

모든 새 빌드가 자동으로 프로덕션으로 이동하는 것을 원하지 않는다고 가정합니다. 대신 프로덕션이 아닌 다른 곳에 먼저 배포한 다음 마음에 들면 귀하 또는 귀하의 승인자(예: 마케팅 관리자)가 버튼을 클릭하고 프로덕션으로 승격  지금까지 설명한 구성 위에 Reliza Hub를 사용하여 이를 달성할 수 있는 방법은 다음과 같습니다.   1 âÃÂÃâ Reliza Hub에 대한 스트리밍 릴리스 메타데이터 먼저 httpsapp.relizahub.com으로 이동하여 GitHub로 인증하고 조직을 만듭니다. 제 경우에는 *âÃÂÃÂEvie Landing TutorialâÃÂÃÂ* 조직 이름으로. **VCS** 메뉴 항목을 클릭한 다음 더하기 원 아이콘을 클릭하여 VCS 저장소를 추가합니다.  GitHub 리포지토리 URI를 입력에 붙여넣으면 Reliza Hub가 자동으로 구문 분석합니다.  딸깍 하는 소리 **제출하면 리포지토리가 생성됩니다. 프로젝트 메뉴로 이동하여 더하기 원 아이콘을 클릭하여 프로젝트를 생성합니다. 프로젝트 이름을 입력합니다(*Evie Landing Set 버전 스키마를 Single Component(Major) âÃÂÃÂ에 사용합니다. 이는 GAE가 하나의 구성 요소로 구성된 자체 버전 관리를 사용하기 때문입니다 âà ÂàReliza Hub 내부에서 그대로 사용할 것입니다. 이전 단계에서 방금 생성한 VCS 저장소를 선택합니다.  그리고 클릭 **제출 새 프로젝트를 생성합니다. 그런 다음 이 새로 생성된 프로젝트 이름을 클릭하고 잠금 아이콘을 클릭하여 프로젝트 API 키를 생성합니다.  프로젝트에 대해 생성된 API ID 및 API 키가 표시되면 해당 값을 사용하여 GitHub Actions âÃÂàRELIZA_API_PROJECT_ID 및 RELIZA_API_PROJECT_KEY에 2개의 새 암호를 만듭니다.  이제 gae_build.yml 스크립트를 업데이트하여 빌드 세부 정보를 Reliza로 스트리밍하고 승격 금지 모드로 전환할 차례입니다. 즉, 모든 git push에서 GAE에 배포가 생성되지만 Google은 나중에 몇 가지 수동 단계를 수행할 때까지 이 새 배포로 트래픽을 전환하지 않습니다.  업데이트된 스크립트에는 Reliza Hub에 대한 빌드 시간 추적 보고가 포함되며 GAE에서 승격되지 않은 각 배포의 URI도 포함됩니다. Reliza Go Client의 GitHub 저장소에서 사용하는 다양한 플래그에 대한 설명을 찾을 수 있습니다.  푸시 완료 시 GitHub Actions 실행 후 Reliza Hub에서 릴리스 페이지로 이동하여 다음 그림을 볼 수 있습니다.  를 클릭하면 **테스트 엔드포인트** 링크는 이 소스 코드 항목 âÃÂÃâ에 해당하지만 아직 트래픽을 제공하도록 승격되지 않은 GAE의 실제 배포 버전으로 연결됩니다.  여기 가이드에 따라 슬랙 통합을 추가하여 Reliza Hub의 모든 새 릴리스에 대한 알림을 받을 수도 있습니다.   2 승인 추가 Reliza Hub의 설정 페이지로 이동하여 하단에서 프로덕션 환경에 대한 승인 매트릭스를 구성합니다. 제 경우에는 릴리스가 프로덕션으로 승격되려면 MARKETING의 승인만 필요합니다. 다음과 같이:  클릭 **매트릭스 저장**  다음으로 Reliza GitHub 앱 âÃÂàhttpsgithub.com/apps/reliza-hub âÃÂÃÂ를 설치하고 튜토리얼 IâÃÂ를 따릅니다. à이전에 작성하여 프로젝트에 등록  마지막으로, Reliza Hub의 승인 시 트리거되는 새로운 GitHub Actions 워크플로는 여기에서 확인할 수 있습니다. 기본적으로 이 워크플로는 Reliza Hub에 가장 최근의 프로덕션 승인 버전을 쿼리한 다음 트래픽을 해당 버전으로 전환하도록 Google App Engine에 요청합니다.  이 스크립트에서 구성이 필요한 유일한 것은 Reliza Hub의 프로젝트 페이지에서 얻은 프로젝트 UUID로 설정해야 하는 RELIZA_PROJECT_ID 환경 변수 âÃÂÃÂ입니다.  이제 MARKETING의 승인을 받은 최신 프로젝트 릴리스는 Google App Engine 측에서 자동으로 승격됩니다.승인자를 조직에 추가하는 방법에 대한 자세한 내용은 승인에 대한 튜토리얼 비디오를 시청하십시오.   3 언제 배포되는지에 대한 가시성 추가 마지막으로 Reliza Hub에 실제로 어떤 릴리스가 배포되고 언제 배포되는지에 대한 가시성을 추가하고자 합니다.  이렇게 하려면 먼저 Reliza Hub의 인스턴스로 이동하고 더하기 원 아이콘을 클릭하여 새 인스턴스를 생성합니다.  그런 다음 내 인스턴스의 URI를 입력하고 이 정적 웹 사이트에만 프로덕션 환경이 있으므로 환경을 PRODUCTION âÃÂÃâ로 선택합니다. 클릭 **제출**은 새 인스턴스를 생성합니다.  다음으로 새로 생성된 이 인스턴스를 선택하고 잠금 아이콘을 클릭하여 API 키를 생성합니다.  API ID 및 API 키가 생성되면 GitHub Actions âÃÂàRELIZA_API_INSTANCE_ID 및 RELIZA_API_INSTANCE_KEY 에 해당 값으로 2개의 새 암호를 생성합니다.  이를 통해 먼저 승인 중 배포 스크립트를 업데이트하여 GAE에서 배포를 확인하고 Reliza Hub로 스트리밍하는 섹션을 추가합니다. 또한 GAE 애플리케이션의 상태를 확인하기 위해 cron GitHub Actions 워크플로를 추가합니다.  이 워크플로가 실행된 후 인스턴스 보기에서 Reliza Hub의 GAE 애플리케이션 배포 스냅샷을 다음과 같이 가져옵니다.   요약 이제 GAE에 배포되는 GitHub Actions와 Reliza Hub에서 관리하는 승인 및 가시성이 포함된 전체 푸시 버튼 CI CD 파이프라인이 있습니다. 또한 Slack 알림과 마케팅 관리자가 변경 사항을 보고 버튼을 눌러 기술 직원에게 요청하지 않고 프로덕션으로 승격하도록 할 수 있습니다. 얼마나 멋진가요?
나와 대화하고 이 워크플로 또는 다른 워크플로에 대해 더 논의하고 싶다면 âÃÂÃâ 조건 없이 30분 Reliza Hub 데모 통화를 예약하세요 âàà최선을 다해 도와드리겠습니다.