git 더하기 github(git클라이언트 활용) / getting started with git+github

GIT�더하기�GITHUB�이준영�[email protected]�

GIT과�GITHUB�

Original�Octocat�-�https://octodex.github.com/original�

01�소스�코드를�어떻게�관리하고�계신가요?�

프로젝트_최종.zip�

ZIP

프로젝트_최종_최종2.zip�

ZIP

프로젝트_최종_최종2_마지막.zip�

ZIP

프로젝트_최종_최종2_마지막_진짜제출용.zip�

ZIP

02�조금�더�나은�버전?�

프로젝트_20160401.zip�

ZIP

프로젝트_20160405.zip�

ZIP

프로젝트_20160510.zip�

ZIP

프로젝트_20160514.zip�

ZIP

프로젝트_20160401_이준영.zip�

ZIP

하지만�혼자가�아니라면�어떻게�될까?�

프로젝트_20160401_송태웅.zip�

ZIP

프로젝트_20160401_이준영+송태웅_통합.zip�

ZIP

03�버전�관리(Version�Control)�

소스코드에서�무엇이�변경되었는지?��

누가�소스코드를�변경했는지?��

언제�소스코드가�변경되었는지?��

왜�그렇게�바뀐건지?��

이전�버전으로의�복구는�어떻게?��

…�

그래서�씁니다.�버전�관리�시스템�

04�Git?�

분산�버전�관리�시스템�

리누스�토발즈가�개발�

빠름!�

완전한�분산�환경�지원�

대규모�프로젝트에도�사용�가능�

05�GitHub?�

GitHub�:��Git�저장소�호스팅�서비스�

-  공개�저장소는�무료�

-  강력한�협업�기능�제공�

-  오픈�소스�소프트웨어의�허브�

-  확장이�용이�

-  다양한�서비스와의�연동�

-  기업을�위한�엔터프라이즈�버전�제공�

06�Octocat��https://octodex.github.com�

07�GitHub�외에도…�

Git�시작하기�

Octobiwan�-�https://octodex.github.com/octobiwan�

전에…�

01�시작하기�전에��먼저�GitHub�가입하고,�Git�클라이언트를�설치합시다.�

http://www.slideshare.net/ssusercef361/github-git�

위의�URL에서�참고해�주세요.�

09�CLI와�친해지기��터미널,�쉘

텍스트�입력�및�표시를�위한�인터페이스(텍스트�터미널)�

입력된�명령을�해석하여�운영체제로�전달�

사용자가�로그인�시�자동으로�쉘이�실행�

터미널(Terminal)�

쉘(Shell)�

현재�경로�사용자@호스트�

터미널과�쉘의�모습

프롬프트�

10�CLI와�친해지기��pwd, ls, mkdir

pwd��현재�경로�확인�

ls�파일�목록�보기�

mkdir �디렉토리(폴더)�만들기�$ mkdir my-folder

11�CLI와�친해지기��절대�경로,�상대�경로

최상위�디렉토리(루트,�/)를�기준으로�한�경로�

현재�위치를�기준으로�한�경로�

절대�경로�

상대�경로�

마침표�하나�(.)�

마침표�둘�(..)�

../..

../../..

현재�디렉토리�

상위�디렉토리�

상위의�상위?�

위의�위의�위?��

workspace

/

lotto-gen

css

js

app.js

현재�위치�

절대�경로�/workspace/lotto-gen/js/app.js

상대�경로�js/app.js

ZIP

12�CLI와�친해지기��cd�

cd��디렉토리�이동�$ cd my-folder

상위�디렉토리로�이동�$ cd ..

상대�경로로�이동�$ cd workspace/my-folder

절대�경로로�이동(Windows�기준)�$ cd /c/Users/nnoco/workspace

13�CLI와�친해지기��cat, cp

cat��파일�내용�보기�$ cat <파일명>

cp��파일�복사(mv는�이동)�$ cp <파일명> <복사할위치�또는�파일명>

14�CLI와�친해지기��rm

rm��파일�삭제�$ rm <삭제할�파일명>

비어있는�디렉토리�삭제�$ rm –r <디렉토리명>

파일이�있는�디렉토리�삭제�(절대�주의!!!)�$ rm –rf <삭제할�디렉토리>

15�CLI와�친해지기��vim�에디터�

vi��vim�에디터�실행�$ vim README.md

ESC 명령�모드로�전환i 편집(삽입)�모드로�전환dd 줄�삭제:wq 저장�후�종료:q! 저장하지�않고�종료

16�(제가)�쉬어가는�코너�

<복습하고�넘어가기>�

1. ~/workspace 디렉토리�생성,��

그�안에�자기�<GitHub_ID-lotto-gen>�디렉토리�생성하고�

2.  해당�디렉토리로�들어가기(그럼�현재위치는�~/workspace/<ID-lotto-gen>)�

3.  디렉토리�안에�vim�에디터로�hello.txt�파일�만들고,�

4.  간단한�인사말을�쓴�후�저장하고�종료�

5.  금방�만든�파일의�내용을�출력해보기�

6.  현재�위치�출력(출력�결과는�~/workspace/<ID-lotto-gen>)�

예)�nnoco-lotto-gen

Git�시작하기�

Labtocat�-�https://octodex.github.com/labtocat�

