| type | title | description | i18nReady |
|---|---|---|---|
tutorial |
웹에 사이트 배포 |
튜토리얼: 첫 번째 Astro 블로그 구축 — 튜토리얼 프로젝트의 GitHub 저장소를 Netlify에 연결하고 웹에 배포 |
true |
import Checklist from '/components/Checklist.astro';
import Box from '/components/tutorial/Box.astro';
import MultipleChoice from '/components/tutorial/MultipleChoice.astro';
import Option from '/components/tutorial/Option.astro';
import PreCheck from '/components/tutorial/PreCheck.astro';
import { Steps } from '@astrojs/starlight/components';
import Badge from "/components/Badge.astro"
여기에서는 GitHub 저장소를 Netlify에 연결합니다. Netlify는 코드 변경 사항을 커밋할 때마다 해당 프로젝트를 사용하여 웹에서 사이트를 실시간으로 빌드하고 배포합니다.
:::tip[우리가 사용할 도구] 이 튜토리얼에서는 Netlify를 사용하지만 사이트를 인터넷에 배포하기 위해 선호하는 호스팅 서비스를 사용해도 됩니다. :::
1. 아직 계정이 없다면 [Netlify](https://netlify.com)에서 무료 계정을 만드세요.사용자 이름을 기록해 두세요. `https://app.netlify.com/teams/username`에서 대시보드와 생성한 모든 사이트를 볼 수 있습니다.
-
Add new site > Import an existing project를 클릭하세요.
Git 공급자에 연결하라는 메시지가 표시됩니다. GitHub를 선택하고 화면에 표시된 단계에 따라 GitHub 계정을 인증하세요. 그런 다음 제공된 목록에서 Astro 프로젝트의 GitHub 저장소를 선택하세요.
-
마지막 단계에서 Netlify는 앱의 사이트 설정을 표시합니다. Astro 프로젝트에 대한 기본값이 정확해야 하므로 아래로 스크롤하여 Deploy site를 클릭할 수 있습니다.
축하합니다. Astro 웹사이트가 생겼습니다!
Netlify의 사이트 개요 페이지에는 무작위로 생성된 프로젝트 이름과 https://project-name-123456.netlify.app 형식의 웹사이트 URL이 표시됩니다. 프로젝트 이름을 좀 더 기억하기 쉬운 이름으로 변경하면 URL이 자동으로 업데이트됩니다.
사이트 설정에서 URL을 클릭하거나 브라우저 창에 해당 URL을 입력하여 새 웹사이트를 확인하세요.
기존 웹사이트의 홈 페이지를 업데이트하려고 합니다. 어떤 조치를 취하나요?
터미널을 열고 'create astro'를 실행한 다음 Netlify URL을 방문합니다. Netlify 앱에서 설정을 변경한 다음 StackBlitz에서 새 Astro 프로젝트를 포크합니다. `index.astro`를 편집합니다. 변경 사항을 GitHub에 커밋하고 푸시합니다. 나머지는 Netlify가 처리합니다! ## 체크리스트 - [ ] 업데이트된 웹사이트를 온라인으로 볼 수 있습니다. - [ ] 이제 코딩으로 돌아갈 준비가 되었습니다!-
[Netlify 배포에 대한 단계별 안내서](https://www.netlify.com/blog/2016/09/29/a-step-by-step-guide-deploying-on-netlify/)