SlideShare ist ein Scribd-Unternehmen logo
1 von 73
Downloaden Sie, um offline zu lesen
DnD
디자이너에서
협업하는
디자이너로!
배우자마자 바로 적용 해볼 수 있는 실전 협업 수업!
JSon
Full-stack, mobile software developer
Super fast learner
Startup OperaCoffee
워늬
Android Application Developer
App/Web Designer
And … Freelancer & Student
Kosick
Full-stack developer

Freelance programmer
Digital nomad
#뭐하는 강의인가요? 협업하는 디자이너
05
협업하는 디자이너?
#뭐하는 강의인가요? 협업하는 디자이너
06
협업하는 디자이너?
분업하는 디자이너
#뭐하는 강의인가요? 협업하는 디자이너
분업하는 디자이너
07
디자
이너
개발자
#뭐하는 강의인가요? 협업하는 디자이너
분업하는 디자이너
08
디자
이너
개발자
#뭐하는 강의인가요? 협업하는 디자이너
분업하는 디자이너
09
#뭐하는 강의인가요? 협업하는 디자이너
분업하는 디자이너
10
디자
이너
개발자?
#뭐하는 강의인가요? 협업하는 디자이너
협업하는 디자이너!
11
디자
이너
개발자Free!
#뭐하는 강의인가요? 협업하는 디자이너
협업하는 디자이너!
12
디자
이너
개발자Free!
#뭐하는 강의인가요? 협업하는 디자이너
협업하는 디자이너!
13
디자
이너
개발자!
#뭐하는 강의인가요? 협업하는 디자이너
협업하는 디자이너
코드를 돌려볼 수 있다
직접 디자인 리소스를 변경 가능하다
개발자가 이해하기 쉬운 디자인을 전달한다
14
#뭐하는 강의인가요? 협업하는 디자이너
협업하는 디자이너
코드를 돌려볼 수 있다
직접 디자인 리소스를 변경 가능하다
개발자가 이해하기 쉬운 디자인을 전달한다
알맞는 타입의 리소스로 제작한다
개발자의 투정을 알아들을 수 있다
…
15
Index
Git-it-electron 실습
1. 코드 여러분도 돌려보고 싶지 않으세요?
SourceTree 실습
디자이너를 위한 Version control
정리
Git
#왜 배워야하나요? Git
17
#왜 배워야하나요? Git
18
One
뛰어난 Git 학습도구인 Git-it-electron 으로 Git 을 배워봅시다
Git-it-electron 실습
#무엇에 쓰는 물건인고? Git
개발자들은 코드를 어떻게 관리하고 있을까요?
개발자는 자기가 수정한 것을 되돌리고 싶을 때

어떻게 할까요?
20
#무엇에 쓰는 물건인고? Git
21
#무엇에 쓰는 물건인고? Git
22
버튼 추가
네트워크 기능 추가
버그 수정
설정 화면 추가 차이점만 저장!
#무엇에 쓰는 물건인고? Git
23
버튼 추가
네트워크 기능 추가
버그 수정
설정 화면 추가
되돌리기
#무엇에 쓰는 물건인고? Git
24
버튼 이미지 변경
버튼 폰트 크기 변경
#무엇에 쓰는 물건인고? GitHub
여러 명의 개발자들은