01�Git�필수�개념�집어보기��Git의�세�가지�상태�

Working�Directory�현재�작업�디렉토리,�프로젝트의�특정�버전을�체크아웃한�것�

��

Staging�Area�커밋�시�반영되는�파일이�보관되어�있는�곳�인덱스�영역이라고도�하며,�커밋하면�Git�Directory(로컬�저장소)로�이동된다.��

Git�Directory�Git으로�관리되는�프로젝트의�정보와�객체�데이터베이스가�저장되는�곳�Git�명령어를�통해�최초에�초기화�하거나�다른�저장소를�Clone하면�생성된다.�

Git을�통한�작업�순서�-  워킹�디렉토리에서�파일을�수정�

-  워킹�디렉토리에서�변경된�파일을�스테이징�영역에�추가(커밋할�스냅샷�생성)�

-  스테이징�영역의�파일을�커밋하여�Git�디렉토리에�영구적으로�저장

h"ps://git-scm.com/book/ko/v2/시작하기-Git-기초

02�Git�필수�개념�집어보기��파일의�라이프�사이클�

•  Untracked�:�Git이�파일의�변경을�추적하지�않는�상태�

•  Tracked�:�Git이�파일의�변경을�추적하고�있는�상태�

•  Unmodified�:�수정되지�않은�상태�

•  Modified�:�추적�중인�파일이�수정된�상태�

•  Staged�:�스테이징�영역에�추가된�상태�

h"ps://git-scm.com/book/ko/v2/Git의-기초-수정하고-저장소에-저장하기

03�이렇게�실습해볼�예정입니다�

간단한�로또�번호�생성�프로그램을�만들어�보면서�Git�실습�

�

1. HTML로�간단한�UI�구성�

2. 0~44의�범위에서�6개의�번호�랜덤�생성�메서드�작성�

3. 버튼에�이벤트�연결�

4. 버그�발견!��생성되는�숫자�범위�조정(1~45)�

5. 버그�발견!��중복�생성된�번호�확인�로직�추가�

6. 주석�추가�

로또는�1~45의�범위지만�일부러�틀린겁니다.

*� 화면�구성에�대한�설명�

Local Git Repository Branch Commit Logs

Working Directory

Staging Area

nnoco-lotto-genjs

hello.txt

04�사용자�정보�설정��git�config�


$ git config --global user.name “Junyoung Lee”

$ git config --global user.email “[email protected]”

git config�명령으로�사용자�이름과�이메일�설정�

Git이�커밋할�때마다�설정된�사용자�이름과�이메일�정보를�사용�

--global�옵션은�해당�시스템�전체�설정으로�적용됨�

--global�옵션을�빼면�해당�프로젝트에만�설정

Working Directory

Staging Area

nnoco-lotto-genjs

hello.txt

05�Git�저장소�만들기(초기화)��git�init�

Working Directory

Staging Area


nnoco-lotto-genjs

hello.txt $ git initInitialized empty git repository in /workspace/lotto-gen/.git

git init�명령으로�저장소�생성�

git init�명령을�실행하면�.git 디렉토리가�생성됨�

$ ls –latotal 8 drwxr-xr-x 6 root root 9 5월 13 21:16 . drwxr-xr-x 3 root root 3 5월 13 16:52 .. drwxr-xr-x 7 root root 10 5월 13 21:18 .git -rw-r--r-- 1 root root 56 5월 13 21:08 README.md drwxr-xr-x 3 root root 3 5월 13 17:02 js ...

06�추적하지�않을�파일�설정�-�.gitignore�파일�

Working Directory

Staging Area


# Git ignorehello.txt # hello.txt�파일�무시

.gitignore 파일�추가�

lo'o-gen/.gi/gnore

.gitignore에�적용된�패턴에�해당되는�파일은

Git을�통해�추적하지�않습니다.

자세한�패턴은�https://git-scm.com/book/ko/v2/Git의-�

기초-수정하고-�저장소에-저장하기#파일-무시하기�참고�

�

nnoco-lotto-genjs

hello.txt

07�스테이징�영역에�.gitignore�파일�추가��git�add�

Working Directory

.gitignore

Staging Area


git add [파일명|패턴]�으로�스테이징�영역에�추가�

$ git add .gitignore

git add –A�옵션을�주면�모든�변경된�파일�추가�

nnoco-lotto-genjs

hello.txt

08�대망의�첫�커밋!��git�commit�

Working Directory

Staging Area

.gitignore

Local Git Repository Branch1. .gitignore�파일�추가

Commit Logs

git commit –m “커밋�메시지”로�메시지와�함께�커밋�

$ git commit –m “.gitignore 파일�추가”[master (root-commit) 8fe2b9e] add .gitignore 1 file changed, 2 insertions(+) create mode 100644 .gitignore

Git은�커밋�시�메시지가�꼭�포함되어야�하며,-m “메시지”�옵션이�생략되면�기본으로�설정된vim�에디터로�커밋�메시지를�입력할�수�있습니다.�

gg

1�

master�

nnoco-lotto-genjs

.gitignore

hello.txt

09�프로젝트�소개�-�README.md�파일�만들기�

Working Directory

Staging Area

.gitignore


Commit Logs

vi README.md 명령으로�파일을�생성하고�편집�

