AWS 시작하기

풀 스택 React 애플리케이션 구축

AWS Amplify를 사용하여 간단한 웹 애플리케이션 생성

모듈 2: 로컬 Amplify 앱 초기화

이 모듈에서는 Amplify CLI를 설치하고 구성합니다.

개요

계정에서 새 Amplify 프로젝트를 초기화했으므로, 이제 개발을 계속 진행하고 새 기능을 추가할 수 있도록 로컬 환경으로 가져와야 합니다.

이 모듈에서는 Amplify CLI를 설치하고 CLI를 사용하여 Amplify 프로젝트를 초기화합니다.

학습 목표

이 모듈에서는 다음을 수행할 수 있습니다.
  • Amplify CLI 설치 및 구성
  • Amplify 앱 초기화

주요 개념

Amplify CLI - Amplify CLI를 사용하면 터미널에서 직접 AWS 서비스를 생성, 관리, 제거할 수 있습니다.

 소요 시간

5분

 사용 서비스

구현

  • Amplify CLI(명령줄 인터페이스)는 간단한 안내형 워크플로에 따라 앱을 위한 AWS 클라우드 서비스를 생성하는 통합 도구 체인입니다. 명령 프롬프트(Windows) 또는 터미널(macOS)을 사용하여 Amplify CLI를 설치해보겠습니다. 참고: ‘-g’는 바이너리가 시스템에 전역적으로 설치된다는 것을 나타내므로 명령 프롬프트/터미널의 모든 디렉터리에서 이 명령을 실행할 수 있습니다.

    npm install -g @aws-amplify/cli
  • AWS Identity and Access Management(IAM)를 사용하면 AWS에서 사용자와 사용자 권한을 관리할 수 있습니다. CLI는 IAM을 사용하여 CLI를 통해 사용자를 대신하여 프로그래밍 방식으로 서비스를 생성하고 관리합니다.

    CLI를 구성하려면 구성 명령을 실행합니다. CLI 구성 프로세스에 대한 동영상 설명을 보려면 아래의 AWS Amplify CLI 설치 및 구성을 참조하세요.

    AWS Amplify CLI 설치 및 구성
    amplify configure
  • 다음으로 백엔드를 배포하고 백엔드 환경을 로컬에서 초기화합니다.

    a. Amplify 콘솔에서 백엔드 환경을 선택하고 시작하기를 선택합니다. 백엔드가 배포될 때까지 기다립니다.

    b. 백엔드 환경 탭에서 Studio 시작을 선택합니다.

    c. 백엔드 환경 탭으로 돌아가 로컬 설정 지침 섹션을 확장합니다. 명령을 클립보드에 복사하고 컴퓨터에서 터미널을 엽니다.

    d. 터미널에 명령을 붙여넣고 설정 지침을 따릅니다.

    ? Choose your default editor: Visual Studio Code
    ? Choose the type of app that you're building javascript
    ? What javascript framework are you using react
    ? Source Directory Path:  src 
    ? Distribution Directory Path: build
    ? Build Command:  npm run-script build
    ? Start Command: npm run-script start
    ? Do you plan on modifying this backend? Y
    

결론

Amplify 프로젝트를 초기화했고, 이제 기능을 추가할 준비가 되었습니다. 다음 모듈에서는 단 몇 줄의 코드로 전체 사용자 인증 흐름을 추가해보겠습니다.

이제 언제든지 다음 명령을 실행하여 대시보드에서 Amplify 프로젝트를 볼 수 있습니다.

amplify console
? Which site do you want to open? AWS console

이 페이지의 내용이 도움이 되었나요?

인증 추가