[D2 fest 2014]yobi hands on lab

41
insanehong@NAVER Labs. 김덕홍 / NAVER Labs twitter : @insanehong blog : http://insanehong.kr Yobi hands on lab

description

 

Transcript of [D2 fest 2014]yobi hands on lab

Page 1: [D2 fest 2014]yobi hands on lab

insanehong@NAVER Labs.

김덕홍 / NAVER Labs twitter : @insanehong blog : http://insanehong.kr

Yobi hands on lab

Page 2: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

!• Yobi at NAVER Labs !• FRENDS(Front-end Developers) !• KGUG(Korea Git User Group) !• Hackrslab Opens Source Team !• http://about.me/insanehong

발표자 소개

Page 3: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

• Yobi란? !

• Yobi 기능 소개 !

• Yobi 를 이용한 Fork & Pull Model 실습

개요

Page 4: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

• 기본적인 Yobi 기능을 활용할 수 있었으면… !

• Fork & Pull Model 을 익힐 수 있다면… !

•적어도 .zip file 로 source code 를 올리는 일은 없게….;;

목표

Page 5: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

목표

Page 6: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

Yobi 란?

!• 설치형 프로젝트 호스팅 소프트웨어 !• Open Source - Apache2 License !• All-in-one - java7+ / online !• Windows / Mac / Linux 지원 !• http://yobi.io

Page 7: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

Yobi 란?

!• Play Framework / JAVA !• EBean (ORM) !• JGit !• H2 Embedded DB !• Twitter Bootstrap, Less

Page 8: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

주요 기능들

• 이슈 트레커 !• 코드 저장소 - git, svn !• 코드 리뷰 - block comment, line comment !• 온라인 코드 브라우저 !

• 게시판, 마일스톤 !• 그룹기능, 멘션, notification 등등

Page 9: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

자 이제부터 절 따라해보세요! 엄청 쉬워요!

https://www.flickr.com/photos/lyntally/5007650073

Page 10: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

Git 설정하기

$ git config --global user.name “username” # git commit 시 autor 정보로 사용될 username 설정

$ git config --global user.email "[email protected]" # git commit 시 autor 정보로 사용될 email 설정

• Username

• Email

Page 11: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

프로젝트 만들기(1)

Page 12: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

프로젝트 만들기(2)

Page 13: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

프로젝트 만들기(3)

Page 14: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

Local 코드 저장소 만들기

$ mkdir ~/hello-world # 프로젝트 디렉토리 생성 !$ cd ~/hello-world # 생성한 프로젝트 디렉토리로 이동 !$ git init # git 저장소 초기화 - 현재 디렉토리에 “.git” 디렉토리가 생성됨 !$ git remote add origin 원격 저장소 URL # 원격 저장소로 코드를 보내기 위한 원격저장소 URL 등록 # git remote add origin http://[email protected]/insanehong/hello-world !$ git remote -v # 등록된 원격 저장소 확인

• Local 에 새로운 git repository 생성 - git init

Page 15: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

commit & push command 이해(1)

$ touch README.md # vi, text editor 등을 이용하여 README.md 파일을 열고 “hello world” 를 입력하고 저장 !$ git status # working directory 의 변경사항 확인 !$ git add README.md # commit 이전에 working directory 변경내용을 staging 영역으로 옮김 !$ git commit -m "커밋할 내용을 최대한 상세히 적는 것이 좋음" # git commit -m "initialize commit : add readme file" # 여러줄의 메세지를 남기고 싶은 경우 git commit 만 입력 !$ git log # commit 이 제대로 이루어졌는지 확인 !$ git push origin master # local repository 이루워진 새로운 commit 을 remote repository 로 push

Page 16: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

commit & push command 이해(2)

Page 17: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

어때요? 참 쉽죠?!

https://www.flickr.com/photos/24293932

Page 18: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

프로젝트 코드 관리 및 개발 방법

• Branching model - commit 권한을 가지고 있어야 함. - 원본 저장소를 기반으로 branch 를 나누어서 개발하는 방법. - master, devel, feature, hofix 등의 branch 를 나누어서 개발 - gitflow • Fork & Pull model - commit 권한을 가지고 있지 않은 사람들 . - 원본 저장소에 commit 권한이 없어도 변경사항에 대한 반영을 요청 할수 있음

Page 19: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

왜 Fork & Pull model 을 실습하나요?

• 많은 Open Source Project 들이 선택하고 있는 코드 기여의 방법 !

• 팀 단위 프로젝트에서도 사용가능 한 방법 중 하나 !

