초심자를 위한 git과 github 30분 맛보기

두 줄 요약

github에 소스 업로드하고 다른 사람과 공유하기 
- 업로드할 파일 선택하고 add -> commit -> push

절차

  1. github 가입
  2. github 저장소 생성
  3. github 저장소 클론
  4. 내 컴퓨터의 내 문서 아래에 생성된 프로젝트 디렉토리에서 파일 생성 및 작업 완료
  5. 커밋할 파일들 선택해서 스테이지에 올리기 (add)
  6. 커밋하기 (commit)
  7. 푸시하기 (push)
  8. github.com/내아이디/내프로젝트 링크를 통해 정상적으로 업로드 되어 있는지 확인

git 이란?

형상 관리 시스템(Verson Control System) 의 한 종류입니다. 
주로 개발자들이 프로그램과 관련된 파일들을 저장하는 데 사용합니다. 
게임의 세이브 포인트와 유사한데, 언제든지 저장 시점으로 되돌아 갈 수 있습니다. 
여기서는 세 가지 기본 기념만 배우려 합니다.

커밋 (commit)

게임의 세이브에 해당하는 행동을 git에서는 커밋이라고 합니다. 
다시 말해서 여러분은 언제든지 커밋한 시점으로 되돌아 갈 수 있습니다 . 
커밋을 하려면 저장을 원하는 파일들을 묶어서 커밋 명령을 수행하면 됩니다.

스테이지에 올린다 (add)

앞에서 커밋하기 전에 저장을 원하는 파일들을 묶는 일을 해야 한다고 했습니다. 
이 작업을 스테이지에 파일을 올린다라고 합니다. 
혹은 줄여서 간단히 ‘add’라고도 합니다.

github에 업로드 (push)

커밋을 하면 이제 현재 작업 내용의 세이브 데이터가 내 컴퓨터에 저장됩니다. 
이걸 github에 업로드하면 마치 요즘 유행하는 스팀이나 PS4, 각종 모바일 게임의 원격 저장과 비슷한 일을 합니다. 
다른 사람이랑 공유할 수도 있고, 내 컴퓨터의 데이터가 날아가도 안전하게 다시 복구할 수 있습니다. 
github에 업로드하는 걸 git에서는 “push”라고 합니다.

직접 해 보기

github.com 가입

https://github.com/join 를 통해 깃헙 가입을 합니다. 
주의사항1: 깃헙은 아이디 노출도가 높습니다. 개발자스러운 아이디를 신중하게 고릅시다. 
주의사항2: 가입 후 이메일 인증을 해야 가입이 완료됩니다. 
참, 깃헙의 캐릭터는 옥토캣입니다. 개발자들 사이에게 인기가 매우 높죠.

옥토캣 이미지는 여기서 구경할 수 있어요. 
https://octodex.github.com/

저장소 생성

가입 후에는 저장소를 하나 만들어 봅시다. 
초록색 new repository 버튼을 눌러서 저장소를 만듭니다. 
첫번째 저장소 이름은 ‘hello-world’가 좋겠네요. 
아래 그림을 참고해서 만들어 봅시다.

만들고 나면 여러분의 첫번째 저장소가 생깁니다. 이 저장소의 주소를 메모장 등에 저장해 놓습니다. 
참고로 저장소 주소의 규칙은 https://github.com/내아이디/저장소이름 입니다. 
방금 만든 제 저장소는 https://github.com/honux77/hello-world 가 되겠죠.

Source Tree 설치

우리는 조금 더 편하기 git을 사용하기 위해서 source tree 를 설치하려고 합니다. 터미널 명령은 나중에 배우세요. https://www.sourcetreeapp.com/ 에서 다운받을 수 있습니다. 
- 주의사항1: 아틀라시안에 가입을 해야 합니다. 
- 주의사항2: bitbucket 등의 설정을 하라고 하는데 skip하는 게 편합니다.

Source Tree를 통해서 저장소 클론

이제 소스 트리를 실행해 봅시다. 소스트리의 ‘Clone’ 또는 ‘복제 / 생성’ 메뉴를 통해 github 에서 생성한 저장소를 클론해 올 수 있습니다. 
앞 단계에서 메모장에 붙여 넣었던 저장소 주소를 넣어주면 됩니다. 
보통 “내문서” 아래에 저장소 이름과 같은 새로운 폴더가 만들어 집니다.

작업 후 스테이지에 파일 추가

만들어진 폴더를 열고 에디터 등을 이용해 hello.html을 만들어 봅시다. 
참 저장 위치는 Documents/hello-world/가 되겠죠? 
hello.html

<!DOCTYPE html>
<html>
<body>
<h1>Hello JS</h1>
<script>
console.log(“Hello world!”);
</script>
</body>
</html>

에디터로 파일을 만들고 저장합니다.

만들고 나서 소스트리로 돌아가 보면 상태가 변해 있습니다. 우리가 생성한 파일이 보이죠? 이걸 스테이지에 올려야 커밋할 수 있습니다. 모두 스테이지에 올리기 버튼을 클릭합니다.

커밋하기

원하는 파일이 스테이지에 올라갔다면 커밋을 해야 합니다. 
커밋 = 세이브라는 거 꼭 기억하세요. 
커밋을 하면 스테이지에 있는 파일들이 커밋으로 저장됩니다.

커밋 주의사항

커밋에는 주의사항이 있습니다. 
1. 반드시 한 번에 하나의 논리적 작업만을 커밋합니다. 
2. 커밋 메시지를 잘 적어야 합니다. 
특히 커밋 메시지는 미래의 여러분과 다른 개발자를 위해서 꼼꼼히 적어야 합니다.

커밋 메시지 작성법

  1. 첫 줄에 간단하지만 명확하게 내용을 씁니다.
  2. 한 줄 비우고
  3. 자세한 내용을 적습니다.

2와 3은 옵션이지만 가급적이면 해 주는 게 좋습니다. 
아래 그림처럼 커밋 메시지를 작성하고 커밋 을 눌러 커밋합니다.

github에 업로드하기 = push

github의 저장소는 다른 클라우드 저장소와는 달라서 파일을 올리려면 개별적으로 올릴 수 없습니다. 업로드의 단위가 커밋이구요. 커밋을 업로드하는 것을 우리는 ‘push’ 라고 말합니다. 
푸쉬는 엄청 쉽습니다. 정상적으로 커밋하면 push 단추에 “1” 이라는 글씨가 써지는데, 이제 푸시 단추를 누르기만 하면 됩니다. 
무언가 무서운 내용이 많이 나오는데 일단은 무시하고 푸시 푸시 단추를 두 번 누릅니다. 예전 핸드폰 게임 생각이 나는군요. 구루구루라는 만화도 갑자기 생각이… 처음에는 github 인증창이 나올 겁니다만, 두번째부터는 나오지 않습니다.

마지막으로 확인하기

이제 github.com 의 저장소로 가시면 업로드 내용을 볼 수 있어요. 짜잔! 친구들에게 자랑합시다!

참고 영상

위 내용을 찍은 유튜브 영상입니다.

코드스쿼드 유튜브 좋아요와 구독하기도 눌러 주세요!

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.