[Deployment] AWS S3로 클라이언트 배포하기

MinWoo Park·2021년 4월 27일
0

Deployment

목록 보기
1/4
post-thumbnail

Deployment

AWS S3로 클라이언트 배포를 하였습니다.
진행 과정을 기록하며 정리하는 글을 작성하겠습니다.


S3 (Simple Storage Service)

S3는 인터넷 스토리지 서비스입니다.
용량에 관계없이 파일을 저장할 수 있고 HTTP 프로토콜에서 파일에 접근할 수 있습니다.

S3를 사용하기 위해서는 버킷(bucket)을 객체를 저장해야 합니다.
버킷은 S3에서 생성할 수 있는 최상위 디렉터리입니다.
객체는 데이터가 저장되는 최소 단위를 뜻합니다.
키와 값으로 구성되어 있으며 키가 객체의 이름이고 값이 객체의 데이터이니다.

1. S3 버킷 생성하기

먼저 버킷을 만들어야 합니다.
Amazon S3 서비스로 들어가면 '버킷 만들기' 버튼이 있습니다.
해당 버튼을 클릭합니다.

버튼 만들기 버튼 클릭

버튼 만들기를 클릭한다면 다음과 같은 화면을 보실 수 있습니다.
버킷 이름은 모든 S3 리전 중에서 유일해야 합니다.
왜냐하면 S3에 접근할 수 있는 URL이 주어지기 때문입니다.
도메인 주소로 사용할 이름을 버킷 이름으로 작성하면 됩니다.

만약 도메인 주소로 google.com을 사용할 거라면 버킷 이름도 google.com이라고 만들면 됩니다.

버킷 만들기 버튼 클릭 후 화면

일반 구성에서 버킷 이름과 리전 선택 후 아래 여러 설정들이 있습니다.
이는 버킷을 만든 후에도 변경 가능합니다.
저는 S3로 배포하여 모든 이들이 제 서비스를 이용할 수 있도록 할 것이니 '모든 퍼블릭 엑세스 차단'은 풀어주겠습니다.

'모든 퍼블릭 엑세스 차단' 해제

나머지 설정들은 당장 필요하지 않으니 바로 버킷 만들기 버튼을 클릭하겠습니다.

나머지 설정 생략 후 버킷 만들기 클릭


2. 정적 웹 사이트 호스팅 활성화

다음과 같이 버킷이 생성 된 걸 확인하실 수 있을 겁니다.
그럼 속성으로 탭으로 들어가 맨 아래로 내리면 '정적 웹 사이트 호스팅'이 보입니다.
현재 '정적 웹 사이트 호스팅'이 비활성화 되어 있습니다.
편집을 클릭하여 상태를 활성화로 바꿔줍니다.

속성 탭 클릭 후 정적 웹 사이트 호스팅 확인

편집을 클릭하면 다음과 같은 설정 화면이 보입니다.
활성화로 바꿔준 후 인덱스 문서를 작성합니다.
버킷에 객체로 넣을 파일 중 인덱스 문서의 역할에 해당하는 파일 명을 작성합니다.

인덱스 문서 작성 후 변경 사항 저장을 클릭합니다.


3. 버킷 정책 작성

이번엔 권한 탭을 클릭하여 버킷 정책으로 이동합니다.
편집을 클릭 후 정책 생성기까지 이동합니다.

권한 탭 - 버킷 정책 - 정책 생성기 클릭

정책 생성 화면에서는 다음과 같이 작성해야 합니다.
Select Type of Policy는 S3 Bucket policy를 선택합니다.
Principal은 all의 의미인 ''를 입력합니다.
Actions는 GetObject
이렇게 선택하면 ARN는 arn:aws:s3:::<bucket_name>/<key_name>이라는 템플릿을 줍니다.
그럼 템플릿에서 맞게 작성합니다
arn:aws:s3:::testbuckey123123.com/

모두 작성 후 Add Statement가 활성화되면 버튼을 클릭합니다.
Step3도 활성화 되면서 Generate Policy버튼이 생깁니다.

정책 생성 화면

위 정책은 인터넷("Principal":"") 상의 모든 사람에게 도메인 이름("Action":["s3:GetObject"])과 연결된 S3 버킷의 파일("arn:aws:s3:::your-domain-name/")을 가져올 수 있는 권한을 부여한다는 의미입니다.

처음 빈 화면이였던 정책에 위에 받았던 정책을 복사하여 붙여넣기 합니다.

