Astro 사이트를 Deno에 배포

Deno를 사용하여 자체 서버 또는 전 세계 엣지에서 JavaScript, TypeScript 및 WebAssembly를 실행하는 분산 시스템인 Deno Deploy에 정적 또는 요청 시 렌더링되는 Astro 사이트를 배포할 수 있습니다.

이 가이드에는 Deno를 사용하여 자체 서버에서 Astro 사이트를 실행하고 GitHub Actions 또는 Deno Deploy CLI를 통해 Deno Deploy에 배포하는 방법에 대한 지침이 포함되어 있습니다.

요구 사항

섹션 제목: 요구 사항

이 가이드에서는 Deno가 이미 설치되어 있다고 가정합니다.

프로젝트 구성

섹션 제목: 프로젝트 구성

Astro 프로젝트는 정적 사이트 또는 요청 시 렌더링되는 사이트로 배포될 수 있습니다.

정적 사이트

섹션 제목: 정적 사이트

기본적으로 Astro 프로젝트는 정적 사이트입니다. Deno 또는 Deno Deploy를 사용하여 정적 Astro 사이트를 배포하는 데 추가 구성이 필요하지 않습니다.

요청 시 렌더링을 위한 어댑터

섹션 제목: 요청 시 렌더링을 위한 어댑터

Deno를 사용하여 Astro 프로젝트에서 요청 시 렌더링을 활성화하고 Deno Deploy에 배포하려면 다음을 수행하세요.

1. 선호하는 패키지 관리자를 사용하여 프로젝트의 종속성에 @deno/astro-adapter 어댑터를 설치합니다.

   npm

   npm install @deno/astro-adapter

   pnpm

   pnpm install @deno/astro-adapter

   Yarn

   yarn add @deno/astro-adapter

2. astro.config.mjs 프로젝트 구성 파일을 아래 변경 사항으로 업데이트하세요.

   astro.config.mjs

   import { defineConfig } from 'astro/config';
   import deno from '@deno/astro-adapter';
   
   export default defineConfig({
     output: 'server',
     adapter: deno(),
   });

3. package.json 파일의 preview 스크립트를 아래 변경 사항으로 업데이트하세요.

   package.json

   {
     // ...
     "scripts": {
       "dev": "astro dev",
       "start": "astro dev",
       "build": "astro build",
       "preview": "astro preview"
       "preview": "deno run --allow-net --allow-read --allow-env ./dist/server/entry.mjs"
     }
   }

   이제 이 명령을 사용하여 Deno를 통해 로컬에서 프로덕션 Astro 사이트를 미리 볼 수 있습니다.

   npm

   npm run preview

   pnpm

   pnpm run preview

   Yarn

   yarn run preview

배포하는 방법

섹션 제목: 배포하는 방법

자체 서버에서 Astro 사이트를 실행하거나 GitHub Actions 또는 Deno Deploy의 CLI (명령줄 인터페이스)를 사용하여 Deno Deploy에 배포할 수 있습니다.

자체 서버에 배포

섹션 제목: 자체 서버에 배포

1. 서버에 프로젝트를 복사합니다.

2. 선호하는 패키지 관리자를 사용하여 프로젝트 의존성을 설치합니다.

   npm

   npm install

   pnpm

   pnpm install

   Yarn

   yarn

3. 선호하는 패키지 관리자를 사용하여 Astro 사이트를 빌드합니다.

   npm

   npm run build

   pnpm

   pnpm run build

   Yarn

   yarn run build

4. 다음 명령으로 애플리케이션을 시작합니다.

   Static

   deno run -A jsr:@std/http/file-server dist

   SSR

   deno run -A ./dist/server/entry.mjs

GitHub Actions 배포

섹션 제목: GitHub Actions 배포

프로젝트가 GitHub에 저장되어 있는 경우 Deno Deploy 웹사이트에서 Astro 사이트를 배포하기 위한 GitHub Actions 설정 과정을 안내합니다.

1. 공개 또는 비공개 GitHub 저장소에 코드를 푸시합니다.

2. GitHub 계정으로 Deno Deploy에 로그인한 후 New Project를 클릭합니다.

3. 저장소와 배포할 브랜치를 선택하고 GitHub Action 모드를 선택합니다. (Astro 사이트에는 빌드 단계가 필요하며 자동 모드를 사용할 수 없습니다.)