어떻게 같은 코드를 가지고 일하고 있을까요?
그 코드는 어디에 있을까요?
25
#무엇에 쓰는 물건인고? GitHub
26
#무엇에 쓰는 물건인고? GitHub
27
개발자 개발자 개발자
#무엇에 쓰는 물건인고? GitHub
28
개발자 개발자 개발자
디자
이너
#실습해봅시다 Git-it-electron
29
#복습해봅시다 Git
30
#복습해봅시다 Git
31
Local
Remote
(origin)
#복습해봅시다 Git
32
Local
Pull
Remote
(origin)
#복습해봅시다 Git
33
Local
Pull
Master
Remote
(origin)
#복습해봅시다 Git
34
Local
Pull
Master
Branch
Remote
(origin)
#복습해봅시다 Git
35
Local
Pull
Master
Branch
Checkout
Remote
(origin)
#복습해봅시다 Git
36
Local
Pull
Master
Commit
Branch
Checkout
Remote
(origin)
#복습해봅시다 Git
37
Remote
(origin)
Local
Pull Push
Master
Commit
Branch
Checkout
Two
Git 을 GUI 로 다뤄봅시다
SourceTree 실습
#무엇에 쓰는 물건인고? SourceTree
39
#무엇에 쓰는 물건인고? SourceTree
40
Branch
Remote
Commits
Diff
Log
Commit, Pull, Push, Merge …
#실습해봅시다 SourceTree
https://github.com/designers-developers/SourceTreePractice
41
#실습해봅시다 SourceTree
42
Windows 설치WindowsMac
#실습해봅시다 SourceTree - Mac
43
[새 저장소] - [URL에서 복제]
#실습해봅시다 SourceTree - Mac
44
Source URL 에 저장소 URL 입력
[클론]
#실습해봅시다 SourceTree - Mac
45
로컬 저장소가 생성되었습니다
[브랜치] 를 눌러 브랜치를 생성해봅시다
#실습해봅시다 SourceTree - Mac
46
새 브랜치 이름에 add-<username> 입력
[브랜치 생성]
#실습해봅시다 SourceTree - Mac
47
브랜치가 추가되었습니다
#실습해봅시다 SourceTree - Mac
48
파일을 수정하고 나면 ‘Uncommited changes’ 에
변경 사항들이 있습니다
파일 옆의 체크박스를 눌러봅시다
#실습해봅시다 SourceTree - Mac
49
체크한 파일이 ‘스테이지에 올라간 파일’ 로 추가됩니다.
git add 와 동일한 동작입니다.
#실습해봅시다 SourceTree - Mac
50
[커밋] 을 눌러서 커밋해봅시다
#실습해봅시다 SourceTree - Mac
51
커밋 메시지를 작성하고
[커밋]
#실습해봅시다 SourceTree - Mac
52
커밋되었습니다
[푸시] 를 눌러 리모트로 푸시해봅시다
#실습해봅시다 SourceTree - Mac
53
새로 만든 브랜치도 체크해서 리모트에 올라가도록 합니다
[확인]
#실습해봅시다 SourceTree - Mac
54
origin/add-<username> 이 추가되었으면 성공
#실습해봅시다 SourceTree - Windows
55
[Clone / New]
#실습해봅시다 SourceTree - Windows
56
Source Path 에 저장소 URL 입력
[Clone]
#실습해봅시다 SourceTree - Windows
57
로컬 저장소가 생성되었습니다
[Branch] 를 눌러 브랜치를 생성해봅시다
#실습해봅시다 SourceTree - Windows
58
New Branch 에 add-<username> 입력
[Create Branch]
#실습해봅시다 SourceTree - Windows
59
브랜치가 추가되었습니다
#실습해봅시다 SourceTree - Windows
60
파일을 수정하고 나면 ‘Unstaged files’ 에
변경 사항들이 있습니다
그 위의 [Stage All] 을 눌러봅시다
#실습해봅시다 SourceTree - Windows
61
파일이 ‘Staged files’ 로 추가됩니다.
git add 와 동일한 동작입니다.
#실습해봅시다 SourceTree - Windows
62
[Commit] 을 눌러서 커밋해봅시다
#실습해봅시다 SourceTree - Windows
63
커밋 메시지를 작성하고
[Commit]
#실습해봅시다 SourceTree - Windows
64
커밋되었습니다
[Push] 를 눌러 리모트로 푸시해봅시다
#실습해봅시다 SourceTree - Windows
65
새로 만든 브랜치도 체크해서 리모트에 올라가도록 합니다
[Push]
#실습해봅시다 SourceTree - Windows
66
origin/add-<username> 이 추가되었으면 성공
#실습해봅시다 SourceTree
67
GitHub 에서도 확인 가능합니다
Three
디자인 리소스에도 Version Control 을?
디자이너를 위한 Version Control
#간단하게 구경해봅시다
Git LFS

https://youtu.be/uLR1RNqJ1Mw
Invision 

http://blog.invisionapp.com/design-file-syncing/
Pixelapse (deprecated)

