NCP로 정적 웹 배포 어떻게 하는 건데...?

그런데 누가 AWS 말고 NCP 씀?

안녕하세요. '누'입니다. 크레딧 지원해 준다는데 한 번쯤은 해보려합니다.

항상 AWS에서 배포를 했었는데 프로젝트 지원으로 NCP 크레딧을 받게 되어 어쩌다 보니 NCP로 배포를 해야 하는 상황이 와버렸다. 주변에서 하는 말을 들어보면 AWS랑 비슷하다는데 음... 다들 사용하지 않는 데에는 이유가 있는 게 아닐까?
어찌 됐든 NCP 배포가 처음이라 어떻게 하는 건지 방법을 알아보기 위해 구글 서칭을 해보았다. 그런데 다들 도커, Nginx 등 오픈소스 플랫폼을 함께 사용하네...? 난 그런 거 모르니까 내가 아는 정보들을 찾아 배포한 방법을 남겨보자!

근데 NCP가 뭔데?

1. NAVER CLOUD PLATFORM의 약자로 네이버(Naver)에서 제공하는 클라우드 기반 인프라 제공 서비스
2. 기업이 IT 인프라를 구축하는 데 필요한 다양한 서비스를 제공하는 클라우드 컴퓨팅 서비스

1. NCP와 친해지길 바라

1-1. NAVER CLOUD PLATFORM 에서 오른쪽 위 콘솔로 접속

개인적으로 NCP는 로그인 과정이 너무 귀찮다!!! 총 두번의 인증을 완료해야 로그인 과정이 끝난다.

1-2. 로그인

1차 - 아이디, 비밀번호
2차 - 휴대 전화번호 / 이메일 주소 / OTP / 패스키 중 한 가지

귀찮은 인증을 모두 마치고 나면 드디어 대시보드 화면으로 오게 된다.
왼쪽에서 서비스를 눌러 NCP에서 사용 가능한 서비스들을 볼 수 있다.
(참고로 내가 로그인한 계정은 서브 계정이다. AWS처럼 계정 주인이 서브 계정을 만들어 팀원들에게 줄 수 있다)

처음 이 화면을 봤을 때는 뭔가 AWS처럼 꾸며져있다는 생각을 했는데 내가 AWS에서 사용한 서비스가 적어서 그런지 얼마나 비슷한 서비스들이 있는 건지는 잘 모르겠다.

2. 버킷이... 어디 있지? 있긴 한가....?

이 정도면 친해진 것 같은데 배포는 어느 서비스를 쓰는 걸까. AWS에서는 S3, CloudFront, Route53 이 세 가지를 사용했는데 비슷한 걸 찾아보면 되지 않을까? 하고 이것저것 눌러봤다.

2-1. Storage 카테고리 > Object Storage

버킷 매니지먼트를 찾을 수 있다. (서비스명에 검색은 왜 안되는 거야🥲)

나는 현재 버킷에 백엔드 버킷 하나, 내가 만든 프론트 버킷 하나가 생성되어 있다.

2-2. 버킷 생성하기

빌드 파일 저장을 위해 파란색 버킷 생성 버튼을 눌러 버킷 만들기

• 기본 정보 단계 -> 버킷 이름짓기

  버킷 이름이 리전 내에서 유일한 이름이어야 해서 정하기 어렵지 않을까 했는데 프로젝트 이름으로 하니까 괜찮았다.

• 설정 관리 단계 -> 기본값 그대로 두고 다음 단계

• 권한 관리 단계 -> 공개로 하고 다음 단계

  

• 최종 확인 단계 -> 최종 확인하고 버킷 생성하기

  

이렇게 하면 버킷 생성은 끝이다!

내가 느낀 NCP 와 AWS 버킷 생성 차이

NCP가 AWS보다 뭔가를 설정하는 부분이 적어서 편했다. 정책 추가도 없다! 그리고 기능에 대한 설명이 짧은 편이고 이해하기 쉬워서 좋았다.

3. 파일 올리기

이제 버킷에 파일을 올리며 되는데 AWS와 다른 점을 또 발견했다. 이것도 좀 귀찮은 건데 NCP 버킷에는 폴더가 업로드가 안된다... 나는 오류가 나서 안되는 건 줄 알았는데 아니었다.

• 새 폴더 만들기 버튼으로 새 폴더 생성

  

• 자신의 프로젝트 빌드 파일 구조에 맞추어 새 폴더를 만들고 폴더 안에 이미지를 올리기

  

현재 나는 프로젝트를 빌드 하면 dist 폴더 안에 'assets 폴더, fonts 폴더, index.html 파일'이 생성되어서 사진처럼 만들어놓았다.

• index.html 파일 권한 관리의 전체공개 부분이 공개인지 확인

  

특히 index.html 파일의 경우는 클릭해서 권한 관리의 전체 공개가 공개로 되어 있는지 확인해야 한다.
(전체 공개가 아니라면 권한 관리 옆 버튼을 눌러 공개로 바꾸기)

4. 정적 호스팅 설정

이제 새 버킷이 생성된 것을 확인할 수 있을 텐데 이제 만든 버킷에 정적 웹 사이트 호스팅 설정을 해주면 거의 끝난다.

• 새로 생성된 버킷 확인

AWS에서 버킷을 만들고 버킷 속성에서 정적 웹 사이트 호스팅 설정하는 것처럼 NCP도 비슷하게 설정할 수 있다.

• 정적 호스팅 원하는 버킷의 설정에서 정적 웹 사이트 호스팅 클릭

• 비활성화 버튼을 활성화로 바꾸기

정적 웹 사이트 호스팅을 누르면 모달이 뜨는데 비활성화 버튼을 활성화로 바꾸어주면 된다.

• 호스팅 유형 -> 정적 웹 사이트 호스팅

• 설정 -> 인덱스 파일과 오류 파일에 index.html 작성

  

• 엔드포인트 생성 완료

  

이렇게 하고 나면 웹 사이트를 사용할 수 있는 엔드 포인트를 받게 된다.

이렇게 NCP로 정적 웹 배포 끝!

마무리하며

NCP로 정적 웹 사이트 배포하는 방법을 구글에 서칭했었을 때 다른 분들이 더 복잡하고 어려운 방법으로 배포를 하길래 배포를 미루고 있었다. 그래도 해야지 하면서 여러 블로그들을 보면서 나에게만 해당되는 부분들만 흡수해 적용시켜보니 그렇게 복잡하지는 않았던 것 같다. 지금까지 배포를 모두 AWS에서 하다가 이번에 처음으로 NCP에서 해보았는데 아직 다른 서비스는 어떤 게 있는지 몰라서 그런 건지 배포 내내 AWS가 그리웠다.