풀스택 Amplify 1세대 앱을 사용한 팀 워크플로 - AWS Amplify 호스팅

기계 번역으로 제공되는 번역입니다. 제공된 번역과 원본 영어의 내용이 상충하는 경우에는 영어 버전이 우선합니다.

풀스택 Amplify 1세대 앱을 사용한 팀 워크플로

기능 브랜치 배포는 프런트엔드와 선택적 백엔드 환경으로 구성됩니다. 프런트엔드는 빌드된 후 글로벌 콘텐츠 배포 네트워크(CDN)에 배포되지만, 백엔드는 Amplify Studio 또는 Amplify CLI에 의해 AWS에 배포됩니다. 이 배포 시나리오를 설정하는 방법을 알아보려면 을 참조하십시오애플리케이션을 위한 백엔드 구축.

Amplify Hosting은 기능 브랜치 배포와 함께 GraphQL API 및 Lambda 함수와 같은 백엔드 리소스를 지속적으로 배포할 수 있습니다. 다음 브랜칭 모델을 사용하여 Amplify Hosting으로 백엔드 및 프런트엔드를 배포할 수 있습니다.

기능 브랜치 워크플로

  • Amplify Studio 또는 Amplify CLI로 prod, 테스트dev 백엔드 환경을 생성합니다.

  • prod 백엔드를 기본 브랜치에 매핑하십시오.

  • 테스트 백엔드를 개발 브랜치에 매핑합니다.

  • 팀 구성원은 dev 백엔드 환경을 사용하여 개별 기능 브랜치를 테스트할 수 있습니다.

백엔드 환경에서 프런트엔드 브랜치까지의 관계를 매핑하는 방법을 보여주는 다이어그램입니다.
  1. Amplify CLI를 설치하여 새 Amplify 프로젝트를 초기화합니다.

    npm install -g @aws-amplify/cli
  2. 프로젝트에 대해 prod 백엔드 환경을 초기화합니다. 프로젝트가 없다면, Gatsby와 같은 create-react-app 부트스트랩 도구를 사용하여 프로젝트를 만드세요.

    create-react-app next-unicorn cd next-unicorn amplify init ? Do you want to use an existing environment? (Y/n): n ? Enter a name for the environment: prod ... amplify push
  3. 테스트dev 백엔드 환경을 추가합니다.

    amplify env add ? Do you want to use an existing environment? (Y/n): n ? Enter a name for the environment: test ... amplify push amplify env add ? Do you want to use an existing environment? (Y/n): n ? Enter a name for the environment: dev ... amplify push
  4. 선택한 Git 리포지토리로 코드를 푸시합니다(이 예에서는 사용자가 기본에 푸시한 것으로 가정함).

    git commit -am 'Added dev, test, and prod environments' git push origin main
  5. 현재 백엔드 환경을 AWS Management Console 보려면 Amplify를 방문하십시오. 탐색 경로에서 한 단계 위로 이동하면 백엔드 환경 탭에서 생성된 모든 백엔드 환경 목록을 볼 수 있습니다.

    Amplify 앱과 관련된 모든 백엔드 환경을 보여주는 Amplify 콘솔의 스크린샷입니다.
  6. 프런트엔드 환경 탭으로 전환하여 리포지토리 제공자와 기본 브랜치를 연결하십시오.

  7. 빌드 설정 화면에서 기존 백엔드 환경을 선택하여 메인 브랜치를 통한 지속적 배포를 설정합니다. 드롭다운에서 prod를 선택하고 Amplify에 서비스 역할을 부여합니다. 저장 및 배포를 선택합니다. 빌드가 완료된 후 https://main.appid.amplifyapp.com에서 사용 가능한 기본 브랜치 배포를 받게 됩니다.

    Amplify 콘솔 빌드 설정 구성 페이지의 스크린샷으로, 프런트엔드 환경에 배포할 백엔드 환경을 선택할 위치를 보여 줍니다.
  8. Amplify에서 개발 브랜치를 연결합니다(이 시점에 개발기본 브랜치가 동일한 것으로 가정함). test 백엔드 환경을 선택합니다.

    Amplify 콘솔 리포지토리 분기 추가 페이지의 스크린샷으로, 브랜치와 함께 배포할 백엔드 환경을 선택할 위치를 보여 줍니다.
  9. 이제 Amplify가 설정되었습니다. 기능 브랜치에서 새 기능에 대한 작업을 시작할 수 있습니다. 로컬 워크스테이션에서 dev 백엔드 환경을 사용하여 백엔드 기능을 추가합니다.

    git checkout -b newinternet amplify env checkout dev amplify add api ... amplify push
  10. 기능에 대한 작업을 종료한 후 코드를 커밋하고 풀 요청을 생성하여 내부적으로 검토합니다.

    git commit -am 'Decentralized internet v0.1' git push origin newinternet
  11. 표시될 변경 사항을 미리 보려면 Amplify 콘솔로 이동하여 기능 브랜치를 연결합니다. 참고: Amplify CLI가 아닌 시스템에 AWS CLI 설치되어 있는 경우 터미널에서 직접 브랜치를 연결할 수 있습니다. 애플리케이션 설정 > 일반 > AppARN: arn:aws:amplify:<region>:<region>:apps/<appid>으로 이동하여 appid를 찾아볼 수 있습니다.

    aws amplify create-branch --app-id <appid> --branch-name <branchname> aws amplify start-job --app-id <appid> --branch-name <branchname> --job-type RELEASE
  12. https://newinternet.appid.amplifyapp.com에 액세스하여 기능을 팀 메이트와 공유할 수 있습니다. 모든 것이 순조로워 보이면 PR을 개발 브랜치에 병합합니다.

    git checkout develop git merge newinternet git push
  13. 이렇게 하면 https://dev.appid.amplifyapp.com에서 브랜치 배포와 함께 Amplify에서 프런트엔드와 백엔드를 업데이트할 빌드가 시작됩니다. 내부 이해관계자가 새 기능을 검토할 수 있도록 이 링크를 내부 이해관계자와 공유할 수 있습니다.

  14. Git, Amplify에서 기능 브랜치를 삭제하고, 클라우드에서 백엔드 환경을 제거합니다(언제든지 'amplify env checkout prod' 및 'amplify env add'를 실행하여 새 백엔드 환경을 생성할 수 있음).

    git push origin --delete newinternet aws amplify delete-branch --app-id <appid> --branch-name <branchname> amplify env remove dev

