Astro 사이트를 Netlify에 배포하세요
Netlify는 웹 애플리케이션과 정적 웹사이트를 위한 호스팅 및 서버리스 백엔드 서비스를 제공합니다. 모든 Astro 사이트는 Netlify에서 호스팅될 수 있습니다!
이 가이드에는 웹사이트 UI 또는 Netlify의 CLI를 통해 Netlify에 배포하기 위한 지침이 포함되어 있습니다.
프로젝트 구성
섹션 제목: 프로젝트 구성Astro 프로젝트는 정적 사이트, 서버 렌더링 사이트, 에지 렌더링 사이트 등 세 가지 방법으로 Netlify에 배포할 수 있습니다.
정적 사이트
섹션 제목: 정적 사이트Astro 프로젝트는 기본적으로 정적 사이트입니다. 정적 Astro 사이트를 Netlify에 배포하기 위해 추가 구성이 필요하지 않습니다.
요청 시 렌더링을 위한 어댑터
섹션 제목: 요청 시 렌더링을 위한 어댑터Astro 프로젝트에서 요청 시 렌더링을 활성화하고 Netlify의 에지 함수 사용을 포함하여 Netlify에 배포하려면 다음을 수행하세요.
Netlify 어댑터를 추가하여 Astro 프로젝트에서 SSR을 활성화하고 다음 astro add
명령으로 Netlify에 배포하세요. 그러면 어댑터가 설치되고 astro.config.mjs
파일이 한 번에 적절하게 변경됩니다.
npx astro add netlify
배포 방법
섹션 제목: 배포 방법웹사이트 UI를 통해 또는 Netlify의 CLI (명령줄 인터페이스)를 사용하여 Netlify에 배포할 수 있습니다. 프로세스는 정적 및 요청 시 렌더링되는 Astro 사이트 모두 동일합니다.
웹사이트 UI 배포
섹션 제목: 웹사이트 UI 배포프로젝트가 GitHub, GitLab, BitBucket, Azure DevOps에 저장된 경우 Netlify 웹 사이트 UI를 사용하여 Astro 사이트를 배포할 수 있습니다.
-
Netlify dashboard에서 Add a new site를 클릭하세요.
-
Import an existing project를 선택하세요.
Git 공급자로부터 Astro 저장소를 가져올 때 Netlify는 자동으로 올바른 구성 설정을 감지하고 미리 값들을 채워야 합니다.
-
다음 설정이 입력되었는지 확인한 후 Deploy 버튼을 누르세요.
- Build Command:
astro build
또는npm run build
- Publish directory:
dist
배포 후에는 사이트 개요 페이지로 리디렉션됩니다. 여기에서 사이트 세부정보를 편집할 수 있습니다.
- Build Command:
소스 저장소에 대한 향후 변경 사항은 배포 구성에 따라 미리 보기 및 프로덕션 배포를 트리거합니다.
netlify.toml
파일
섹션 제목: netlify.toml 파일선택적으로 프로젝트 저장소의 최상위 수준에 새 netlify.toml
파일을 생성하여 빌드 명령 및 게시 디렉터리는 물론 환경 변수 및 리디렉션을 포함한 기타 프로젝트 설정을 구성할 수 있습니다. Netlify는 이 파일을 읽고 자동으로 배포를 구성합니다.
기본 설정을 구성하려면 다음 내용이 포함된 netlify.toml
파일을 생성하세요.
[build] command = "npm run build" publish = "dist"
CLI 배포
섹션 제목: CLI 배포Netlify CLI를 설치하고 사용하여 Netlify에 새 사이트를 만들고 Git 저장소를 연결할 수도 있습니다.
-
Netlify의 CLI를 전역적으로 설치
터미널 창 npm install --global netlify-cli -
netlify login
을 실행하고 지침에 따라 Netlify에 로그인하고 권한을 부여하세요. -
netlify init
을 실행하고 지침을 따르세요. -
빌드 명령 (
astro build
)을 확인하세요.CLI는 빌드 설정 (
astro build
)과 배포 디렉터리 (dist
)를 자동으로 감지하고 해당 설정을 사용하여netlify.toml
파일을 자동으로 생성하도록 제안합니다. -
Git에 푸시하여 빌드 및 배포
CLI는 저장소에 배포 키를 추가합니다. 이는
git push
를 할 때마다 Netlify에서 사이트가 자동으로 재빌드된다는 의미입니다.
Node.js 버전 설정
섹션 제목: Node.js 버전 설정Netlify에서 레거시 빌드 이미지 (Xenial)를 사용하는 경우 Node.js 버전이 설정되어 있는지 확인하세요. Astro에는 v18.17.1
또는 v20.3.0
이상이 필요합니다.
다음을 사용하여 Netlify에서 Node.js 버전을 지정할 수 있습니다.
- base 디렉터리에 있는
.nvmrc
파일. - Netlify 프로젝트 대시보드의 사이트 설정의
NODE_VERSION
환경 변수.
Netlify Functions 사용하기
섹션 제목: Netlify Functions 사용하기Astro와 함께 Netlify Functions를 사용하는 데 특별한 구성이 필요하지 않습니다. 프로젝트 루트에 netlify/functions
디렉터리를 추가하고 Netlify Functions 문서를 따라 시작하세요!
- Astro 사이트를 배포하는 방법 — Netlify 블로그
- 양식, 서버리스 함수 및 리디렉션을 사용한 Astro 사이트 배포 — Netlify 블로그
- 배포 연습 동영상 — Netlify YouTube 채널