README.md 파일은�마크다운(Markdown)��형식의�파일로써GitHub에서�디렉토리에�README.md�파일이�있으면,이를�먼저�페이지에�표시합니다.

GitHub에서�사용하는�마크다운에�대한�자세한�내용은�https://guides.github.com/features/mastering-markdown/�페이지를�참고하세요.�

gg

1�

master�

nnoco-lotto-genjs

.gitignore

README.md

# 6/45�로또�번호�생성기로또�번호�생성기를�만들며�Git과�GitHub을�배울겁니다.

10�파일�상태�확인��git�status�

Working Directory

Staging Area

.gitignore

Local Git Repository Branch1. add .gitignore

Commit Logs

git status�명령으로�파일의�상태�확인�

$ git statusOn branch master Untracked files: (use "git add <file>..." to include in what will be committed) README.md nothing added to commit but untracked files present (use "git add" to track)

빨간색은�untracked�상태녹색은�unstaged�상태변경된(파일이�추가/삭제되거나,�수정되었을�때)�파일만�표시됩니다.�

gg

1�

master�

nnoco-lotto-genjs

.gitignore

README.md

11�커밋�로그�확인��git�log�

Working Directory

Staging Area

.gitignore

Local Git Repository Branch1. add .gitignore

Commit Logs

lotto-genbinsrc

project

LottoGenerator.java

README.md

make

git log�명령으로�커밋�로그�확인�

.gitignore

$ git logcommit 8fe2b9ed4f00e242f86fb32734bd7c9a0a861b3eAuthor: Junyoung Lee <[email protected]> Date: Fri May 13 21:35:03 2016 +0000 .gitignore�추가

gg

1�

master�

순서대로�커밋�ID,�커밋�작성자,�날짜,�커밋�메시지�출력�

12�스테이징�영역에�README.md�파일�추가하고�확인�

Working Directory

README.md

Staging Area

.gitignore


Commit Logs

gg

1�

master�

nnoco-lotto-genjs

.gitignore

README.md

git add로�추가하고 git status로�확인�

$ git add . $ git status On branch master Changes to be committed: (use "git reset HEAD <file>..." to unstage) new file: README.md

-  git add�명령�시�파일�이름�대신�.�을�입력하면�현재�디렉토리�하위의�모든�파일을�추가합니다.�

-  git은�빈�디렉토리는�추적하지�않습니다.�

13�두�번째�커밋!��

Working Directory

Staging Area

.gitignoreREADME.md

Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가

Commit Logs

이번에는�–m 옵션을�생략해�봅시다.�

프로젝트�소개�추가 # Please enter the commit message for your changes. Lines starting # with '#' will be ignored, and an empty message aborts the commit. # On branch master # Changes to be committed: # new file: README.md

$ git commit

<vim�에디터>�

:wq로�저장하고�나오면�vim에서�작성한�메시지로�커밋됩니다.�

gg

1�

gg

2�

master�

nnoco-lotto-genjs

.gitignore

README.md

14�HTML로�간단한�UI�구성��복붙하세요!�

Working Directory

Staging Area

.gitignoreREADME.md

Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가

Commit Logs

gg

1�

gg

2�

master�

nnoco-lotto-genjs

.gitignore

README.md

index.html�파일을�만들고�아래와�같이�작성합니다.�

<!DOCTYPE html><html><head> <title>로또 번호 생성기</title></head><body> <input id="inputGenerated"> <button id="btnGenerate">번호 생성</button></body></html>

nnoco-lo'o-gen/index.html

index.html

15�만든�index.html�파일을�열어�봅시다.�

16�index.html�파일을�커밋해�봅시다.�

Working Directory

Staging Area

.gitignoreindex.htmlREADME.md

Local Git Repository Branch1.  .gitignore 파일�추가2.  프로젝트�소개�추가3.  HTML�파일�작성

Commit Logs

lotto-genbinsrc

project

LottoGenerator.java

README.md

make

먼저�git add�하고,�

.gitignore

gg

1�

master�

gg

2�

$ git add index.html

$ git commit –m “HTML�파일�작성“[master bd02f4e] HTML 파일 작성 1 file changed, 11 insertions(+) create mode 100644 index.htm

git commit!�

gg

3�

17�자바스크립트로�번호�생성�함수�작성!�

Working Directory

Staging Area

.gitignoreindex.htmlREADME.mdjs/app.js

Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가3.  HTML�파일�작성4.  로또�번호�생성�함수�작성

Commit Logs

gg

1�

gg

2�

master�

nnoco-lotto-genjs

.gitignore

README.md

js/app.js�파일을�만들고�아래와�같이�작성합니다.�

function generate() { var numbers = [];

for(var i=0; i<6; i++) { numbers.push(Math.floor(Math.random() * 45)); }

return numbers;}

nnoco-lo'o-gen/js/app.js

index.html

app.js

$ git add js/app.js$ git commit –m “로또�번호�생성�함수�작성”

그리고�add하고,�commit해�줍니다.�

18�jQuery를�추가하고,�이벤트�연결하기�

Working Directory

Staging Area


Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가3.  HTML�파일�작성4.  로또�번호�생성�함수�작성5.  jQuery�적용�및�버튼에�이벤트�추가

Commit Logs

gg

1�

gg

2�

master�

nnoco-lotto-genjs

.gitignore

README.md

