Astro 사이트를 Hostinger에 배포하기

Hostinger는 정적 사이트와 Node.js 애플리케이션을 지원하는 웹 호스팅 제공업체입니다.

이 가이드에서는 hPanel을 사용하여 정적 및 서버 렌더링 Astro 프로젝트를 Hostinger에 배포하는 방법을 다룹니다.

사전 준비 사항

활성 호스팅 요금제가 포함된 Hostinger 계정.
- 정적 사이트 배포는 hPanel이 포함된 모든 요금제에서 지원됩니다.
- 서버 렌더링 배포에는 비즈니스 웹 호스팅 또는 클라우드 호스팅처럼 Node.js 애플리케이션을 지원하는 요금제가 필요합니다.
배포할 준비가 된 Astro 프로젝트.

Astro 프로젝트는 기본적으로 output: 'static'을 사용하므로 정적 사이트 배포를 위해 추가 구성이 필요하지 않습니다.

hPanel의 File Manager 또는 FTP 클라이언트를 사용하여 dist/ 폴더의 내용을 Hostinger에 업로드할 수 있습니다.

로컬에서 Astro 프로젝트를 빌드합니다:
- npm
- pnpm
- Yarn
터미널 창
npm run build
터미널 창
pnpm build
터미널 창
yarn build
hPanel에 로그인한 후 웹사이트를 엽니다.
Files > File Manager를 열고 public_html 디렉터리로 이동합니다.
로컬 dist/ 폴더의 내용을 public_html에 업로드합니다. 파일을 드래그 앤 드롭하거나 압축 파일을 업로드한 뒤 해당 위치에서 압축을 해제할 수 있습니다.
도메인에 접속하여 사이트가 정상적으로 배포되었는지 확인합니다.

온디맨드 렌더링을 위해 Node.js를 지원하는 Hostinger 요금제에서 Astro 프로젝트를 Node.js 애플리케이션으로 배포하세요.

다음 astro add 명령을 사용하여 온디맨드 렌더링을 활성화하는 Node.js 어댑터를 추가하세요:

npx astro add node

pnpm astro add node

yarn astro add node

추가 구성 옵션은 Node.js 어댑터 가이드를 참고하세요.

package.json에 빌드된 서버를 실행하는 start 스크립트가 포함되어 있는지 확인하세요:

{
  "scripts": {
    "start": "node ./dist/server/entry.mjs"
  }
}

Astro 프로젝트를 GitHub, GitLab 또는 Bitbucket 저장소에 푸시합니다.
hPanel에 로그인한 후 Websites로 이동합니다.
새 웹사이트를 추가하고 Node.js 애플리케이션 옵션을 선택합니다.
Git 제공업체를 연결한 뒤 저장소와 브랜치를 선택합니다.
빌드 설정을 구성합니다:
- Build command: npm run build
- Start command: npm run start
Astro의 최소 요구 사항인 Node.js 22 이상을 충족하는 Node.js 버전을 선택합니다.
배포를 시작합니다. Hostinger가 의존성을 설치하고 빌드 명령을 실행한 뒤 애플리케이션을 시작합니다.

로컬에서 Astro 프로젝트를 빌드한 뒤 생성된 dist/ 폴더와 package.json, 잠금 파일(예: package-lock.json)을 함께 업로드합니다.
hPanel에서 새 웹사이트를 추가하고 Node.js 애플리케이션 옵션을 선택합니다.
파일 관리자를 사용하여 프로젝트 파일 또는 .zip 압축 파일을 업로드합니다.
애플리케이션을 구성합니다:
- Application root: package.json이 포함된 폴더
- Start command: npm run start
지원되는 Node.js 버전을 선택한 후 애플리케이션을 시작합니다.