Amplify 호스팅을 사용하여 서버 측 렌더링된 앱 배포

를 사용하여 서버 측 렌더링 () AWS Amplify SSR 을 사용하는 웹 앱을 배포하고 호스팅할 수 있습니다. Amplify Hosting에서는 Next.js 프레임워크를 사용하여 생성한 애플리케이션이 자동으로 감지되며 AWS Management Console에서 수동으로 구성할 필요가 없습니다.

또한 Amplify는 애플리케이션의 빌드 출력을 Amplify Hosting이 예상하는 디렉터리 구조로 변환하는 오픈 소스 빌드 어댑터가 있는 모든 Javascript 기반 SSR 프레임워크를 지원합니다. 예를 들어 사용 가능한 어댑터를 설치하여 Nuxt, Astro 및 SvelteKit 프레임워크로 만든 앱을 배포할 수 있습니다.

고급 사용자는 배포 사양을 사용하여 빌드 어댑터를 만들거나 빌드 후 스크립트를 구성할 수 있습니다.

최소한의 구성으로 Amplify 호스팅에 다음 프레임워크를 배포할 수 있습니다.

Next.js

• Amplify는 어댑터 없이도 Next.js 14 애플리케이션을 지원합니다. 시작하려면 Next.js 지원을 Amplify 섹션을 참조하십시오.

Nuxt.js

• Amplify는 사전 설정된 어댑터를 사용하여 Nuxt.js 애플리케이션 배포를 지원합니다. 시작하려면 Nuxt.js 지원을 Amplify 섹션을 참조하십시오.

Astro.js

• Amplify는 커뮤니티 어댑터를 사용하여 Astro.js 애플리케이션 배포를 지원합니다. 시작하려면 Astro.js 지원을 Amplify 섹션을 참조하십시오.

SvelteKit

• Amplify는 커뮤니티 SvelteKit 어댑터를 사용하여 애플리케이션 배포를 지원합니다. 시작하려면 에 대한 지원을 Amplify SvelteKit 섹션을 참조하십시오.

오픈소스 어댑터

• 오픈 소스 어댑터 사용 - 이전 목록에 없는 어댑터 사용에 대한 지침은 을 참조하십시오오픈소스 어댑터 사용.

• 프레임워크 어댑터 구축 - 프레임워크에서 제공하는 기능을 통합하려는 프레임워크 작성자는 Amplify Hosting 배포 사양을 사용하여 Amplify가 예상하는 구조에 맞게 빌드 출력을 구성할 수 있습니다. 자세한 내용은 Amplify Hosting 배포 사양을 사용하여 빌드 출력 구성을 참조하십시오.

• 빌드 후 스크립트 구성 - Amplify Hosting 배포 사양을 사용하여 특정 시나리오에 필요한 대로 빌드 출력을 조작할 수 있습니다. 자세한 내용은 Amplify Hosting 배포 사양을 사용하여 빌드 출력 구성을 참조하십시오. 예시는 배포 매니페스트를 사용하여 Express 서버 배포에서 확인하십시오.

주제

• Next.js 지원을 Amplify
• Nuxt.js 지원을 Amplify
• Astro.js 지원을 Amplify
• 에 대한 지원을 Amplify SvelteKit
• Amplify에 SSR 앱 배포하기
• SSR지원되는 기능
• 앱 요금 SSR
• 배포 문제 해결 SSR
• 고급: 오픈 소스 어댑터

Amplify에 SSR 앱 배포하기

이 지침을 사용하여 Amplify에서 예상하는 빌드 출력을 준수하는 배포 번들이 포함된 모든 프레임워크로 만든 앱을 배포할 수 있습니다. Next.js 애플리케이션을 배포하는 경우 어댑터가 필요하지 않습니다.

프레임워크 어댑터를 사용하는 SSR 앱을 배포하는 경우 먼저 어댑터를 설치하고 구성해야 합니다. 지침은 오픈소스 어댑터 사용 단원을 참조하십시오.

Amplify SSR 호스팅에 앱을 배포하려면

1. 에 AWS Management Console 로그인하고 Amplify 콘솔을 엽니다.

2. 모든 앱 페이지에서 새 앱 생성을 선택합니다.

3. Amplify로 빌드 시작 페이지에서 Git 리포지토리 공급자를 선택한 후 다음을 선택합니다.

4. 리포지토리 브랜치 추가 페이지에서 다음을 수행하십시오.

   1. 연결할 리포지토리의 이름을 선택합니다.

   2. 연결할 리포지토리 브랜치의 이름을 선택합니다.

   3. Next(다음)를 선택합니다.

5. 앱 설정 페이지에서 Amplify는 Next.js 앱을 자동으로 탐지합니다. SSR

   다른 프레임워크용 어댑터를 사용하는 SSR 앱을 배포하는 경우 Amazon Logs를 명시적으로 활성화해야 합니다. CloudWatch 고급 설정 섹션을 연 다음 서버 측 렌더링 () 배포 섹션에서 SSR앱 로그 활성화를 선택합니다. SSR

6. 앱에는 로그를 사용자에게 전달하는 Amplify가 맡는 IAM 서비스 역할이 필요합니다. AWS 계정

   서비스 역할을 추가하는 절차는 새 역할을 만들지 아니면 기존 역할을 사용할지에 따라 달라집니다.

   • 새 역할을 만들려면:

     1. 새 서비스 역할 생성 및 사용을 선택합니다.

   • 기존 역할을 사용하려면:

     1. 기존 역할 사용을 선택합니다.

     2. 서비스 역할 목록에서 사용할 역할을 선택합니다.

7. Next(다음)를 선택합니다.

8. 검토 페이지에서 저장 및 배포를 선택합니다.