index.html�파일을�아래와�같이�수정합니다.�

<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>로또 번호 생성기</title> <script src="./js/app.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script></head><body> <input id="inputGenerated"> <button id="btnGenerate">번호 생성</button>

<script> $(function() { $('#btnGenerate').click(function() { $('#inputGenerated').val(generate().join(', ')); }) }); </script></body></html>

nnoco-lo'o-gen/index.html

index.html

app.js

$ git add index.html$ git commit –m “jQuery�적용�및�버튼에�이벤트�추가”

그리고�index.html�파일도�add하고,�commit해�줍니다.�

19�버그�발견!��생성되는�번호의�범위�수정�

Working Directory

Staging Area



Commit Logs

generate()�함수에�심각한�결함이�있습니다.이를�수정하기�위해�branch를�활용해�보겠습니다.�

$ git checkout –b hotfix1Switched to a new branch ‘hotfix1’

파일을�수정하기�전에�git checkout 명령에�–b�옵션을더해�‘hotfix1’�브랜치를�생성하면서�체크아웃�합니다.

checkout은�브랜치나�특정�버전을�선택하여워킹�디렉토리로�가져옵니다.

이제�hotfix1�브랜치는 master와�같은�곳을�가리킵니다.

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

hotfix1�

20�브랜치�확인��git branch

Working Directory

Staging Area



Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

hotfix1�

git branch�명령을�이용해�브랜치�목록과현재�브랜치를�확인할�수�있습니다.�

$ git branch* hotfix1 master

브랜치�목록이�출력되며, hotfix1을�생성하면서체크아웃�했으므로 hotfix1�앞에�*가�있는�것을확인할�수�있습니다.

21�이제�버그를�잡아�봅시다.�

Working Directory

Staging Area



Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

hotfix1�

app.js 파일에서�잘못된�부분을�수정합니다.�


for(var i=0; i<6; i++) {

numbers.push(Math.floor(Math.random() * 45) + 1); }

return numbers;}

nnoco-lo'o-gen/js/app.js

22�변경된�내용�비교하기��git diff

Working Directory

Staging Area



Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

hotfix1�

git diff�명령을�이용해�변경된�내용을�확인할�수�있습니다.�

$ git diffdiff --git a/js/app.js b/js/app.jsindex 8b3d196..05ef149 100644--- a/js/app.js+++ b/js/app.js@@ -2,7 +2,7 @@ function generate() { var numbers = [];

for(var i=0; i<6; i++) {- numbers.push(Math.floor(Math.random() * 45));+ numbers.push(Math.floor(Math.random() * 45) + 1); }

return numbers;

삭제된�라인은�빨간색,�추가된�라인은�녹색으로�표시됩니다.또한�설정을�통해 diff�툴을�변경할�수�있습니다.�

23�변경된�파일을�스테이징�영역에�추가하고�상태�확인

Working Directory

js/app.js

Staging Area



Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

hotfix1�

git add로�추가하고, git status로�상태�확인�

$ git add –A$ git statusOn branch hotfix1 Changes to be committed: (use "git reset HEAD <file>..." to unstage) modified: js/app.js

24�커밋~!

Working Directory

Staging Area


Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가3.  HTML�파일�작성4.  로또�번호�생성�함수�작성5.  jQuery�적용�및�버튼에�이벤트�추가6.  버그�수정�–�숫자�생성�범위�조정

Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

git commit으로�커밋!�

$ git commit -m "버그 수정 - 숫자 생성 범위 조정"[hotfix1 c810813] 버그 수정 - 숫자 생성 범위 조정 1 file changed, 1 insertion(+), 1 deletion(-)

git log로�커밋�로그�확인!�$ git log --pretty=onelinec810813f1f29305c1b63a6898bea617ff9822968 버그 수정 - 숫자 생성 범위 조정dc799cc69536671d383ca6bd58ab49301f5bb2dc jQuery 적용 및 버튼에 이벤트 추가2b7391aa9530d36c03a67ff8895621ee7df9ade3 로또 번호 생성 함수 작성bd02f4e37f9b4590553092f1c2312ebd28d4279c HTML 파일 작성9dc5de5b61ed5ac4ae0300fbb06a8a7b0d4bfbcb 프로젝트 소개 추가a6beb3d05f1f37ba16ea108b23562387fb72e48b .gitignore 파일 추가

git log에�다양한�옵션을�적용하여�출력할�수�있습니다.�

gg

6�

hotfix1�

25�각�브랜치의�워킹�디렉토리�비교

Working Directory

Staging Area



Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

gg

6�

hotfix1�

현재�hotfix1의�app.js�파일은�수정된�상태입니다.�master�브랜치로�체크아웃하여�app.js�파일을�비교해�보겠습니다.�

$ git checkout masterSwitched to branch ‘master’

$ cat js/app.js...numbers.push(Math.floor(Math.random() * 45));...

hotfix1�브랜치에서�변경했던�부분이�변경�하기�전의�코드임을�확인할�수�있습니다.�브랜치가�변경되면�워킹�디렉토리의�파일도�통째로�변경됩니다.�

26�브랜치�합치기�– git merge

Working Directory

Staging Area



Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�master�

gg

4�

gg

5�

hotfix1�

git merge 명령어로�브랜치를�합칠�수�있습니다.현재�브랜치가�master인지�확인합니다.�$ git branch hotfix1* master

git merge�실행�

$ git merge hotfix1Updating dc799cc..c810813Fast-forward js/app.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-)

