AWS Amplify로 Next.js 배포하기
AWS Amplify로 Next.js 배포하기
1. AWS Amplify
- 프론트엔드 웹 및 모바일 개발자가 AWS에 풀 스택 애플리케이션을 손쉽게 배포, 호스팅할 수 있도록 도와주는 솔루션
- Next.js를 사용할 때 좀 더 편리하다
- 기존 Vercel에 배포했지만 도메인을 따로 연결하기 위해 사용함
1) Amplify에 Next.js 앱 배포
- 첫번째로 Amplify console 로 들어서 웹 앱 호스팅
-
github에 배포했기 때문에 github 클릭
3. Github 권한 부여를 하면 repository를 선택 할 수 있다 ( 선택한 repository만 권한 부여를 하게되면 선택한것만 업데이트 가능)
-
권한 부여가 끝나면 해당 배포할 branch 선택 ( main 선택하고 이 후에 브랜치 선택해도 상관없음)
-
설정 빌드 및 테스트는 그대로 둔다 ( 중요한건 고급 설정에서 node 버전 pakage 설정을 해줘야하는데 본인 사항에 맞는 node 패키지 버전을 설정한다
-
다음 버튼을 클릭하고 저장 및 배포를 시작하면 해당 Repository의 배포를 시작한다
혹시나 이러한 버전 에러가 발생하면 빌드 설정탭에서 Edit로 Docker 빌드 이미지를 설정해주면 된다
이제 기다리면 배포가 완료된다
2) 도메인 설정
- 사용할 도메인을 구입
- 나는 Godday 여기서 원하는 도메인을 구입함
- 도메인 관리 탭에 들어가서 하위 도메인을 추가하고 내가 구매한 도메인이 dongnyeong.world면 그대로 입력해준다
-
해당 도메인을 설정하면 SSL 생성을 시작하고 SSL을 구성해줘야한다. 나타난대로 도메인 소유권을 확인하려면 해당 CNAME에 해당하는 DNS를 확인해야 사용 가능하다
-
**AWS Route 53에 들어가서 호스팅 영역의 탭을 클릭해서 호스팅 영역 생성을 한다 기존에 Route 53에 생성했다면 안해도 있을 것이다**
-
호스팅 영역의 세부 정보를 클릭하면 네임 서버(이름 서버)의 정보들이 나타난다
나의 도메인 서비스가 관리되는 곳에서 해당하는 네임 서버들을 하나씩 그대로 넣어준다
-
나는 이대로 선택해서 도메인 설정이 끝났다
-
하지만 SSL 구성을 DNS로 확인해줘야하는 경우는 해당 도메인 사이트에서 DNS 설정에서 타입과 값을 입력해주면된다
-
SSL 구성을 마치고 소유권 확인이 끝나면 도메인이 활성화된다
-
도메인 활성화가 끝나면 도메인 연결까지 끝난다