Astro Site를 인터넷에 배포하는 방법


Astro site를 인터넷에 배포하는 방법에 대해 알아보겠습니다.
저는 GitHub Pages를 사용하겠습니다.

astro.config.mjs 파일의 defineConfig 함수 안에 아래의 코드를 넣어줍니다.

site: 'https://username.github.io'

  • 여기서 username은 GitHub 계정의 username을 의미합니다.

  • 위 site 도메인으로 당신의 웹사이트에 진입할 수 있습니다.

.github/workflows/deploy.yml 경로에 새 파일을 만들고 아래 코드를 붙여넣습니다.

name: Deploy to GitHub Pages

on:
push:
branches: [ main ]
workflow_dispatch:

permissions:
contents: read
pages: write
id-token: write

jobs:
build:
runs-on: ubuntu-latest
steps:
\- name: Checkout your repository using git
uses: actions/checkout@v4
\- name: Install, build, and upload your site
uses: withastro/action@v3

deploy:
needs: build
runs-on: ubuntu-latest
environment:
 name: github-pages
 url: ${{ steps.deployment.outputs.page_url }}
steps:
 \- name: Deploy to GitHub Pages
 id: deployment
 uses: actions/deploy-pages@v4

  • GitHub Repository를 생성합니다.

  • 사용할 GitHub Repository 이름을 username.githhub.io 형식으로 생성합니다.

  • github.io 는 GitHub Pages를 사용해 정적 웹사이트를 배포할 수 있는 플랫폼입니다.

  • GitHub Repository를 생성한 후 우리는 해당 Repository의 GitHub Actions 을 활성화 해야 합니다.

  • 배포할 GitHub Repository의 Setting -> Pages -> Build and deployment 의 source 값을 GitHub Actions 로 바꿔줍니다.

이제 당신의 Astro Project가 GitHub Pages 를 통해 배포되고 있습니다.