• Yobi 도 Fork & Pull model 를 사용하여 개발하는 중 !!

Page 20: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

원본 프로젝트의 코드 저장소 복사(fork) 하기(1)

Page 21: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

원본 프로젝트의 코드 저장소 복사(fork) 하기(2)

Page 22: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

원본 프로젝트의 코드 저장소 복사(fork) 하기(3)

Page 23: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

Local에 복사한 코드 저장소 만들기

$ git clone 복사한 저장소 URL # 원본 저장소가 아닌 복사한 저장소의 URL 을 사용. # git clone http://[email protected]/insanehong/yobi-hands-on !$ cd ~/yobi-hands-on # 프로젝트 디렉토리로 이동 !$ git remote add upstream 원본 저장소 URL # 원본 저장소 변경사항을 받아오기 위해 원본 저장소를 upstream 으로 등록 # git remote add upstream http://[email protected]/D2FEST2014/yobi-hands-on !$ git remote -v # 등록된 원격 저장소 확인. 원본 저장소와 복사한 저장소가 잘 등록돼었는지 확인

• 복사한 저장소 받아오기 - git clone

Page 24: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

새로운 파일을 만들어 복사한 저장소에 올리기 (1)

$ cp ./whoami.md ./whoami-00.md # whoami.md 파일 복사하고 vi, text editor 등을 통해서 내용을 수정. !$ git add whoami-00.md # git add whoami-00.md !$ git commit -m "새로운 커밋에 대한 상새한 설명" # git commit -m "whoami.md 파일을 복사해서 whoami-00.md 파일을 만들고 프로필 입력 함" !$ git push origin master # 복사 한 원격 저장소에 새로운 commit 내용을 push # 원본저장소가 아닌 복사한 저장소로 push 하는 것이 핵심

• forked repository 에 new commit & push 하기

Page 25: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

새로운 파일을 만들어 복사한 저장소에 올리기(2)

Page 26: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

변경된 내용을 원본 저장소에 Pull Request (1)

Page 27: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

변경된 내용을 원본 저장소에 Pull Request (2)

Page 28: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

변경된 내용을 원본 저장소에 Pull Request(3)

Page 29: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

변경된 내용을 원본 저장소에 Pull Request(4)

Page 30: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

코드 리뷰(1)

Page 31: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

코드 리뷰(2)

# vi, text editor 등을 이용해서 리뷰 내용을 반영하여 수정. !$ git add whoami-00.md !$ git commit -m "새로운 커밋에 대한 상새한 설명" # git commit -m “불필요한 닉네임 정보 삭제" !$ git push origin master # 리뷰를 반영하여 추가된 commit 을 복사된 저장소로 push # git push origin master

• 코드 리뷰 반영해서 commit & push 하기

Page 32: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

코드 리뷰(3)

Page 33: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

코드 리뷰(4)

Page 34: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

Pull Request 변경내용을 원본 저장소에 병합(1)

Page 35: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

Pull Request 변경내용을 원본 저장소에 병합 (2)

Page 36: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

원본저장소의 변경된 내용을 local 저장소에 반영하기(3)

$ git fetch upstream # 원본 저장소의 변경된 내용(commit)을 받아온다. !$ git merge upstream/master # 원본 저장소에서 받아온 변경 내용을 local 저장소에 병합 !$ git log master # 추가된 commit 내용 확인

• merge 된 commit을 local 저장소의 master branch 에 반영

Page 37: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

무엇이든 시작이 어려울 뿐… 모두 같은 출발선

http://www.flickr.com/photos/jakla/499224896/

Page 38: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

이까이꺼 뭐 대충! 응?

http://www.flickr.com/photos/jakla/499224896/http://www.flickr.com/photos/slworking/8149338837/

Page 39: [D2 fest 2014]yobi hands on lab

Q & A

Page 40: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

참고 할 만한 reference

http://www.flickr.com/photos/jakla/499224896/http://www.flickr.com/photos/slworking/8149338837/

• http://git-scm.com/book/ko/ - Progit 한글 번역 !

• 이왕이면 Progit 종이 책을 사서 보시는 것을 추천 !

• https://www.facebook.com/groups/kgugs/ - KGUG !

• http://insanehong.kr/category/yobi/

Page 41: [D2 fest 2014]yobi hands on lab

http://dev.naver.com/d2

감사 합니다. Happy Hacking! ^^;

http://www.flickr.com/photos/jakla/499224896/http://www.flickr.com/photos/slworking/8149338837/http://www.flickr.com/photos/adulau/8442476626/