[AWS] S3으로 간단 웹호스팅/배포 해보기

AWS?

AWS는 Amazon Web Services의 약자로, 아마존이 제공하는 세계 최대의 클라우드 컴퓨팅 플랫폼이다.

장점

• ✅ 서버 없이도 웹 서비스 운영 가능
  • 물리적 서버 설치 없이 AWS에서 바로 웹·앱 운영 가능
• ✅ 초기 비용 없음
  • 쓴 만큼만 돈을 내는 종량제
• ✅ 전 세계 인프라
  • 글로벌 데이터 센터를 통해 빠른 접속
• ✅ 확장성
  • 트래픽 늘어나면 자동으로 리소스 늘림 (오토스케일링)

주요 서비스

분류	서비스명	설명
🖥️ 컴퓨팅	EC2	가상 서버 (Linux/Windows 서버를 임대)
☁️ 서버리스	Lambda	서버 없이 코드 실행 (이벤트 기반)
📦 저장소	S3	파일 저장소 (이미지, 영상 등)
🗃️ 데이터베이스	RDS	MySQL, PostgreSQL 등 DB 호스팅
🌍 배포	CloudFront	CDN (콘텐츠 빠르게 전송)
🌐 도메인	Route 53	DNS 관리 및 도메인 구매
📊 모니터링	CloudWatch	서버 상태, 로그, 성능 모니터링

AWS 쓰는 사례 (스타트업부터 대기업까지)

• 스타트업: S3 + Lambda + RDS로 간단한 웹 앱 운영
• 대기업: EC2로 수천 대 서버 운영, 글로벌 서비스 배포
• 프론트엔드 개발자: 정적 사이트를 S3 + CloudFront로 배포
• 백엔드 개발자: Lambda + API Gateway로 서버리스 API 구축

AWS vs Azure vs GCP

항목	AWS	Azure	GCP
시장 점유율	🔥 1위	2위	3위
안정성/레거시 호환	👍 강함	MS와 연동 탁월	최신 기술 기반
사용 난이도	중	중상	상대적 간결

S3?

파일 저장, 다운로드 서비스

S3는 AWS에서 제공하는 객체 스토리지 서비스인 Amazon Simple Storage Service의 약자이다.

이미지, 동영상, 문서 등 다양한 파일을 저장하고 불러올 수 있으며, 저장 용량에 제한이 없고 높은 내구성과 가용성을 제공한다.

 

버킷(bucket)이라는 단위로 파일을 관리하며, 각 파일은 객체(object)로 저장된다.

정적 웹사이트 호스팅, 백업, 로그 저장, 콘텐츠 전송 등에 활용되며, 접근 제어와 암호화 기능도 지원한다.

사용한 저장량과 요청 횟수에 따라 비용이 청구되는 구조이다.

 

• 백엔드에서는 파일 업로드용으로 많이 사용함
• 프론트배포할때 S3를 사용하는 이유?
  • S3는 파일 저장 및 다운로드 외에도 웹 호스팅 기능도 부가적으로 가지고 있음
  • 웹서비스에 접속한다는 것은 그 서버(컴퓨터)로 접속하는것이 아니라, 웹 페이지를 운영하고있는 서버로부터 HTML, CSS, JS, 이미지파일 등을 다운받아와서 브라우저에서 실행시키는 방식
  • 즉, 웹사이트에 접근한다는 건 파일을 다운받아와야 되기 때문에 S3은 웹호스팅 기능도 할 수 있다.
• 현업에서 S3 많이 사용함

S3 간단한 웹 사이트 호스팅(배포) 방법

버킷 세팅

버킷이란 하나의 저장소이고,

여기서 객체는 프로그래밍에서의 객체가 아니라, S3에 업로드한 파일을 말한다.

 

버킷 만들기 버튼을 누른다.

 

 

버킷이름은 나중에 변경가능하지만 id처럼 고유해야한다.

 

 

외부 사용자에게 파일을 다운로드할 수 있도록 퍼블릭 액세스를 허용하려면,

"모든 퍼블릭 액세스 차단" 옵션을 해제해야 한다.

설정 변경 시 보안 경고가 표시되며, 이를 명시적으로 확인해야 한다.

 

다른 옵션이나 설정은 기본값으로 두고, 버킷을 생성한다.

 

 

생성된 버킷의 이름을 눌러 세팅을 위한 페이지에 들어간다.

권한 탭 - 버킷 정책 - 편집 버튼

• 정책: 권한을 정의하는 JSON문서이다.
• 특정 기능을 사용할수있도록 설정할 수 있다.

 

 

json을 직접작성하지않고, 오른쪽에 작업추가 하단에 검색으로 쉽게 설정 JSON을 추가할 수 있다.

먼저 S3을 검색하여 선택하고, getobject를 검색하여 체크하면 JSON이 작성된다.

 

 

arn:aws:s3:::{BucketName}/{ObjectName}
arn:aws:s3:::instagram-web/*

그리고 작업추가 하단에 리소스추가에서 추가버튼을 누르면 모달창이 뜬다.

리소스 유형은 object로 설정하고,

 

리소스 ARN에서
BucketName에 버킷이름을,
ObjectName에 모든 객체(파일)에 해당하는 *을 작성하고 리소스추가

 

 

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "Statement1",
            "Principal": "*",
            "Effect": "Allow",
            "Action": [
                "s3:GetObject"
            ],
            "Resource": [
                "arn:aws:s3:::instagram-web/*"
            ]
        }
    ]
}

• Version: 정책 버전으로, 일반적으로 "2012-10-17"을 사용한다.
• Statement: 하나 이상의 권한 부여 규칙을 포함하는 배열이다.
• Sid: Statement의 식별자(ID)로, 정책 내에서 구분 용도로 사용된다.
• Principal: 정책의 적용 대상이며 "*"는 모든 사용자(익명 포함)를 의미한다.
• Effect: 권한의 허용 여부를 지정하며, "Allow"는 권한을 부여한다.
• Action: 허용할 작업을 정의하며, "s3:GetObject"는 객체 읽기(다운로드)를 허용한다.
• Resource: 정책이 적용될 리소스를 명시하며, "arn:aws:s3:::버킷명/*"은 해당 버킷 내 모든 객체를 의미한다.

instagram-web-app-bucket에 있는 모든 객체에 있는 자원에 대해서 파일다운기능을 모든사용자에게 허용하겠다,라는 설정임.

변경사항을 저장한다.

 

 

HTML 배포해보기

업로드 버튼을 눌러 업로드 페이지로 온다.

 

 

드래그하거나 파일추가 버튼을 눌러 추가한후 업로드 버튼까지 눌러야 업로드 완료됨.

메인페이지는 파일명을 index.html로 하는게 좋다.

 

 

속성 탭 - 정적 웹 사이트 호스팅 - 편집

 

 

• 정적 웹 사이트 호스팅: 활성화
• 인덱스문서: index.html
• 나머지는 스킵
• 변경사항 저장

 

버킷 웹 사이트 엔드포인트에서 확인할 수 있다.