개발자의 필수 교양! 내 코드를 GitHub에 올리는 가장 쉬운 방법 (Git 기초 가이드) 🐱

 

안녕하세요!

지난 포스팅에서 Vercel을 이용해 쉽고 빠르게 배포하는 방법을 소개해 드렸는데요. Vercel을 100% 활용하려면 먼저 내 코드가 GitHub에 올라가 있어야 합니다.

 

"터미널 검은 화면만 보면 무서워요..." 하시는 분들을 위해, 오늘은 프로젝트 폴더를 GitHub 리포지토리(저장소)에 업로드하는 과정을 단계별로 정리해 드리겠습니다. 딱 4단계만 따라오세요!

 

---

준비물 🎒

1. Git 설치: 컴퓨터에 Git이 설치되어 있어야 합니다. (터미널에 git --version을 쳐서 확인!)
2. GitHub 계정: GitHub.com 회원가입
3. 내 프로젝트 코드: 배포할 HTML/CSS 파일이나 React/Next.js 프로젝트 폴더.

---

Step 1. GitHub에 '빈 방' 만들기 (Repository 생성)

가장 먼저 내 코드가 들어갈 온라인 저장소를 만들어야 합니다.

1. GitHub에 로그인하고 우측 상단의 + 버튼을 눌러 **[New repository]**를 클릭합니다.
2. Repository name에 프로젝트 이름을 적습니다. (예: my-portfolio)
3. Public(공개) 또는 Private(비공개)를 선택합니다.
   • Tip: 포트폴리오 용도라면 Public을 추천해요!
4. 맨 아래 [Create repository] 초록색 버튼 클릭!

[이미지: GitHub Repository 생성 화면]

이제 온라인에 빈 방이 생겼습니다. 화면에 보이는 HTTPS 주소(https://github.com/.../....git)를 복사해 두거나 창을 켜두세요.

---

Step 2. 내 컴퓨터에서 Git 시작하기 (Init)

이제 VS Code(또는 터미널)를 열고 내 프로젝트 폴더로 이동합니다.

터미널에 아래 명령어를 입력해서, 이 폴더를 Git이 관리하도록 설정합니다.

    git init
  

• 성공 시: Initialized empty Git repository in... 이라는 메시지가 뜹니다. 이제부터 Git이 이 폴더의 변경 사항을 추적하기 시작합니다.

---

Step 3. 파일 담고 기록 남기기 (Add & Commit)

이제 변경된 파일들을 장바구니에 담고(Add), 영수증을 끊는(Commit) 과정입니다.

 

1. 장바구니에 담기 (Staging)

모든 파일을 올릴 것이므로 점(.)을 찍어줍니다.

 

    git add .
  

 

2. 기록 남기기 (Commit)

어떤 작업을 했는지 메시지를 적어 저장합니다. 첫 저장이니 'first commit'이라고 적겠습니다.

    git commit -m "first commit"
  

---

 

 

Step 4. GitHub와 연결하고 쏘아 올리기 (Push) 🚀

이제 내 컴퓨터의 Git과 아까 만든 GitHub의 '빈 방'을 연결할 차례입니다.
(Step 1에서 켜둔 창에 있는 명령어를 그대로 복사하면 편합니다!)

 

1. 주소 연결하기 (Remote Add)

    git remote add origin https://github.com/내아이디/내프로젝트명.git
  

• origin이라는 이름으로 방금 만든 GitHub 주소를 등록하는 과정입니다.

 

2. 브랜치 이름 변경 (선택 사항)

요즘은 기본 브랜치 이름을 master 대신 main으로 많이 씁니다.

    git branch -M main
  

 

3. 업로드 하기 (Push)

드디어 코드를 온라인으로 쏘아 올립니다!

    git push -u origin main
  

• 로그인 창이 뜨면 GitHub 아이디와 비밀번호(또는 토큰)를 입력해 주세요.
• 터미널에 주루룩 진행 상황이 뜨고 완료되면 성공입니다!

[이미지: 터미널에서 git push가 성공한 화면]

---

 

💡 요약 (복사해서 쓰세요!)

프로젝트를 시작할 때마다 이 순서를 기억하세요.

    # 1. 깃 초기화
git init

# 2. 모든 파일 스테이징
git add .

# 3. 커밋 메시지 작성
git commit -m "내용 작성"

# 4. 깃허브 주소 연결 (처음 한 번만)
git remote add origin [내-리포지토리-주소]

# 5. 깃허브로 업로드
git push origin main
  

---

 

 

🥳 이제 무엇을 하면 되나요?

축하합니다! 이제 여러분의 소중한 코드가 GitHub라는 안전한 금고에 저장되었습니다.

1. Vercel 배포: GitHub에 코드가 올라갔으니, 이전 포스팅에서 다룬 것처럼 Vercel과 연동하여 버튼 한 번으로 사이트를 배포할 수 있습니다.
2. 잔디 심기: 매일매일 코드를 수정하고 Push를 하면 GitHub 프로필의 잔디(Contribution Graph)가 초록색으로 채워집니다. 성실함의 증표죠! 🌿

 

Git은 처음엔 낯설지만, 개발자에게는 숨 쉬는 것처럼 자연스러운 도구가 되어야 합니다. 오늘 포스팅이 도움이 되셨다면 GitHub에 첫 커밋(Commit)을 날려보세요!