EdgeOne으로 NotionNext 배포하기

이전 문서: EdgeOne으로 NotionNext 배포하기 게시일: 2024-11-13 마지막 수정: 2026-5-2 원래 분류: 🚀 설치 및 배포 태그: 배포 방식

⚠️

Tencent Cloud가 출시한 EdgeOne은 Next.js 같은 주요 프론트엔드 프레임워크 프로젝트 배포를 지원합니다. 현재는 정적 내보내기만 지원하고 동적 사이트는 지원하지 않습니다. 관심이 있다면 체험해 볼 수 있습니다.

EdgeOne이란?

Edge security acceleration platform EO, 즉 Tencent Cloud EdgeOne은 Tencent edge computing node를 기반으로 가속과 보안 솔루션을 제공합니다. 전자상거래와 리테일, 금융 서비스, 콘텐츠, 게임 등 여러 산업에서 사용자 경험을 높이는 데 사용할 수 있습니다. 전체 네트워크 도메인 DNS 해석과 통합 관리를 지원하며, 도메인 DNS 레코드를 추가할 수 있습니다. 도메인을 추가하면 해당 도메인의 모든 host record를 자동으로 가져올 수 있습니다.

참고 글:

Tencent launches free website deployment service: EdgeOne Pages

가입과 활성화

EdgeOne Pages를 사용하려면 Google 계정과 GitHub 계정이 필요합니다. 이후 EdgeOne 사이트에 접속해 계정을 등록합니다.

가입 링크: https://edgeone.ai/register. 가입이 끝나면 Tencent Cloud 관리 화면으로 이동합니다. Start now를 클릭해 OpenEdge 기능을 활성화합니다.

GitHub 연결과 프로젝트 가져오기

Pages를 활성화하면 페이지에서 GitHub 연결을 안내합니다.

단계에 따라 권한을 부여합니다.

접근을 허용할 코드 프로젝트를 선택합니다. 여기서는 모든 저장소 접근을 허용했습니다. 개별 저장소만 지정할 수도 있습니다.

프로젝트 가져오기

NotionNext 프로젝트를 선택합니다.

빌드 옵션 설정

시스템은 프로젝트 프레임워크를 자동 감지하고 빌드 명령을 미리 채워 줍니다.

여기서 세 곳을 수정해야 합니다.

빌드 명령은 정적 내보내기인 yarn export를 사용하세요. 최종 빌드 명령으로 yarn build를 사용하지 마세요. 호스팅 패널 템플릿이 여전히 npm run build / npm run export를 표시한다면 저장소 습관에 맞게 Yarn 명령으로 바꾸세요. 전자는 동적 사이트, 후자는 정적 사이트 방식입니다.
프로젝트 이름을 수정해야 합니다. 이름 길이는 5자에서 63자 사이여야 하며, 소문자, 숫자, 하이픈만 포함할 수 있습니다.
환경 변수에 NOTION_PAGE_ID를 추가합니다.

수정 후 설정은 다음과 같습니다.

설정을 확인한 뒤 Start deploy 버튼을 클릭해 배포를 진행합니다.

배포 대기

과정은 몇 분 정도 걸릴 수 있습니다.

배포 완료

오른쪽 위의 미리보기 버튼을 클릭해 임시 접속 링크를 얻습니다.

링크를 클릭해 접속합니다.

설정 수정과 재배포

프로젝트 설정으로 언제든 돌아와 환경 변수를 추가하거나 수정할 수 있습니다. 예를 들어 테마를 수정할 수 있습니다.

그다음 빌드와 배포 영역에서 더 보기를 클릭하고 프로젝트를 다시 배포합니다.

커스텀 도메인 연결

프로젝트 설정에서 커스텀 도메인 추가를 클릭합니다.

연결할 도메인을 입력합니다.

요구 사항에 따라 도메인 서비스 제공자 관리 화면에서 CNAME 레코드를 하나 추가하면 됩니다.

예를 들어 시스템이 제게 할당한 CNAME은 eo -> eo.tangly1024.com.dns.edgeone.app.입니다.

제 도메인은 Cloudflare에 위임되어 있으므로 Cloudflare로 CNAME 설정 방법을 예시로 설명합니다.

DNS 관리를 클릭하고 레코드를 추가합니다. 유형은 CNAME, 이름은 eo, 대상은 자신의 eo.tangly1024.com.dns.edgeone.app. 값을 입력합니다. 이 값은 사용자마다 다르므로 반드시 자신의 값을 입력하세요. 그런 다음 proxy status의 주황색 구름을 임시로 끄고 저장합니다.