git merge [브랜치]�명령을�실행하면현재�브랜치에�[브랜치]를�가져와�합치게�됩니다.�

gg

6�

27�브랜치�삭제�– git branch –d [브랜치명]

Working Directory

Staging Area



Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�master�

gg

4�

gg

5�

hotfix1�hotfix1�브랜치가�삭제됩니다..�안녕ㅠ�

gg

6�

hotfix1�브랜치는�더이상�사용하지�않으므로git branch –d [브랜치]�명령으로�브랜치를�삭제합니다.�

$ git branch –d hotfix1Deleted branch hotfix1 (was c810813).

git branch�명령으로�브랜치�확인�

$ git branch* master

28�원격�저장소(Repository)�생성�(1)�

29�원격�저장소(Repository)�생성�(2]�

�

30�원격�저장소(Repository)�생성�(3)�

31�원격�저장소�설정�– git remote add

Working Directory

Staging Area



Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

gg

6�

git remote add�명령어로�원격�저장소를�설정합니다.�

$ git remote add origin [GitHub�저장소�주소]$ git remote -v origin https://github.com/nnoco/nnoco-lotto-gen (fetch) origin https://github.com/nnoco/nnoco-lotto-gen (push)

git remote -v 명령으로�원격�저장소가�등록된�것을확인할�수�있습니다.�

32�원격�저장소에�푸시(Push)��git push

Working Directory

Staging Area



Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

gg

6�

git push [Remote] [Branch]�명령으로원격�저장소에�로컬�저장소의�파일을�업로드�합니다.�

$ git push origin master Username for 'https://github.com': nnoco Password for 'https://[email protected]': Counting objects: 20, done.Delta compression using up to 8 threads.Compressing objects: 100% (16/16), done.Writing objects: 100% (20/20), 2.13 KiB | 0 bytes/s, done.Total 20 (delta 6), reused 0 (delta 0)To https://github.com/nnoco/nnoco-lotto-gen * [new branch] master -> master

인증을�위해�아이디와�비밀번호를�입력하면�푸시�과정이진행되는�것을�확인할�수�있습니다.�

33�GitHub에서�푸시�결과�확인�

34�GitHub에서�커밋�로그�확인�

35�버그�발견!��중복�생성된�번호�확인하기�

Working Directory

Staging Area



Commit Logs

gg

1�

gg

2�

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

gg

6�

아까랑�똑같죠?git checkout –b [브랜치]로�브랜치�생성&체크아웃그리고�generate 함수의�버그�수정�

$ git checkout -b hotfix2 Switched to a new branch 'hotfix2’


for(var i=0; i<6; i++) { var number = Math.floor(Math.random() * 45) + 1;

if(contains(numbers, number)) { i--; } else { numbers.push(number); } }

return numbers;}

// 배열 안에 number가 포함되어 있는지 확인function contains(numbers, number) { for(var i=0; i<numbers.length; i++) { if(numbers[i] == number) return true; } return false;}

js/app.js

이�코드도�복붙하세요~

36�add와�commit을�한�번에�

Working Directory

Staging Area


Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가3.  HTML�파일�작성4.  로또�번호�생성�함수�작성5.  jQuery�적용�및�버튼에�이벤트�추가6.  버그�수정�–�숫자�생성�범위�조정7.  버그�수정�–�중복된�번호�문제

Commit Logs

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

master�

gg

4�

gg

5�

gg

6�

사실�git add는�조금�무의미하게�반복될�때가�있어서add와�commit을�한번에�할�수�있는�방법이�있습니다.git commit�명령�실행�시�–a�옵션을�더해줍니다.�

$ git commit -am "버그 수정 - 중복된 번호 문제"[hotfix2 a968f0d] 버그 수정 - 중복된 번호 문제 1 file changed, 14 insertions(+), 1 deletion(-)

-a�옵션은�파일의�상태가�tracked인�경우에�한해서�적용되며,스테이징�영역에�파일을�추가하는�작업을��건너뛸�수�있습니다.

gg

7�

hotfix2�

37�충돌�만들기(1)�

Working Directory

Staging Area


Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가3.  HTML�파일�작성4.  로또�번호�생성�함수�작성5.  jQuery�적용�및�버튼에�이벤트�추가6.  버그�수정�–�숫자�생성�범위�조정7.  버그�수정�–�중복된�번호�문제8.  주석�수정(hotfix2)

Commit Logs

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

gg

4�

gg

5�

gg

6�

gg

7�

hotfix2�

Git은�문제가�없는�경우�자동으로�병합이�되지만, 서로�다른�브랜치에서�같은�부분이�수정된�경우에는충돌(Conflict)이�발생할�수�있습니다.임의로�충돌이�나는�상황을�만들고,�이를�수정해보겠습니다.

app.js�파일의�contains 함수�위에�있는�주석을아래와�같이�수정해�봅시다.

// 배열�안에�number가�포함되어�있는지�확인-> //== 배열�안에�number가�포함되어�있는지�확인�==//

$ git commit –am “주석�수정(master)”

그리고 –am�옵션을�주어�커밋합니다.

master�

gg

8�

38�충돌�만들기(2)�

Working Directory