4. Astro 프로젝트에서 .github/workflows/deploy.yml에 새 파일을 생성하고 아래 YAML에 붙여넣습니다. 이는 Astro 사이트에 필요한 추가 단계가 포함된 Deno Deploy에서 제공하는 YAML과 유사합니다.

   Static

   .github/workflows/deploy.yml

   name: Deploy
   on: [push]
   
   jobs:
     deploy:
       name: Deploy
       runs-on: ubuntu-latest
       permissions:
         id-token: write # Deno Deploy 인증에 필요
         contents: read # 저장소를 복제하는 데 필요
   
       steps:
         - name: Clone repository
           uses: actions/checkout@v4
   
         # npm을 사용하지 않나요? `npm ci`를 `yarn install` 또는 `pnpm i`로 변경하세요.
         - name: Install dependencies
           run: npm ci
   
         # npm을 사용하지 않나요? `npm run build`를 `yarn build` 또는 `pnpm run build`로 변경하세요.
         - name: Build Astro
           run: npm run build
   
         - name: Upload to Deno Deploy
           uses: denoland/deployctl@v1
           with:
             project: my-deno-project # TODO: Deno Deploy 프로젝트 이름으로 변경
             entrypoint: jsr:@std/http/file-server
             root: dist

   SSR

   .github/workflows/deploy.yml

   name: Deploy
   on: [push]
   
   jobs:
     deploy:
       name: Deploy
       runs-on: ubuntu-latest
       permissions:
         id-token: write # Deno Deploy 인증에 필요
         contents: read # 저장소를 복제하는 데 필요
   
       steps:
         - name: Clone repository
           uses: actions/checkout@v4
   
         # npm을 사용하지 않나요? `npm ci`를 `yarn install` 또는 `pnpm i`로 변경하세요.
         - name: Install dependencies
           run: npm ci
   
         # npm을 사용하지 않나요? `npm run build`를 `yarn build` 또는 `pnpm run build`로 변경하세요.
         - name: Build Astro
           run: npm run build
   
         - name: Upload to Deno Deploy
           uses: denoland/deployctl@v1
           with:
             project: my-deno-project # TODO: Deno Deploy 프로젝트 이름으로 변경
             entrypoint: dist/server/entry.mjs

5. 이 YAML 파일을 커밋하고 구성된 배포 브랜치에서 GitHub로 푸시하면 배포가 자동으로 시작됩니다!

   GitHub 저장소 페이지 또는 Deno Deploy의 “Actions” 탭을 사용하여 진행 상황을 추적할 수 있습니다.

CLI 배포

섹션 제목: CLI 배포

1. Deno Deploy CLI를 설치합니다.

   deno install -gArf jsr:@deno/deployctl

2. 선호하는 패키지 관리자를 사용하여 Astro 사이트를 빌드합니다.

   npm

   npm run build

   pnpm

   pnpm run build

   Yarn

   yarn run build

3. 배포하려면 deployctl을 실행합니다!

   Static

   cd dist && deployctl deploy jsr:@std/http/file-server

   SSR

   deployctl deploy ./dist/server/entry.mjs

   Deno Deploy에서 모든 배포를 추적할 수 있습니다.

4. (선택 사항) 빌드를 단순화하고 하나의 명령으로 배포하려면 package.json 파일에 deploy-deno 스크립트를 추가하세요.

   Static

   package.json

   {
     // ...
     "scripts": {
     "dev": "astro dev",
     "start": "astro dev",
     "build": "astro build",
     "preview": "astro preview",
     "deno-deploy": "npm run build && cd dist && deployctl deploy jsr:@std/http/file-server"
     }
   }

   SSR

   package.json

   {
     // ...
     "scripts": {
       "dev": "astro dev",
       "start": "astro dev",
       "build": "astro build",
       "preview": "deno run --allow-net --allow-read --allow-env ./dist/server/entry.mjs",
       "deno-deploy": "npm run build && deployctl deploy ./dist/server/entry.mjs"
     }
   }

   그런 다음 이 명령을 사용하여 Astro 사이트를 한 단계로 빌드하고 배포할 수 있습니다.

   npm run deno-deploy

더 많은 배포 안내서

• 

  Netlify

• 

  Vercel

• 

  Deno Deploy

• 

  GitHub Pages

• 

  GitLab Pages

• 

  Cloudflare Pages

• 

  AWS

• 

  AWS via Flightcontrol

• 

  AWS via SST

• 

  Clever Cloud

• 

  Azion

• 

  Google Cloud

• 

  Google Firebase

• 

  Heroku

• 

  Microsoft Azure

• 

  Buddy

• 

  Edgio

• 

  Fleek

• 

  Fly.io

• 

  Render

• 

  Stormkit

• 

  Surge

• 

  Cleavr

• 

  Kinsta

• 

  Zeabur

• 

  Zerops