https://www.pixelapse.com/
69
*
오늘 배운 것을 정리해볼까요
정리
#정리해봅시다
Git
개발자들이 코드를 관리하는 방법
과거로 돌아갈 수 있습니다!
GitHub
코드를 저장해주는 곳
SourceTree
Git 작업을 편하게 해주는 고마운 프로그램
71
#정리해봅시다
주의사항
Git 에 완전히 익숙해지기 전까지는

절대! master 브랜치에서 작업하지 마세요
Pull - Branch(필수) - Checkout - 작업 - Add - Commit - Push
따로 만든 브랜치를 푸시하고 개발자분에게 말씀드리면

알아서 잘 해주실꺼에요
72
E N D

Weitere ähnliche Inhalte

Was ist angesagt?

스위처를 만드는 아이오의 개발팀 이야기
스위처를 만드는 아이오의 개발팀 이야기스위처를 만드는 아이오의 개발팀 이야기
스위처를 만드는 아이오의 개발팀 이야기
Mijeong Park
 
프로그래머가 되고 싶으세요
프로그래머가 되고 싶으세요프로그래머가 되고 싶으세요
프로그래머가 되고 싶으세요
Chris Ohk
 

Was ist angesagt? (20)

개발과 디자인은 재미있어 [141025 한국우분투커뮤니티 발표]
개발과 디자인은 재미있어 [141025 한국우분투커뮤니티 발표]개발과 디자인은 재미있어 [141025 한국우분투커뮤니티 발표]
개발과 디자인은 재미있어 [141025 한국우분투커뮤니티 발표]
 
Re:Zero부터 시작하지 않는 오픈소스 개발
Re:Zero부터 시작하지 않는 오픈소스 개발Re:Zero부터 시작하지 않는 오픈소스 개발
Re:Zero부터 시작하지 않는 오픈소스 개발
 
스위처를 만드는 아이오의 개발팀 이야기
스위처를 만드는 아이오의 개발팀 이야기스위처를 만드는 아이오의 개발팀 이야기
스위처를 만드는 아이오의 개발팀 이야기
 
C# 뉴비를 위한 맛보기
C# 뉴비를 위한 맛보기C# 뉴비를 위한 맛보기
C# 뉴비를 위한 맛보기
 
200819 NAVER TECH CONCERT 07_신입 iOS 개발자 개발업무 적응기
200819 NAVER TECH CONCERT 07_신입 iOS 개발자 개발업무 적응기200819 NAVER TECH CONCERT 07_신입 iOS 개발자 개발업무 적응기
200819 NAVER TECH CONCERT 07_신입 iOS 개발자 개발업무 적응기
 
My Way, Your Way
My Way, Your WayMy Way, Your Way
My Way, Your Way
 
신입 개발자 생활백서
신입 개발자 생활백서신입 개발자 생활백서
신입 개발자 생활백서
 
오픈 소스와 코드 리뷰
오픈 소스와 코드 리뷰오픈 소스와 코드 리뷰
오픈 소스와 코드 리뷰
 
디미고 특강 - 개발을 시작하려는 여러분에게
디미고 특강 - 개발을 시작하려는 여러분에게디미고 특강 - 개발을 시작하려는 여러분에게
디미고 특강 - 개발을 시작하려는 여러분에게
 
200820 NAVER TECH CONCERT 12_상반기 네이버 인턴을 돌아보며
200820 NAVER TECH CONCERT 12_상반기 네이버 인턴을 돌아보며200820 NAVER TECH CONCERT 12_상반기 네이버 인턴을 돌아보며
200820 NAVER TECH CONCERT 12_상반기 네이버 인턴을 돌아보며
 
Window7-32bit 환경에서 Google go 설치하기
Window7-32bit 환경에서 Google go 설치하기Window7-32bit 환경에서 Google go 설치하기
Window7-32bit 환경에서 Google go 설치하기
 
Learning Unit Testing with Pair Programming
Learning Unit Testing with Pair ProgrammingLearning Unit Testing with Pair Programming
Learning Unit Testing with Pair Programming
 
[강의소개] 안드로이드 앱 개발 입문 캠프 4기
[강의소개] 안드로이드 앱 개발 입문 캠프 4기[강의소개] 안드로이드 앱 개발 입문 캠프 4기
[강의소개] 안드로이드 앱 개발 입문 캠프 4기
 