Staging Area


Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가3.  HTML�파일�작성4.  로또�번호�생성�함수�작성5.  jQuery�적용�및�버튼에�이벤트�추가6.  버그�수정�–�숫자�생성�범위�조정7.  주석�수정(master)

Commit Logs

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

gg

4�

gg

5�

gg

6�

gg

7�

master�

gg

7�

gg

8�

hotfix2�

다음으로�master�브랜치로�체크아웃�한�후

// 배열�안에�number가�포함되어�있는지�확인-> /* 배열�안에�number가�포함되어�있는지�확인�*/

$ git commit -am "주석 수정(master)"[master d0e91a7] 주석 수정(master) 1 file changed, 15 insertions(+), 1 deletion(-)

$ git checkout masterSwitched to branch ‘master’

금방�복사한�소스코드를�그대로�붙여넣고,역시�주석�부분을�아래와�같이�수정합니다.

그리고�역시�master에서도 –am�옵션을�주어�커밋합니다.

39�충돌�만들기(3)�

Working Directory

Staging Area


Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가3.  HTML�파일�작성4.  로또�번호�생성�함수�작성5.  jQuery�적용�및�버튼에�이벤트�추가6.  버그�수정�–�숫자�생성�범위�조정7.  주석�수정(master)

Commit Logs

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

gg

4�

gg

5�

gg

6�

gg

7�

master�

gg

7�

gg

8�

hotfix2�

이제 git merge 명령으로�브랜치를�병합합니다.

$ git merge hotfix2Auto-merging js/app.jsCONFLICT (content): Merge conflict in js/app.jsAutomatic merge failed; fix conflicts and then commit the result.

js/app.js�파일에�충돌이�있어서Git이�자동으로�브랜치를�병합하는데�실패했다는�메시지가�표시됩니다.

자동으로�못했다면..?�수동으로�문제를�해결해야겠죠?

40�충돌�해결하기�

Working Directory

Staging Area


Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가3.  HTML�파일�작성4.  로또�번호�생성�함수�작성5.  jQuery�적용�및�버튼에�이벤트�추가6.  버그�수정�–�숫자�생성�범위�조정7.  버그�수정�–�중복된�번호�문제8.  주석�수정(hotfix2)9.  주석�수정(master)10.  머지�충돌�문제�해결

Commit Logs

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

gg

4�

gg

5�

gg

6�

gg

7�

master�

gg

7�

gg

8�

hotfix2�

편집기에서�app.js�파일을�엽니다.

<<<<<<<HEAD/*배열�안에�number가�포함되어�있는지�확인�*/=======//==배열�안에�number가�포함되어�있는지�확인�==//>>>>>>>hoEix2

주석을�수정한�부분에�기호와�함께�브랜치�이름이�있습니다.HEAD�부분이�master�브랜치에서�수정한�내용입니다.

둘�중�보존할�코드를�두고�나머지�라인을�지우고�저장합니다.

/*배열�안에�number가�포함되어�있는지�확인�*/

$ git commit –am “머지�충돌�문제�해결”[master b15e17e] 머지�충돌�문제�해결

gg

10�+�

41�커밋�로그�확인�&�원격�저장소에�Push�

Working Directory

Staging Area


Local Git Repository Branch1.  .gitignore�파일�추가�2.  프로젝트�소개�추가3.  HTML�파일�작성4.  로또�번호�생성�함수�작성5.  jQuery�적용�및�버튼에�이벤트�추가6.  버그�수정�–�숫자�생성�범위�조정7.  버그�수정�–�중복된�번호�문제8.  주석�수정(hotfix2)9.  주석�수정(master)10.  머지�충돌�문제�해결

Commit Logs

nnoco-lotto-genjs

.gitignore

README.md

index.html

app.js

gg

3�

gg

4�

gg

5�

gg

6�

gg

7�

master�

gg

7�

gg

8�

hotfix2�

gg

10�+�

병합이�어떤�모습으로�되었는지�git log로�볼�수�있습니다.

