Astro 블로그 Github 연동
VSCode에서 Github 사용하는 방법
kui-o
Astro 블로그 시리즈
- Astro 블로그 만들기
- Astro 블로그 Github 연동
들어가며
이전 글에서 Astro를 이용해 블로그를 구축했는데요.
블로그에 글을 작성하면 자동으로 배포돼서 누구든 볼 수 있게 하기 위해
준비 작업으로 Github 연동하려고 합니다.
Github란
현재는 블로그 파일들이 내 PC에 저장돼 있는데요
이 코드를 Github(깃허브) 서버에 올릴 겁니다.
Github에 올리게 되면
다른 기기에서도 언제든지 코드를 받을 수 있고,
누가 어느 부분을 수정했는지 이력도 볼 수 있고,
특정 시점으로 코드를 되돌릴 수도 있고,
코드가 변경되면 이를 인식해서 자동으로 배포되게 할 수도 있습니다.
더 자세한 내용이 궁금하다면 아래 글을 참고하세요.
Git 설치
- Git 공식 홈페이지에 접속합니다.
- 자신에게 맞는 ①OS를 선택한 뒤 ②설치 프로그램을 다운로드하여 실행합니다.
3. (선택) CMD 창에서 git -v를 입력하여 설치가 완료되었는지 확인합니다.
> git -v
git version 2.55.0.windows.2Github 계정 생성
(이미 계정이 있다면 건너 뛰세요)
- Github 홈페이지에 접속합니다.
- 우측 상단에 Sign up 버튼을 누릅니다.

- 구글, 애플 계정 연동 혹은 적절한 정보(이메일, 비밀번호, 아이디)를 넣어 계정을 생성합니다.

Github 연동
- ①상단메뉴 File > ②Open Folder > ③생성한 폴더 선택 > ④ Select folder를 눌러 폴더를 엽니다.

- ①소스제어 탭 > ②Github에 게시 > ③허용 선택

- 계정 연동을 진행합니다.

- 인증을 완료하면 상단에 팔레트가 뜹니다.
원하는 ①레포지토리명이 있다면 작성합니다. - 소스코드(블로그 파일)을 외부에 공개하지 않을 거라면 ⒜를 외부에 공개할 거라면 ⒝를 선택합니다.
(가이드에서는 ⒜ 비공개를 선택했습니다.)

- 만약 로그인 화면이 뜬다면 Sign in with your browser를 눌러 로그인합니다.

- 생성 완료

Github 파일 추가 방법
- ①탐색기 탭을 눌러 폴더로 돌아간 뒤 src > content > blog 아래 github-test.md 파일을 생성합니다.

- 내용을 작성합니다.
---
title: 'Github 테스트'
description: 'Github 동작 테스트를 위한 글입니다'
pubDate: 'Jul 13 2026'
heroImage: '../../assets/blog-placeholder-1.jpg'
---
## Github 구축 완료
Github에 Repository를 정상적으로 생상하였습니다.
코드가 정상적으로 업로드(Push) 되는지 테스트 해보겠습니다.- ①소스제어 탭을 눌러 다시 Git으로 되돌아 옵니다.

- ①변경 내용 스테이징을 눌러 Git 대상 파일임을 명시합니다.
- ②커밋 메시지에 작업에 대한 내용을 작성합니다. 예) Add git-test.md
- ③커밋을 클릭합니다.
- ④커밋 내역이 쌓인 것을 확인할 수 있습니다.

- 변경내용 동기화를 눌러 Github 서버로 업로드(Push) 합니다.
- main(로컬)과 origin/main(서버)의 커밋이 같아진 걸 확인할 수 있습니다.

마치며
Git은 어렵지만 잘 사용하면 굉장히 편리한 도구입니다.
저도 처음에 협업용 도구라고만 생각해서 잘 쓰지 않았는데요
파일을 외장하드에 넣고 다닐 필요 없이 어디서든 수정할 수 있다는 건 굉장히 큰 매력 같습니다.
다음 글에서는 Github에 Push 하면 웹 서버에 자동으로 배포하는 방법에 대해 소개 드리겠습니다.
긴 글 읽어 주셔서 감사합니다.