일단 해보는 개발자
이클립스에서 깃허브로 프로젝트 올리기 (완전 쉽다) 본문
이클립스와 깃허브 연동하는 방법!!
처음 깃허브와 연동하려고 했을 때, 따라하는데도 잘 안돼서 힘들었던 기억이 있어요ㅠㅠ
쉽게 설명해보려고 했습니다.
이클리스에서 깃허브로 프로젝트를 커밋하는 방법에대해 알아봅시당
하나씩 잘 따라오세요.
자세하게 설명하려고 하다가 글이 너무 길어졌는데,
사실 외워서 해보면 1분도 안걸립니다.
1.
이클립스를 켜면 보통 왼쪽편에 Project Explorer 창이 있습니다.
저는 이전에 admitProject라는 이름의 Dynamic Web Project를 만들었는데요,
이 프로젝트를 깃허브로 올려보겠습니다.
(밑에 다른 프로젝트들이 많죠..? 거슬리지만 신경쓰지 맙시다)
2.
그 전에, 우선 깃허브에 레파지토리(Repasitory)가 있어야 합니다!
깃허브에 로그인을 하고, 제 방(??)으로 들어오면,
저렇게 위에 Repositories 메뉴가 있습니다. 클릭!
3.
Repositories메뉴로 들어오면, 초록색 New버튼이 보입니다. 클릭!
이클립스에서 연동한 프로젝트가 새롭게 만든 레파지토리 안에 저장됩니다.
레파지토리는 저장소라고 보면 됩니다.
새로운 저장소를 만들어주려고 합니다.저는 예전에 만들어둔 레파지토리들이 있어서 밑에 memberProject나 javascript와 같은 레파지토리들이 보입니다..
4.
새 레파지토리를 만드는 창입니다.
아직 잘 모르겠지만, 보통 레파지토리 이름(Repository name)은 연동하려고 하는 프로젝트 이름과 똑같이 해줍니다.
그런데 이름을 다르게 해줘도 아마 될겁니다..
저는 admitProject라는 이름의 프로젝트를 깃허브에 올리려고 하기 때문에, 레파지토리의 이름도 똑같이 admitProject로 했습니다.
밑에 Public, Private 선택 버튼이 있습니다.
깃허브를 무료로 이용하려면 Public에 체크해주셔야 합니다. Private은 유료입니다.
더 밑에 Initialize this repository with a README 체크 버튼이 있네요.
Readme파일은 보통 프로젝트에 대해 설명하는 텍스트 파일입니다. (txt파일 맞습니다..)
텍스트 파일을 생성할지 여부를 묻고 있습니다.
저는 체크하지 않습니다..ㅠ 왜냐하면 예전에 레파지토리를 생성할 때 Readme파일을 만들었는데,
이클립스와 깃허브를 연동할 때 에러가 발생하더라구요. 이유는 아직도 모르겠습니다.
아무튼 따라오셨다면 Create repository 초록색 버튼을 클릭합니다.
5.
새로운 레파지토리가 생성되었습니다~!
이제 이클립스에게 제가 새로 만든 레파지토리의 주소를 알려줘야 합니다. 그래야 커밋할 수 있거든요.
저기 빨간색으로 표시한 부분 옆에 제 깃허브 레파지토리 주소가 있어요.
빨간색 동그라미 표시를 누릅니다. 레파지토리 주소를 복사하는 버튼입니다.
이 버튼을 클릭해도 아무 일이 일어나지 않지만, 복사된겁니다.
6.
이제 이클립스로 돌아옵니다.
올리고 싶은 프로젝트(저는 admitProject입니다.)를 선택하고,
마우스 오른 클릭 - Team - Share Project 선택
7.
여기서부터 저한테 조금 어려웠습니다..
이클립스에서 프로젝트를 만들면 제 컴퓨터 로컬디스크(..?) 어딘가에 프로젝트 파일이 만들어지죠?
그 프로젝트 파일 안에 git폴더를 만들어서 프로젝트를 깃허브와 연동시킵니다.
먼저 Use or create repository in parent folder of project 에 체크합니다.
1번 동그라미를 체크한 후, 2번 동그라미가 표시한대로 클릭합니다.
그리고 3번 동그라미를 클릭합니다.
이 부분은 안보셔도 됩니다. 바로 8번으로 넘어가셔도 됩니다.
저는 로컬디스크 C -> 사용자 -> yn05 -> eclipse-workspace 폴더 안에 프로젝트 파일이 생성됩니다.
저기 위에서 두 번째에 adminProject 파일이 보이시죠??
adminProject폴더 안에 들어가보면,
이클립스에서 봤던 것처럼 WebContent폴더와 src폴더 등이 있습니다.
이 프로젝트와 깃허브를 연동시키고 나면 이 폴더 안에 .git폴더가 생성될 것입니다.
8.
Create Repository버튼을 클릭하면 이렇게 회색이 되면서
Project가 체크됩니다.
Finish버튼 클릭
9.
좀 길죠..?
사실 글만 길지 막상 외워서 해보면 1분만에 끝납니다.
이렇게 하고나면 제가 연동하려는 프로젝트 옆에 ['프로젝트이름' master]라는 글자가 생깁니다.
다시 제 로컬디스크로 가서 확인해볼까요?
굳이 확인 안해보셔도 됩니다.
adminProject폴더 안에 .git 폴더가 생성되었습니다.
그런데 이 폴더는 '숨긴 폴더'이기 때문에 폴더 '보기'메뉴에서 '숨긴 항목' 체크를 해주셔야 보입니다.
10.
아직 할 일이 더 남았습니다.
이클립스로 돌아옵니다.
Window - Show View - Other.. 선택
11.
Show View 창입니다.
Show View는 아래쪽에 열리는 창인데, 아래쪽에 Git Repositories 창을 열어주려고 합니다.
Git Repositories 창을 왼쪽 옆에 열어서 사용하시는 분들도 계시던데,
저는 왼쪽에는 Project Explorer창을 열어두고 밑에는 Git Repositories 창을 열어두는게 편했습니다.
Show View에 git을 검색, Git Repositories를 찾아서 Open해줍니다.
12.
이렇게 밑에 열립니다.
제가 깃허브와 연동시키려고 하는 adminProject가 보이시쥬?
13.
동그라미로 표시해둔 삼각형을 클릭하면 밑으로 Remotes가 보입니다.
Remotes위에서 오른클릭 - Create Remote...클릭
14.
New Remote창이 열립니다.
저와 똑같이 뜬다면 그냥 Create버튼을 누릅니다.
15.
이렇게 뜰겁니다..
Changes...버튼 클릭
16.
혹시 아~~까 전에 5번에서 깃허브 레파지토리의 주소를 복사한 것이 기억나시나요??
복사 버튼을 제대로 눌렀다면 이렇게 저절로 입력이 다 되어있을 것입니다.
Authentication에 깃허브 아이디와 비밀번호가 입력되어있습니다.
원래 커밋할 때마다 비밀번호를 입력해야 하는데,
Store in Secure Store에 체크하면 아이디와 비밀번호가 저장되어서 커밋할 때 자동으로 입력됩니다.
저는 자동입력이 편하기 때문에 체크합니다..
다했으면 Finish버튼!
만약 창을 열었는데 입력이 안되어 있다면 맨 처음으로 돌아갈 필요는 없구요,
URI창을 닫고 깃허브로 돌아가서 레파지토리 주소 복사버튼만 다시 클릭하고
URI창을 다시 열어보세요.
17.
Sava and Push 버튼은 저장하면서 바로 Push...(깃허브로 올린다.)하는 것입니다.
저는 바로 올리지 않고 일단 Save만 하겠습니다.
18.
Git Repositories 창을 확인해보면
Remotes 밑으로 저런 구름모양 아이콘이 생긴 것을 확인할 수 있습니다.
19.
10번에서 열었던 Show View 창을 다시 엽니다.
git을 검색하여 Git Staging 창을 엽니다.
20.
Git Stging 창을 열었습니다.
저는 프로젝트에 들어있는 파일이 많기 때문에 Upstaged Changes에 많은 파일들이 보입니다.
이중에서 깃허브에 올리고 싶은 파일들을 선택하여 '플러스 아이콘 버튼'을 클릭합니다.
깃허브에는 이미지, 텍스트, html, jsp 파일 등 모두 업로드 가능합니다.
보통 어쩌구저쩌구~~ setting 파일들도 다 올립니다.
저는 전체 선택해서 플러스 버튼을 누르겠습니다.
여기서 주의할 점...!
프로젝트 안에 파일이 많은데도 Git Staging 창에 아무것도 안 뜨는 경우가 있습니다.
이렇게 프로젝트 익스플로러 창에서 깃허브와 연동할 프로젝트를 선택! 해야
Git Stating창에 파일들이 보입니다.
21.
Staged Changes로 파일들이 내려왔다면,
Commit Message를 써야 합니다. 안쓰면 올라가지 않습니다.
이 파일들에 대한 설명 메세지를 적습니다...
그리고 Commit and Push... 버튼 클릭
22.
이런 창이 뜹니다. Next!!
23.
Finish!
24.
그리고 조금 시간이 지난 후 이런 창이 뜹니다.
프로젝트 파일이 깃허브 레파지토리에 잘 올라갔다는 뜻입니다.
그냥 Close해서 닫아주면 됩니다.
25.
Project Explorer창에서 확인해보면, 깃허브에 올라간 파일들은 글자가 흰색으로 변합니다.
26.
깃허브로 가서 확인 해봅시다.
아까 만든 adminProject 레파지토리에 들어가봅니다.
2분 전에 파일들이 올라왔습니다.
commit Message창에 쓴 글도 보입니다.
끝~~~~~~~~~~!
추가...
만약 깃허브와 연동한 프로젝트에
새 파일을 생성하거나 기존에 있던 파일을 수정하면 어떻게 될까요?
이렇게 새로 생성한 파일이 파란색 글자로 나타나는 것을 볼 수 있습니다.
저는 new.html 파일을 하나 더 만들어봤어요.
기존에 있던 파일을 수정해도 이렇게 파란색으로 변합니다.
이런 파일들도 기존과 똑같이 Git Staging 창을 열어 Push 해주면 됩니다.
추가로
깃허브 레파지토리에 파일을 올리면,
이렇게 오늘 날짜의 네모칸이 초록색으로 변합니다.
저는 이상하게 안변했네요(???)
끝~~ 감사합니다.