$ git log --pretty=oneline --graph* b15e17e5e9f09acce9404c3f9027d77eb7b5826a 머지 충돌 문제 해결|\| * 7627edbcbabc2506adda7ccc70c0f9f4bf5bc5ae 주석 수정(hotfix2)| * ba38b44ae9c14e27745d858736ce58de3c0d00c4 버그 수정 - 중복된 번호 문제* | d0e91a7cd346e5ab54a0b23a4a4d8e946d67d787 주석 수정(master)|/* c810813f1f29305c1b63a6898bea617ff9822968 버그 수정 - 숫자 생성 범위 조정* dc799cc69536671d383ca6bd58ab49301f5bb2dc jQuery 적용 및 버튼에 이벤트 추가* 2b7391aa9530d36c03a67ff8895621ee7df9ade3 로또 번호 생성 함수 작성* bd02f4e37f9b4590553092f1c2312ebd28d4279c HTML 파일 작성* 9dc5de5b61ed5ac4ae0300fbb06a8a7b0d4bfbcb 프로젝트 소개 추가* a6beb3d05f1f37ba16ea108b23562387fb72e48b .gitignore 파일 추가

지금까지의�커밋을�원격�저장소로�푸시합니다.$ git push origin masterUsername for 'https://github.com': nnoco Password for 'https://[email protected]': ...

GitHub�살펴보기�

Filmtocat�-�https://octodex.github.com/filmtocat�

01�프로필�페이지�

02�프로필�수정�

03�저장소�살펴보기�

04�Issues�

05�이슈�작성�

06�작성된�이슈�확인과�댓글�

07�Pull�Request�

08�Wiki�

09�위키�작성�

10�위키�확인�

11�Pulse�

12�Graph�

13�Settings�

14�Organization�생성하기�(1)�

19�Pull�Request�보내기�(1)�

GitHub�

원본�원격�저장소�nnoco/git-github-nnoco�

�Fork�원격�저장소�devignner/git-github-nnoco�

Fork�

Pull�Request�

로컬�저장소�

Push�

Clone/Pull�

1

2

3

4

Pull�Request�보내기�과정�


$ git clone https://github.com/ma-non-troppo/nnoco-lotto-gen mnt-lotto-genCloning into 'nnoco-lotto-gen'...remote: Counting objects: 36, done.remote: Compressing objects: 100% (13/13), done.remote: Total 36 (delta 15), reused 36 (delta 15), pack-reused 0Unpacking objects: 100% (36/36), done.Checking connectivity... done.

원격�저장소의�주소를�복사하여�git clone <URL> <본인아이디>-lotto-gen명령을�실행합니다�

$ ls nnoco-lotto-gen mnt-lotto-gen$ cd mnt-lotto-gen$ pwd~/workspace/nnoco/mnt-lotto-gen

ls 명령어를�실행하면�git-github-[아이디]�디렉토리가�생성된�것을�확인하실�수�있습니다.�cd�명령어로�해당�디렉토리로�들어갑니다.�

$ cd ~/workspace/nnoco

쉘에서�~/workspace/<아이디> 디렉토리로�이동합니다.�


vim�에디터로�결과�값을�정렬하도록�수정합니다.�

function generate() { // ... 기존�코드

return numbers.sort((a, b) => { return a-b });}

$ git checkout –b topicSwitched to a new branch ‘topic’

코드�수정을�위해�topic�브랜치를�만들고�체크아웃�합니다.�

$ vi js/app.js

수정�사항을�커밋합니다. 그리고�원격�저장소로�Push!��$ git commit –am “정렬�기능�추가”...$ git push origin topic …

28�Pull�Request�받기�(1)�

GitHub�

원본�원격�저장소�nnoco/git-github-nnoco�

�Fork�원격�저장소�devignner/git-github-nnoco�

Merge�Pull�Request�

Pull�Request�

로컬�저장소�

Push�(직접�merge한�경우)�

Fetch�

4

24`

1

Pull�Request�받기�과정�

merge�

3


$ git pull origin master From https://github.com/nnoco/nnoco-lotto-gen * branch master -> FETCH_HEADAlready up-to-date.

git pull�명령어로�원격�저장소의�변경�사항을�가져옵니다.�

$ git checkout -b pr Switched to a new branch 'pr'

Pull Request의�확인을�위한�브랜치�pr을�생성하고�체크아웃합니다.�

$ cd ~/workspace/nnoco/nnoco-lotto-gen

처음�실습했던�<아이디>-lotto-gen�디렉토리로�이동합니다.�

$ git remote add [보낸사람_사용자명] [보낸�사람의�Git_URL]Switched to a new branch 'pr'

Pull Request를�보낸�사용자의�원격�저장소를�추가합니다.�

$ git fetch [보낸사람_사용자명]...From https://github.com/ma-non-troppo/nnoco-lotto-gen * [new branch] master -> mnt/master * [new branch] topic -> mnt/topic

추가한�원격�저장소의�변경사항을�fetch�합니다.�


$ git merge [보낸사람_사용자명]/topicUpdating f5da55c..509bcf9Fast-forward js/app.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-)

Pull Request를�확인하기�위해�pr�브랜치로�병합합니다.�

이상없이�병합이�되고,�기능상의�문제가�없음이�확인되면�pr�브랜치를�제거하기�위해master�브랜치로�체크아웃합니다.�$ git checkout master Switched to branch 'master'

pr�브랜치를�제거합니다.�$ git branch –d prDeleted branch pr (was 509bcf9).

맛깔나게�활용하는�

GIT과�GITHUB�

Adventure�Cat�-�https://octodex.github.com/adventure-cat�

01�GitHub�페이지�활용하기�(1)�

08�Gist�(1)�

09�Gist�(2)�

10�Gist�(3)�

11�Gist�(4)�

12�GitBook�(1)�

13�GitBook�(2)�

GIT,�좀�더�깊게�보기�

20%�Cooler�Octocat�-�https://octodex.github.com/twenty-percent-cooler-octocat�

01�.git�디렉토리�살펴보기�

COMMIT_EDITMSG�

HEAD�

ORIG_HEAD��

branches�

config�

description�

hooks�

index�

info�

logs�

objects�

refs�

마지막�커밋�메시지�

현재�체크아웃한�브랜치를�가리키는�포인터�

origin의�헤드를�가리키는�포인터�

예전�버전에�사용한�브랜치�정보�

해당�프로젝트에만�해당되는�설정�

GitWeb�등에서�사용하는�프로젝트�정보�

클라이언트�훅(Hook)이나�서버�훅�스크립트�위치�

스테이징�영역의�정보를�저장�

.gitignore와�같은�역할을�하며�버전관리는�되지�않음�

커밋�로그�정보�

모든�정보를�저장하는�데이터베이스�

커밋�객체의�참조�정보(포인터)�저장�

02�Git�Branch�전략�

h'p://nvie.com/posts/a-successful-git-branching-model/

1.  개발�브랜치(Develop)에서�작업�브랜치(feature)를�

생성해서�기능을�구현하거나�수정�

2.  작업�브랜치(feature)에서�코드를�모두�작성하면,�개발�

브랜치(develop)에�merge�

3.  1번과�2번을�반복하면서�배포할�수�있는�수준까지�개

발�

4.  배포를�위한�릴리즈�브랜치(release)를�생성�

5.  배포�작업이�끝나면�master�브랜치에�merge하고,�버

전�태그를�붙여서�배포�

6.  배포하고�있는�소프트웨어에�버그가�있는�경우에는�해

당�버전을�기반으로�수정(hotfixes�브랜치)�

-  master�브랜치는�항상�안정된�버전(배포�가능한�버전)�

-  브랜치가�많아서�복잡할�수�있음�

-  git-flow�툴을�설치하여�효율적으로�관리�가능�

-  어떤�브랜치가�서로�상호작용�하는지�이해하고�있어야�

함�

�

03�Commit�Message의�활용�(1)�

커밋�메시지는�‘잘’�작성해야�합니다.��커밋�가이드라인�

•  공백�문자를�깨끗이�제거한다.�

•  최대한�수정�사항을�하나의�주제로�요약한다.�

•  여러�가지�이슈에�대한�수정사항을�하나의�커밋에�담지�않는다.�

•  적절한�메시지를�작성한다�:�반드시�좋은�커밋�메시지를�담는다.�

•  같은�파일의�다른�부분을�수정하는�경우에는�git�add�-patch�명령을�이용한

다.�

•  한�부분씩�나누어�Stage�영역에�저장한다.�


커밋�메시지�양식�

•  첫�줄에는�50자(영문,�한글�25자)�로�간략히�요약해서�작성한다.�

•  두�번째�줄을�비우고�세�번째�줄에�자세하게�설명글을�작성한다.�

(개발동기,�구현�상황,�제약조건/상황�등)�

•  글은�현재형을�사용한다.�

•  추가�내용은�한�줄�띄우고�시작한다.�

•  커밋�메시지가�잘�쓰여진�프로젝트를�받아서�git�log�--no-merges�명령으로�살펴

본다.�

RedirectusertotherequestedpageaPerloginh'ps://trello.com/path/to/relevant/cardUserswerebeingredirectedtothehomepageaPerlogin,whichislessusefulthanredirec/ngtothepagetheyhadoriginallyrequestedbeforebeingredirectedtotheloginform.*Storerequestedpathinasessionvariable*Redirecttothestoredloca/onaPersuccessfullyloggingintheuser

커밋�메시지�영문�예시�


GitHub의�커밋�메시지�활용�

•  관련�이슈�링크�

커밋�메시지에�#이슈번호�를�쓰면�해당�이슈�링크가�자동으로�생성�

•  이슈�닫기(Close)�

fix�#이슈번호,�fixes�#이슈번호,�fixed�#이슈번호,�close�#이슈번호,�resolve�#이슈번호�등�

Open�상태인�이슈는�커밋�메시지로�인해�자동으로�Close�됨�

•  알림(Notification)�보내기�

@사용자이름�또는�@조직이름을�쓰면�해당�사용자나�조직�멤버에게�알림�전송�

@조직이름�팀이름을�쓰면�해당�팀에게�알림�전송�

GitHub�Integration�

Where’s�Waldocat�-�https://octodex.github.com/wheres-waldocat�

01�TravisCI��지속적�통합(CI,�Continuous�Integration)�서비스�

02�Coverall�테스트의�커버리지�측정�및�통계�

03�Codeclimate��소스코드�정적�분석�서비스�

04�Badges�

더�볼�수�있는�곳들�

Professortocat_v2�-�https://octodex.github.com/Professortocat_v2�

01�http://learngitbranching.js.org�

02�https://try.github.com��

03�https://www.codecademy.com/learn/learn-git��

04�책과�사이트�

•  생활코딩�Git�코스�-�https://opentutorials.org/course/1492�

•  Pro�git(Web)�-�https://git-scm.com/book/ko/v2�

•  Git�간편�안내서�-�http://rogerdudler.github.io/git-guide/index.ko.html�

•  A�Visual�Git�Reference�-�http://marklodato.github.io/visual-git-guide/index-ko.html�

Pro�Git(종이책)�스캇�샤콘�저,�박창우,�이성환,�최용재�옮김�

소셜�코딩으로�이끄는�GitHub�실천�기술�오오츠카�히로키�저,�윤인성�옮김�

감사합니다!�

Mountietocat�-�https://octodex.github.com/mountietocat�

이준영��Junyoung�Lee�http://nnoco.tistory.com�

[email protected]�https://www.facebook.com/nnoco�

�

폰트�정보�

Courier

a옛날사진관1�





Sandoll 격동굴림

HG꼬딕씨_Pro�00g�






git 더하기 github(git클라이언트 활용) / getting started with git+github

Technology