본문 바로가기
코딩이야기𖦹/개발 기초

📌 AWS S3에 웹 프로젝트 호스팅하는 법

by Dev디자인 2025. 5. 26.

완성된 결과물을 실제 웹에 올려서 공유하고 싶을 때가 많았다.
AWS S3를 활용해서 정적 웹사이트를 직접 배포해봤고, 그 과정을 하나하나 정리해보았다.

🪪 1. AWS 계정 만들고 로그인하기

먼저 AWS 공식 홈페이지에 접속해서 회원가입을 했음.
계정 생성 시 결제 정보를 요구하긴 하지만, S3는 프리 티어로 기본적인 기능을 무료로 쓸 수 있어서 부담 없음.

가입을 마치고 로그인한 뒤, 상단 검색창에 S3를 입력해서 S3 콘솔로 이동함.

📁 2. S3 버킷 만들기

S3는 ‘버킷’이라는 단위로 파일을 저장함.
버킷은 일종의 폴더 개념인데, 웹사이트 하나당 버킷 하나라고 생각하면 됨.

  1. [버킷 만들기] 버튼을 클릭함
  2. 버킷 이름은 전 세계적으로 고유해야 해서 my-portfolio-project처럼 나만의 이름으로 설정함
  3. 리전은 가급적 ‘아시아 태평양(서울)’로 선택함
  4. 아래쪽의 공개 접근 차단 해제 항목에서 체크 해제함 → 이게 중요함! (웹사이트는 퍼블릭이어야 하니까)
  5. 나머지 설정은 기본값으로 두고 생성 완료함
📌 중요: 버킷 이름은 소문자, 하이픈(-)만 사용 가능하고 도메인처럼 생긴 형식도 허용됨 (my-site.com 등)

🧰 3. 정적 웹사이트 호스팅 설정

버킷이 만들어졌다면 이제 설정을 조금 바꿔야 함.

  • 버킷 목록에서 방금 만든 버킷 클릭
  • [속성] → [정적 웹사이트 호스팅]으로 이동
  • 정적 웹사이트 호스팅 사용 활성화
  • 인덱스 문서: index.html
  • 오류 문서: error.html (없으면 비워도 됨)

설정 후 저장을 눌러주면 웹사이트 호스팅 기능이 켜짐.

🗂️ 4. 프로젝트 파일 업로드

이제 로컬에서 만든 정적 웹 프로젝트 파일들을 업로드할 차례임.

  • index.html, style.css, main.js 등 필요한 파일을 선택해서 업로드함(폴더채 업로드 안됨)
  • [객체] 탭에서 업로드 클릭 → 드래그 앤 드롭으로 가능
  • 업로드 후, 각 파일을 선택하고 [권한] 탭에서 퍼블릭 읽기 허용 옵션을 체크해줘야 함

🔐 5. 버킷 정책 설정 (사이트 전체 공개 허용)

파일마다 일일이 퍼블릭 권한을 주는 대신, 버킷 전체를 공개하는 정책을 추가할 수 있음.

  1. [권한] → [버킷 정책]으로 이동
  2. 아래 JSON 형식을 복붙함 (버킷 이름은 꼭 본인 걸로 바꿔야 함)
{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "PublicReadGetObject",
      "Effect": "Allow",
      "Principal": "*",
      "Action": "s3:GetObject",
      "Resource": "arn:aws:s3:::your-bucket-name/*"
    }
  ]
}

🔎 6. 웹사이트 접속 확인

이제 내 사이트가 잘 올라갔는지 확인해볼 차례임.

  • 다시 [속성] → [정적 웹사이트 호스팅] 항목으로 이동
  • 아래에 있는 엔드포인트 URL 클릭
  • index.html이 잘 뜨면 배포 성공임 🎉

이 주소를 복사해서 친구나 팀원에게 보내면 누구나 볼 수 있음!

📝 정리하며

처음에는 AWS 콘솔이 좀 복잡하게 느껴질 수 있는데, 한 번 해보면 금방 익숙해짐.
S3는 빠르고, 저렴하고, 정적 웹사이트 배포에 정말 유용한 서비스임.

🎯 오늘 정리한 내용 요약:

  • AWS 계정 생성 및 로그인
  • S3 버킷 만들기 + 퍼블릭 설정
  • 정적 웹사이트 호스팅 설정
  • 프로젝트 파일 업로드
  • 버킷 정책으로 전체 공개
  • 웹사이트 URL로 접속 확인

최근댓글

최근글

skin by © 2024 ttuttak