신입 개발자 생활백서 [개정판]
신입 개발자 생활백서 [개정판]신입 개발자 생활백서 [개정판]
신입 개발자 생활백서 [개정판]
 
주니어 개발자도 이해 할 수 있는 Go언어 시작하기 - 설치편
주니어 개발자도 이해 할 수 있는 Go언어 시작하기 - 설치편주니어 개발자도 이해 할 수 있는 Go언어 시작하기 - 설치편
주니어 개발자도 이해 할 수 있는 Go언어 시작하기 - 설치편
 
우아한오픈소스
우아한오픈소스우아한오픈소스
우아한오픈소스
 
그릇된 팬심의 어긋난 결말
그릇된 팬심의 어긋난 결말그릇된 팬심의 어긋난 결말
그릇된 팬심의 어긋난 결말
 
하드웨어 스타트업의 소프트웨어 이야기
하드웨어 스타트업의 소프트웨어 이야기하드웨어 스타트업의 소프트웨어 이야기
하드웨어 스타트업의 소프트웨어 이야기
 
프로그래머가 되고 싶으세요
프로그래머가 되고 싶으세요프로그래머가 되고 싶으세요
프로그래머가 되고 싶으세요
 
AUSG 공사꾼 팀 소개 발표 자료
AUSG 공사꾼 팀 소개 발표 자료AUSG 공사꾼 팀 소개 발표 자료
AUSG 공사꾼 팀 소개 발표 자료
 

Andere mochten auch

Git 기본개념과 사용법 그리고 어플리케이션
Git 기본개념과 사용법 그리고 어플리케이션Git 기본개념과 사용법 그리고 어플리케이션
Git 기본개념과 사용법 그리고 어플리케이션
Dabi Ahn
 

Andere mochten auch (8)

디자이너를위한Git #1/2
디자이너를위한Git #1/2디자이너를위한Git #1/2
디자이너를위한Git #1/2
 
Git로 협업하기
Git로 협업하기Git로 협업하기
Git로 협업하기
 
Source tree(git) 사용
Source tree(git) 사용Source tree(git) 사용
Source tree(git) 사용
 
무식하게 배우는 gradle
무식하게 배우는 gradle무식하게 배우는 gradle
무식하게 배우는 gradle
 
오픈소스 개발을 위한 Git 사용법 실습
오픈소스 개발을 위한 Git 사용법 실습오픈소스 개발을 위한 Git 사용법 실습
오픈소스 개발을 위한 Git 사용법 실습
 
Git 기본개념과 사용법 그리고 어플리케이션
Git 기본개념과 사용법 그리고 어플리케이션Git 기본개념과 사용법 그리고 어플리케이션
Git 기본개념과 사용법 그리고 어플리케이션
 
Github 으로 학교 팀 프로젝트 하기
Github 으로 학교 팀 프로젝트 하기Github 으로 학교 팀 프로젝트 하기
Github 으로 학교 팀 프로젝트 하기
 
git, 이해부터 활용까지
git, 이해부터 활용까지git, 이해부터 활용까지
git, 이해부터 활용까지
 

Ähnlich wie 협업하는 디자이너 - #2 git

SW Maestro 1-1 Project Keynote
SW Maestro 1-1 Project KeynoteSW Maestro 1-1 Project Keynote
SW Maestro 1-1 Project Keynote
진수 한
 
131 deview 2013 yobi-채수원
131 deview 2013 yobi-채수원131 deview 2013 yobi-채수원
131 deview 2013 yobi-채수원
NAVER D2
 

Ähnlich wie 협업하는 디자이너 - #2 git (20)

게임프로그래머에게 배우는 C#1권(버전1)
게임프로그래머에게 배우는 C#1권(버전1)게임프로그래머에게 배우는 C#1권(버전1)
게임프로그래머에게 배우는 C#1권(버전1)
 
Jurano강의 lec1. AndroidAnnotations 시작하기
Jurano강의 lec1. AndroidAnnotations 시작하기Jurano강의 lec1. AndroidAnnotations 시작하기
Jurano강의 lec1. AndroidAnnotations 시작하기
 