GitFlow 워크플로우

GitFlow 두 개의 브랜치를 사용하여 프로젝트 기록을 기록합니다. 기본 브랜치는 릴리스 코드만 추적하고 개발 브랜치는 새 기능의 통합 브랜치로 사용됩니다. GitFlow 완료된 작업에서 새 개발을 분리하여 병렬 개발을 간소화합니다. 새로운 개발(예: 기능 및 비정기적인 버그 수정)은 기능 브랜치에서 수행됩니다. 개발자가 코드를 릴리스할 준비가 완료되면 기능 브랜치는 통합 개발 브랜치로 병합됩니다. 기본 브랜치에 대한 커밋만 릴리스 브랜치와 핫픽스 브랜치를 병합합니다(긴급 버그 수정).

아래 다이어그램은 권장 설정을 보여줍니다. GitFlow 위의 기능 브랜치 워크플로우 섹션에서 설명된 것과 동일한 절차를 따를 수 있습니다.

를 사용한 권장 설정을 보여주는 다이어그램 GitFlow.

각 개발자의 샌드박스

  • 팀의 각 개발자는 자신의 로컬 컴퓨터와 별도로 클라우드에 샌드박스 환경을 만듭니다 이를 통해 개발자는 다른 팀원의 변경 사항을 덮어쓰지 않고도 서로 격리되어 작업할 수 있습니다.

  • Amplify 의 각 브랜치에는 자체 백엔드가 있습니다. 이렇게 하면 팀의 개발자가 직접 로컬 컴퓨터에서 프로덕션 환경으로 백엔드 또는 프런트엔드를 수동으로 푸시하지 않고 Amplify가 Git 리포지토리를 변경 사항 배포를 위한 단일 소스로 사용할 수 있습니다.

개발자별 샌드박스 워크플로를 보여주는 다이어그램.
  1. Amplify CLI를 설치하여 새 Amplify 프로젝트를 초기화합니다.

    npm install -g @aws-amplify/cli
  2. 프로젝트에 대해 mary 백엔드 환경을 초기화합니다. 프로젝트가 없는 경우 Gatsby와 같은 create-react-app 부트스트랩 도구를 사용하여 프로젝트를 만드세요.

    cd next-unicorn amplify init ? Do you want to use an existing environment? (Y/n): n ? Enter a name for the environment: mary ... amplify push
  3. 선택한 Git 리포지토리로 코드를 푸시합니다(이 예에서는 사용자가 기본에 푸시한 것으로 가정함).

    git commit -am 'Added mary sandbox' git push origin main
  4. 리포지토리 > 기본을 Amplify에 연결합니다.

  5. Amplify 콘솔은 Amplify CLI에 의해 형성된 백엔드 환경을 감지합니다. 드롭다운에서 새 환경 생성을 선택하고 Amplify에 서비스 역할을 부여합니다. 저장 및 배포를 선택합니다. 빌드가 완료된 후 https://main.appid.amplifyapp.com에서 사용 가능한 마스터 브랜치 배포를 받게 되고 새 백엔드 환경은 브랜치에 연결됩니다.

  6. Amplify에서 개발 브랜치를 연결하고 (이 시점에서 개발 브랜치와 기본 브랜치가 동일하다고 가정) Create를 선택합니다.