🔥 학습목표

• S3 콘솔을 통해 버킷을 생성한 뒤 클라이언트 코드를 배포할 수 있다.

🟩 S3 정적 웹 호스팅

🟣 S3(Simple Storage Service)

⬜ 클라우드 스토리지

인터넷 공간에 데이터를 저장하는 저장소

• Ex. GoogleDrive, 네이버 MyBox, 마이크로소프트 OneDrive 등...

• S3란, AWS에서 제공하는 Cloud Storage 서비스다.

그렇다면 이 클라우드 저장소에 무엇을 저장하냐, 바로 클라이언트 배포 파일을 저장하는 거다.

⬜ S3 스토리지 종류

대표적으로 쓰이는 스토리지는 아래 두 종류다.

• Standard - 가장 일반적으로 사용되는 스토리지 클래스.

  • 데이터에 빠른 속도로 접근, 데이터 액세스 요청에 대한 처리 속도 또한 빠르다.
  • 보관 비용이 높아 데이터를 오래 보관하기엔 효율적이지 못하다.
  • 데이터를 자주 액세스 해야 할 때 사용한다.

• Glacier - 데이터를 장기보관 하고 싶을 때 사용한다.

  • 데이터에 액세스 하는 속도가 느리다.
  • 하지만 보관 비용이 매우 저렴하다.

그 외에도 Standard-IA, One Zone-IA, S3 Clacier Deep Archive 등 여러가지 스토리지 클래스가 존재하며 목적에 따라 사용한다.

⬜ S3의 기능

버킷을 사용한 정적 웹 사이트 호스팅이 가능하다.

• 정적 파일: 서버의 개입 없이 클라이언트에 제공되는 파일

• 웹 호스팅: 서버의 한 공간을 빌려주어 웹 사이트를 배포할 수 있게 만들어주는 서비스

  
  

⬜ 버킷이란?

• 파일을 담는 바구니(최상위 디렉토리) - 프로젝트 폴더에서 build에 해당한다고 보면 된다.

• 무한히 많은 파일을 저장할 수 있다.

• 버킷의 이름은 각 리전(지역)에서 고유해야 한다.

• 버킷 정책을 생성하여 액세스 권한을 부여 가능하다. 해당 버킷에 대한 다른 유저의 접근 권한을 관리하는 것이다.

• 버킷에 담기는 파일을 객체라고 하는데, 모든 객체는 고유한 키를 가진다.

• http://버킷이름.S3.amazonaws.com/객체의 키 와 같은 URL 주소로 객체에 접근 가능하다.

🟣 배포하기

⬜ S3 버킷 검색하기

AWS 콘솔에서 S3를 검색한다. 아래 화면에서 표시한 부분을 클릭하면 된다.

여러 버킷 중 내가 제공받은 버킷을 검색해보았다.

⬜ 클라이언트 번들링

클라이언트 프로젝트에서 서버 요청 주소를 담을 .env 파일을 작성한다.

REACT_APP_API_URL = http://${내 주소}.ap-northeast-2.compute.amazonaws.com

그 후 npm install , npm run build 를 진행하여 번들링 후 배포 폴더를 생성한다.

생성된 build 디렉토리가 바로 배포할 파일을 담고있다.

AWS 홈페이지로 돌아가서 내 버킷에 build 폴더 안에 있는 모든 파일을 업로드 한다.

그 후 속성 탭으로 들어가 스크롤 맨 밑의 "정적 웹사이트 호스팅" 섹션을 확인한다.

⬜ 배포된 주소로 접근하기

위에서 확인한 주소로 들어가면 클라이언트 화면이 정상적으로 배포되어 나타나는 걸 볼 수 있다.

실행해둔 서버에 요청을 날리면 EC2 서버에서 요청을 받았음을 동시에 확인할 수 있다.

응답이 정상적으로 돌아온다면 웹 서버, 웹 애플리케이션 서버(WAS) 모두 잘 작동하고 있다는 뜻이다.