정책 생성기로 얻은 정책 복사 후 붙여넣기


4. 객체 업로드

버킷의 설정이 모두 완료되었다면 버킷에 객체를 업로드 합니다.
리액트를 기준으로 설명드리면 작성된 파일을 yarn build를 통해 build 파일들을 만든 후 해당 디렉토리 안의 파일들을 모두 넣어주면 됩니다.

객체 업로드

여기까지 작업이 완료되었다면 속성 탭에 있는 정적 웹 사이트 호스팅에서 '버킷 웹 사이트 엔드포인트'로 들어가시면 S3 배포가 완료 되었음을 확인하실 수 있습니다.

하지만 도메인 주소가 원하는 도메인 주소 이후에 s3~amazon.com까지 붙어서 너무 길어집니다.
이는 도메인을 구입 후 AWS Route53 서비스를 이용해 S3를 원하는 도메인에 연결해 주어야 합니다.


도메인 구입

S3에서 제공하는 도메인이 너무 길기 때문에 도메인을 따로 구입해야 합니다.
AWS에서 유료로 도메인을 구입하여 간단하게 처리할 수도 있지만 매번 도메인을 구입할 수 없으니 무료 도메인을 구입하여 Route53을 설정하는 법을 말씀 드리겠습니다.

1. Freenom에서 무료 도메인 구입

구글에 Freenom이라고 검색하시면 다음과 같은 사이트를 찾을 수 있을 겁니다.

Freenom링크

원하는 도메인 네임을 검색 합니다.
무료로 사용 가능한 도메인들이 나옵니다.
원하는 도메인을 Get하고 Checkout을 하면 됩니다.

도메인 검색 후 화면

최대 12개월까지 무료이니 기간을 꼭 확인하셔야 합니다.
12개월과 같은 기간인 1년, 년 단위로 입력하면 유료로 되니 주의하셔야 합니다.
이렇게 도메인까지 구입하시면 Route53으로 넘어와 레코드 생성 후 나머지 작업만 해주면 됩니다.

2. Route53에서 호스트 영역 생성

Route53 서비스에서 호스트 영역 생성을 클릭합니다.

Route53 서비스 첫 화면

도메인 이름만 작성하고 나머지 설정은 기본 값으로 진행합니다.

호스트 영역 생성 버튼 클릭 후 화면


3. 레코드 생성

호스트 존을 생성하면 해당 호스트 존에서 NS(Name Server), SOA(Start Of Authority) 레코드가 생성이 되어있습니다.

NS 레코드는 가장 일반적인 용도는 도메인에 대해 인터넷 트래픽이 라우팅되는 방식을 제어하는 것입니다.
SOA(권한 시작) 레코드에는 도메인 및 해당 Amazon Route 53 호스팅 영역에 대한 정보가 제공됩니다.
자세한 설명은 AWS 공식 사이트에 있는 AWS 지원되는 DNS 레코드 유형에서 확인 가능합니다.

저희는 A(Address Record)레코드를 생성합니다.
이는 DNS 서버에서 IP 주소를 알려주도록 설정하는 기능입니다.

레코드 생성 클릭 후 다음 화면에서 별칭을 On으로 클릭합니다.
트래픽 라우팅 대상을 S3로 클릭하고 S3를 만들었던 리전을 클릭합니다.
마지막으로 S3 엔드포인트 입력을 클릭하시면 S3 버킷 목록이 나옵니다.
모두 작성 후 레코드 생성을 클릭합니다.

레코드 생성


4.Name Server 설정

호스트 존을 만들었을 때 생성된 NS 레코드가 있습니다.
'값/트래픽 라우팅 대상' 컬럼을 보시면 4개의 네임서버가 있습니다.
도메인을 구입한 사이트에 접속한 뒤 네임서버를 설정해줘야 합니다.
Freenom으로 이동합니다.

Freenom 첫 화면에서 Services - My Domains - Manage Domains - Management Tools - NameServers 로 들어가야 합니다.
'Use custom nameservers (enter below)'를 클릭하여 Route53에서 얻은 네임서버 4개를 모두 입력해 줍니다.
여기까지 입력하면 Freenom에서 구입한 도메인으로 접속했을 때 S3에 올려두었던 파일을 볼 수 있습니다.


Reference :
Amazon Route 53 시작하기
지원되는 DNS 레코드 유형

profile
물음표를 느낌표로 바꾸는 순간을 사랑하는 개발자입니다.

0개의 댓글