5분 안에 Next.js 프로젝트를 EdgeOne Pages에 배포하기: 완전 가이드

EdgeOne Pages 배포가 Next.js 풀스택 지원을 제공한다는 것을 알고 계셨나요? 다음과 같은 Next 같은 Next능이 현재 지원됩니다:

EdgeOne Pages로 Next.js 풀스택 프로젝트를 배포하기 위해 세 가지 배포 옵션을 제공합니다.

시작하는 세 가지 방법

경로 A: EdgeOne Pages Next.js 템플릿 배포

EdgeOne Pages 템플릿에서 배포하는 것은 처음부터 Next.js 프로젝트를 구축하고 배포하는 가장 빠른 방법입니다.

콘솔에서 "프로젝트 생성"을 클릭하고 "템플릿에서 시작"을 선택할 수 있습니다. 여기에서 필요에 따라 Next.js 의 기본 템플릿이나 Next.js 기반의 다양한 테마 템플릿을 선택할 수 있습니다.

Pages는 템플릿을 새로운 개인 저장소에 복제하고 빌드합니다. 빌드가 완료되면 개발을 위해 저장소에서 코드를 복제할 수 있습니다.

경로 B: Git 저장소에서 Next.js 프로젝트 가져오기

EdgeOne Pages는 처음 사용자에게 Git 저장소 인증 및 배포를 완료하는 데 도움이 되는 명확한 단계별 안내를 제공합니다.

먼저 브라우저에서 EdgeOne Pages 콘솔을 방문하세요. 

다음으로 온라인 저장소를 선택하고 안내에 따라 인증을 완료하세요:

Git 인증 후, 배포를 시작할 코드 저장소를 선택하세요. 이 단계에서 선택적으로 환경 변수를 구성할 수 있습니다.

빌드 및 배포가 완료되면 "프로젝트 설정" 패널에서 빌드 설정을 검토하고 수정할 수 있습니다.

경로 C: EdgeOne CLI를 사용한 직접 업로드 워크플로우

Git 저장소에 의존하지 않고 배포할 수도 있습니다. 이는 IDE에서 직접 프로젝트를 빠르고 쉽게 배포하고수 있음을 의미합니다.

EdgeOne은 계정과 상호 작용할 수 있는 기능이 풍부한 CLI를 제공하며, EdgeOne CLI를 통해 직접 배포할 수 있습니다. 구체적인 단계는 다음과 같습니다:

1. Next.js 프로젝트 생성

먼저 Next.js 프로젝트를 생성하고 프로젝트 디렉토리로 이동합니다. 자세한 지침은 Next.js 문서를 참조하세요.

npx create-next-app@latest

cd <project>

2. 초기 설정

아직 설치하지 않았다면, EdgeOne CLI를 전역적으로 설치하세요:

npm install -g edgeone

프로젝트에서 EdgeOne CLI를 처음 사용하는 경우 먼저 "edgeone pages init"을 실행하세요. 

edgeone pages init          # "Global" 리전 선택

실행 후, 로그인하고 "Edge Functions"와 "Node Functions" 생성 여부를 묻는 메시지가 표시됩니다. 이들은 EdgeOne Pages 풀스택에서 지원하는 엣지 함수와 중앙화된 Node 함수입니다. 여기서 백엔드 기능을 구현할 수 있습니다. 자세한 내용은 관련 튜토리얼을 참조하세요.

프로젝트에서 CLI를 처음 사용하는 것이 아니라면 직접 로그인할 수 있습니다.

edgeone login          # "Global" 리전 선택

3. 빌드 및 배포

대부분의 인기 있는 프레임워크에 대한 지원을 통합했습니다. "edgeone pages deploy -n <name>"을 실행하면 빌드 및 배포 프로세스가 자동으로 처리됩니다. 

초기 배포의 경우, link 명령을 실행하세요. 메시지가 표시되면 <projectName>을 입력하세요. EdgeOne Pages는 현재 프로젝트를 자동으로 배포합니다.

edgeone pages link

또는 "link <projectName>"를 사용하여 기존 프로젝트에 연결한 다음 deploy 명령으로 배포할 수 있습니다. EdgeOne Pages는 라이브 프로젝트를 업데이트합니다.

edgeone pages link <projectName>

edgeone pages deploy 

EdgeOne CLI 자세한 지침은 튜토리얼을 참조하세요.

로컬 개발 및 디버깅

프로젝트를 어떻게 생성했든, EdgeOne CLI를 사용하여 Next.js 프로젝트의 백엔드 서비스(edge-functions 및 node-functions 포함)를 빠르고 편리하게 디버깅할 수 있습니다. 

CLI는 백엔드 서비스와 엣지 함수를 로컬에서 디버깅하기 위한 기능을 통합합니다. "edgeone pages dev"를 실행하면 CLI는 프론트엔드와 백엔드 서비스를 모두 포트 8088에 매핑하여 프로젝트를 쉽게 디버깅할 수 있게 합니다.

CLI가 제공하는 개발 환경을 통해 개발자는 "localhost:8088/<function-path>"를 통해 중앙화된 Node 서비스와 엣지 서비스를 직접 디버깅할 수 있습니다.

결론

위의 어떤 배포 방법을 사용하든, 이제 EdgeOne Pages에서 실행되는 Next.js 애플리케이션이 있습니다—전 세계적으로 분산되고, 자동 HTTPS가 활성화되어 있으며, 서버를 건드리지 않고도 0에서 수백만 개의 히트로 확장할 준비가 되어 있습니다. 

여기서부터 두려움 없이 반복하세요: 브랜치 미리보기로 실험을 안전하게 유지하고, 즉각적인 롤백으로 실수를 몇 초 안에 취소하며, 필요한 어디서든 개인화된 마법을 사용할 수 있습니다. 푸시, 미리보기, 홍보—그리고 시스템이 무거운 작업을 하는 동안 커피 한 잔 마시러 가세요.

관련 문서

• Next.js 문서
• EdgeOne CLI 사용자 가이드
• Node-functions 및 Edge-functions 튜토리얼
• Next.js 풀스택 템플릿 저장소