정적 웹 사이트 호스팅

구현

• 리포지토리 생성 및 연결

  이 자습서를 시작하려면 리포지토리를 생성하고 초기화해야 합니다. 가장 쉬운 방법은 create-react-app 명령을 사용하는 것입니다. 명령 프롬프트 또는 터미널에서 다음 명령을 사용하여 이 패키지를 설치합니다.

  연결할 리포지토리가 이미 있습니까? 아래의 c단계로 건너뛰십시오.

  Git 공급자에 연결하지 않고 배포하려고 합니까? 여기를 클릭하여 시작합니다.

  npx create-react-app amplifyapp
  cd amplifyapp
  npm start

  Code snippet copied

  복사

  이 단계에서는 GitHub 리포지토리를 생성하고 코드를 이 리포지토리에 커밋합니다. 이 단계를 완료하려면 GitHub 계정이 필요합니다. 계정이 없으면 여기에서 가입합니다.

  a. 앱을 위한 새 GitHub 리포지토리를 생성합니다(링크).
  

  

  b. 명령줄 인터페이스에서 다음 명령을 실행하여 git를 초기화하고 애플리케이션을 새 GitHub 리포지토리에 푸시합니다.
  

  git init
  git remote add origin git@github.com:username/reponame.git
  git add .
  git commit -m “initial commit”
  git push origin master

  Code snippet copied

  복사

  c. 리포지토리를 연결하려면 Amplify 콘솔에 로그인하고 페이지 상단에서 시작하기 를 선택한 다음 Amplify 호스팅에서 시작하기를 선택합니다.
  

  

  

  GitHub, Bitbucket, GitLab 또는 AWS CodeCommit 리포지토리를 연결합니다. Git 리포지토리 연결 없이 수동으로 빌드 아티팩트를 업로드할 수도 있습니다(수동 배포 참조). Amplify 콘솔에 권한을 부여하면 Amplify가 리포지토리 공급자로부터 액세스 토큰을 가져오지만 토큰을 AWS 서버에 저장하지는 않습니다. Amplify는 특정 리포지토리에 설치된 배포 키만 사용하여 리포지토리에 액세스합니다.
  

  

  리포지토리 서비스 공급자를 연결한 후 리포지토리를 선택한 다음 구축하고 배포할 브랜치를 선택합니다.
  

  

• 빌드 설정 확인

  선택한 브랜치에 대해 Amplify는 리포지토리를 검사하여 실행할 빌드 명령의 시퀀스를 자동으로 감지합니다. 빌드 설정을 확인하고 [다음(Next)]을 클릭합니다.
  

  

• 저장 및 배포

  모든 설정을 검토하여 모든 항목이 올바르게 설정되었는지 확인합니다. [저장 및 배포(Save and deploy)]를 선택하여 웹 앱을 글로벌 콘텐츠 전송 네트워크(CDN)에 배포합니다. 프런트 엔드 구축은 일반적으로 1~2분이 소요되지만 앱의 크기에 따라 달라질 수 있습니다.