패스트캠퍼스 프론트엔드 강의 오리엔테이션
패스트캠퍼스 프론트엔드 강의 오리엔테이션패스트캠퍼스 프론트엔드 강의 오리엔테이션
패스트캠퍼스 프론트엔드 강의 오리엔테이션
 
C++ 코드 품질 관리 비법
C++ 코드 품질 관리 비법C++ 코드 품질 관리 비법
C++ 코드 품질 관리 비법
 
SW Maestro 1-1 Project Keynote
SW Maestro 1-1 Project KeynoteSW Maestro 1-1 Project Keynote
SW Maestro 1-1 Project Keynote
 
[111]open, share, enjoy 네이버의 오픈소스 활동
[111]open, share, enjoy 네이버의 오픈소스 활동[111]open, share, enjoy 네이버의 오픈소스 활동
[111]open, share, enjoy 네이버의 오픈소스 활동
 
디자이너를 위한 Sw원리 워크샵
디자이너를 위한 Sw원리 워크샵디자이너를 위한 Sw원리 워크샵
디자이너를 위한 Sw원리 워크샵
 
초보개발자의 TDD 체험기
초보개발자의 TDD 체험기초보개발자의 TDD 체험기
초보개발자의 TDD 체험기
 
[SOSCON 2017] 주니어 개발자 5000명, 개발 해서 남 주자
[SOSCON 2017] 주니어 개발자 5000명, 개발 해서 남 주자[SOSCON 2017] 주니어 개발자 5000명, 개발 해서 남 주자
[SOSCON 2017] 주니어 개발자 5000명, 개발 해서 남 주자
 
Ndc17 DevOps? DevOps개발자? 북미에서의 6년
Ndc17 DevOps? DevOps개발자? 북미에서의 6년Ndc17 DevOps? DevOps개발자? 북미에서의 6년
Ndc17 DevOps? DevOps개발자? 북미에서의 6년
 
사내 TDD 도입을 위한 설명 문서
사내 TDD 도입을 위한 설명 문서사내 TDD 도입을 위한 설명 문서
사내 TDD 도입을 위한 설명 문서
 
프로그래머로 부터 배우는 코딩 기술 (プログラマから学ぶコーディングテクニック)
프로그래머로 부터  배우는 코딩 기술 (プログラマから学ぶコーディングテクニック)프로그래머로 부터  배우는 코딩 기술 (プログラマから学ぶコーディングテクニック)
프로그래머로 부터 배우는 코딩 기술 (プログラマから学ぶコーディングテクニック)
 
131 deview 2013 yobi-채수원
131 deview 2013 yobi-채수원131 deview 2013 yobi-채수원
131 deview 2013 yobi-채수원
 
[TECHCON 2019: MOBILE - iOS]2.들숨에 협업 날숨에 클린코드
[TECHCON 2019: MOBILE - iOS]2.들숨에 협업 날숨에 클린코드[TECHCON 2019: MOBILE - iOS]2.들숨에 협업 날숨에 클린코드
[TECHCON 2019: MOBILE - iOS]2.들숨에 협업 날숨에 클린코드
 
D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기
D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기
D2 캠퍼스 세미나 - 학생 개발자에서 신입 개발자로 한단계 업그레이드 하기
 
CoreDot TechSeminar 2018 - Session1 Park Jihun
CoreDot TechSeminar 2018 - Session1 Park JihunCoreDot TechSeminar 2018 - Session1 Park Jihun
CoreDot TechSeminar 2018 - Session1 Park Jihun
 
디자이너를 위한 Sw원리 워크샵 1주
디자이너를 위한 Sw원리 워크샵 1주디자이너를 위한 Sw원리 워크샵 1주
디자이너를 위한 Sw원리 워크샵 1주
 
빌드관리 및 디버깅 (2010년 자료)
빌드관리 및 디버깅 (2010년 자료)빌드관리 및 디버깅 (2010년 자료)
빌드관리 및 디버깅 (2010년 자료)
 
How To Become Better Engineer
How To Become Better EngineerHow To Become Better Engineer
How To Become Better Engineer
 
임태현, 프로그래머 생존 가이드
임태현, 프로그래머 생존 가이드임태현, 프로그래머 생존 가이드
임태현, 프로그래머 생존 가이드
 

협업하는 디자이너 - #2 git