소개AWS Amplify호스팅 - AWS Amplify호스팅

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

소개AWS Amplify호스팅

AWS Amplify프런트엔드 웹 및 모바일 개발자가 에서 풀스택 애플리케이션을 빠르고 쉽게 구축할 수 있도록 특별히 제작된 도구 및 기능 세트입니다.AWS. Amplify 두 가지 서비스를 제공합니다. Amplify Studio. Amplify Hosting은 지속적인 배포로 풀스택 서버리스 웹 앱을 호스팅하기 위한 Git 기반 워크플로를 제공합니다. Amplify Hosting 를 시작하는 데 필요한 정보를 제공하는 사용자 안내서입니다.

Amplify Hosting 기능

  • Amplify Hosting 는 일반적인 SPA 프레임워크 (예: React, Angular, Vue.js, Ionic 및 Ember) 뿐만 아니라 정적 사이트 생성기 (예: Gatsby, Eleventy, Hugo, VuePress 및 Jekyll) 를 지원합니다.

  • 새로운 브랜치를 연결하여 프런트엔드 및 백엔드용 프로덕션 및 스테이징 환경을 관리합니다. 참조,기능 브랜치 배포.

  • 애플리케이션을 사용자 지정 도메인에 Connect. 참조,사용자 지정 도메인 설정.

  • SSR 웹 앱 배포 및 호스팅Next.js. 프레임워크를 사용하여 만들었습니다.

  • 코드를 검토하는 동안 설정을 통해 변경 사항 미리 보기풀 요청.

  • 엔드 투 엔드 테스트를 통해 앱 품질을 개선하십시오. 참조,종단 간 테스트.

  • 암호로 웹 애플리케이션을 보호하므로 공개적으로 액세스할 수 없어도 새로운 기능을 사용할 수 있습니다. 참조,액세스 제한.

  • 재작성 및 리디렉션을 설정하여 SEO 순위를 유지하고 클라이언트 앱 요구 사항에 따라 트래픽을 라우팅합니다. 참조,리디렉션 사용.

  • 즉각적인 캐시 무효화를 통해 모든 코드 커밋에서 앱이 즉시 업데이트됩니다.

  • 원자 배포는 전체 배포가 완료된 후에만 웹 앱이 업데이트되도록 함으로써 유지 관리 기간을 없앱니다. 이렇게 하면 파일을 제대로 업로드하지 못하는 시나리오가 제거됩니다.

  • 다양한 모바일 디바이스에서 렌더링된 앱의 스크린샷을 가져와 레이아웃 문제를 식별할 수 있습니다.

Amplify Hosting 시작하기

Amplify의 호스팅 기능을 시작하려면기존 코드 시작하기정리합니다. 튜토리얼을 마친 후에는 git 리포지토리를 연결할 수 있습니다 (GitHub, BitBucket 클라우드, GitLab,AWS CodeCommit) 를 사용하여 지속적인 배포를 설정합니다. 또는 다음 중 하나를 시작할 수도 있습니다.풀스택 지속적 배포 샘플.

Amplify Studio

Amplify Studio는AWS Amplify콘솔에서AWS Management Console. Amplify Studio는 확장 가능한 풀스택 웹 및 모바일 앱의 생성을 간소화하는 시각적 개발 환경입니다. Studio를 사용하여 다음과 같이 프런트엔드 UI를 빌드합니다. ready-to-use UI 구성 요소를 만들고 앱 백엔드를 생성한 다음 이 둘을 연결합니다. 에 대한 사용자 가이드 참조Amplify Studio문서 Amplify.

Amplify Studio 기능

  • 시각적 데이터 모델링을 사용하면 클라우드 인프라 대신 도메인별 객체에 집중할 수 있습니다.

  • 앱에 대한 인증을 설정합니다.

  • 강력하고 이해하기 쉬운 권한 부여.

  • 코드로서의 인프라스트럭처는 다음을 사용하여 모든 백엔드 기능을 구성합니다.AWS CloudFormation.

  • Amplify 명령줄 인터페이스 (CLI) 에서 작동합니다. Studio에서 수행한 모든 업데이트는 CLI로 가져올 수 있습니다.

  • 이메일을 통해 사용자를 초대하여 백엔드를 구성하고 관리합니다. 이러한 사용자는 전자 메일로 Amplify CLI에 로그인할 수도 있습니다.

  • 마크다운 지원을 통한 콘텐츠 관리

  • 앱의 사용자 및 그룹을 관리합니다.

  • Studio의 비주얼 디자이너를 사용하여 프론트엔드 UI 구성 요소를 빌드합니다. 미리 빌드된 UI 구성 요소 라이브러리의 수십 가지 디자인 중에서 선택할 수 있습니다.

  • 디자이너가 제작한 Figma 프로토타입을 React 코드로 Studio로 가져옵니다.

  • 테마로 프런트엔드 UI를 사용자 지정하여 앱의 구성 요소에 전역 스타일을 적용할 수 있습니다.

  • Studio에서 직접 UI 구성 요소를 구성하고 테스트하여 데이터를 업데이트하고 표시하는 방법을 확인할 수 있습니다.

  • 몇 가지 간단한 단계를 통해 클라우드에 연결된 백엔드를 프런트엔드 UI에 바인딩할 수 있습니다.

Amplify Studio 시작하기

필요하지 않습니다.AWS계정을 사용하여 Studio를 사용하여 백엔드를 만듭니다. Without an AWSaccount를 사용하면 로컬에서 백엔드에 대한 데이터 모델링을 시작할 수 있습니다.

와 함께AWS계정을 사용하면 백엔드 환경을 관리하기 위한 확장된 Studio 기능 집합과 앱의 백엔드에 연결할 수 있는 프런트엔드 UI 구성 요소를 만들기 위한 비주얼 디자이너에 액세스할 수 있습니다. 자세한 내용은 단원을 참조하십시오.시작하기문서 Amplify.

현대식 SPA 웹 애플리케이션

이 사용 설명서는 최신 단일 페이지 웹 애플리케이션 (SPA) 에 대한 기본적인 이해를 가진 고객을 위한 것입니다. 현대식 웹 애플리케이션은 모든 애플리케이션 구성 요소를 정적 파일로 패키징하는 SPA로 구성됩니다. 기존의 클라이언트-서버 웹 아키텍처는 좋지 않은 경험을 야기했습니다. 버튼을 클릭하거나 검색할 때마다 서버를 왕복하고 전체 애플리케이션을 다시 렌더링해야 했습니다. 현대식 웹 애플리케이션은 애플리케이션 프런트엔드 또는 사용자 인터페이스를 HTML/JavaScript 파일로 브라우저에 효율적으로 제공하여 페이지를 다시 로딩하지 않고도 백엔드 기능을 호출할 수 있으므로 네이티브 앱과 유사한 사용자 경험을 제공합니다.

현대식 웹 애플리케이션의 기능은 데이터베이스, 인증 서비스, 브라우저에서 실행되는 프런트엔드 코드 및 백엔드 비즈니스 로직 등 여러 장소에 분산되어 있습니다.AWS Lambda클라우드에서 실행 중입니다. 이로 인해 개발자는 애플리케이션 배포가 부분적으로 이루어지거나 실패하지 않도록 프런트엔드와 백엔드 전반에 걸쳐 배포를 신중하게 조정해야 할 때 애플리케이션 배포가 복잡해지고 시간이 오래 걸립니다. Amplify 단일 워크플로에서 프런트엔드 및 백엔드 배포를 단순화합니다.