S3 설정 및 배포

S3?

• S3(Simple Storage Service)는 단순 스토리지 서비스이며 이미지나 파일을 저장할 수 있다.
• HTML, CSS, Js와 같은 정적 자원을 올리고, 정적 웹 사이트를 호스팅할 수도 있다.
• 우리가 컴퓨터에 폴더 만드는 것처럼 버킷을 만들고 사용할 수 있다.

정적 웹사이트?

• 웹 사이트는 서버 측  스크립트 사용 유무를 깆누으로 동적 웹사이트와 정적 웹 사이트로 나눌 수 있다.
• 서버 측 스크립트는 PHP, JSP, ASP와 같은 것들을 말한다.
• 정적 웹 사이트는 HTML, CSS, Js처럼 정적 자원으로만 이루어진 웹 사이트다.

S3 버킷 설정하기

• 우선 가비아에서 도메인을 하나 구입하자.

https://www.gabia.com/

웹을 넘어 클라우드로. 가비아

• AWS에 로그인해서 S3 탭으로 이동한 후 버킷 만들기를 클릭하자.

• 배포할 사이트 도메인 이름과 버킷 이름을 꼭 같게 만든다

• 모든 퍼블릭 액세스 차단을 해제하고 현재 설정으로 인해 이 버킷과 그 안에 포함된 객체가 퍼블릭 상태가 될 수 있음을 알고 있습니다. 선택
• 아래로 내려서 버킷 만들기 클릭

• 버킷 이름 선택

• 권한 탭에 잇는 버킷 정책에서 편집 클릭

• 버킷 ARN 복사 후 정책 생성기 클릭

• Select Type of Policy: S3 Bucket Policy 선택
• Principal: * 입력
• Actions: GetObject 선택
• ARN: 위에서 복사한 ARN 붙여넣기

• Add Statement 클릭 후 Generate Policy 선택

• ARN 뒤에 /* 붙이고 복사하기

• 버킷 정책 편집으로 돌아와서 정책에 붙여넣은 후 변경 사항 저장

---

S3에 프로젝트 올리기

• 관리 탭 선택

• 아래로 쭉 내려서 정적 웹 사이트 호스팅 편집 클릭

• 정적 웹 호스팅: 활성화
• 호스팅 유형: 정적 웹 사이트 호스팅
• 인덱스 문서: index.html
• 오류 문서: index.html
• 위와 같이 설정 후 변경사항 저장

• 아래 명령어로 프로젝트 빌드 파일 생성하기

yarn build

• build 파일 안에 있는 모든 파일 업로드하기

• 파일 업로드 후 속성 탭에 있는 주소로 접속하면 잘 되는 모습을 볼 수 있다!

---

도메인 연결하기

• AWS에서 Route 53 선택 후 호스팅 영역 생성

• 도메인 이름에 도메인 입력 후 호스팅 영역 생성하기

• 아래 네임서버 영역(NS)의 값/트래픽 라우팅 대상 4개 복사하기

• 가비아에 접속해서 구입한 도메인에서 네임서버 설정 클릭

• 1차, 2차, 3차, 4차에 위에서 복사한 Route 53 네임 서버 4개 1, 2, 3, 4차에 .빼고 각각 붙여넣기

• 다시 AWS 53으로 돌아와서 레코드 생성 클릭

• 레코드 유형 A 선택 후 별칭 탭 선택

• 엔드포인트 선택: S3 웹 사이트 엔드포인트에 대한 별칭
• 리전 선택: 서울 선택
• S3 엔드포인트 선택: 웹 프로젝트를 배포한 S3 버킷 선택

• 이후 등록한 도메인으로 접속을 하면 잘 된다!