Git & GitHub

깃허브에서 다른 사람과 소통하기

Player-Hyeok 2024. 2. 17.

깃허브에는 전 세계의 다양한 오픈 소스들이 많이 모여 있어서 공부하기에도, 업무하기에도 큰 도움이 된다.

이번에는 깃허브에서 오픈 소스 프로젝트에 참여하는 방법에 대해 알아보고자 한다.

깃허브로 소통하기
깃허브로 소통하기

깃허브 프로필 관리하기

프로필  작성하기

깃허브 프로필에 들어가면 이름과 사진을 비롯한 개인정보, 관리하는 저장소 목록, 사용자가 깃허브에서 활동한 기록을 볼 수 있다.

이 중에서 아래에 녹색 칸으로 표시되는 사용 기록이 있다.

이것은 컨트리뷰션(contribution) 이라고 깃허브에 커밋을 올리는 것 뿐만 아니라 다른 오픈 소스 프로젝트에 PR 을 등록한 는 등 깃허브에서 하는 모든 활동 수에 따라 색상이 변경되는 시스템이다.

이 항목은 TIL, Today I Learned 로 개인의 공부 기록을 남기는 용도로도 자주 사용된다. (ex 1인 1커밋..)

 

 

README 파일 작성하면서 마크다운 익히기

방문자가 편하게 자기 저장소를 살펴볼 수 있게 안내문을 작성할 수 있는데, 이 문서를 보통 README 파일이라고 한다.

README 파일은 마크다운(markdown) 문법을 사용하므로 확장자는 .md 를 사용한다.

https://github.com/funnycom/js-basic-book 

Do-it 책 저자의 깃허브인데 이곳에서 README.md 파일을 보고 예제로 참고하도록 하자.

README 파일도 코드로 되어있는데 단순 텍스트 뿐만 아니라 다른 글씨체, 이미지나 외부 링크도 넣을 수 있다.

 

https://github.com/microsoft/vscode-docs 

 

GitHub - microsoft/vscode-docs: Public documentation for Visual Studio Code

Public documentation for Visual Studio Code. Contribute to microsoft/vscode-docs development by creating an account on GitHub.

github.com

여기에서도 참고할 수 있다. 마치 한 권의 책처럼 README 파일을 작성한다.

 

README 파일 작성하기

README 파일은 처음에 저장소 만들 때 Add a README file 을 체크하면 자동으로 만들어 진다.

자동으로 만들지 않았다면, 파일 목록 가장 아래에 Add a README 를 클릭해서 새 파일을 만들 수 있다.

test-1 저장소에 README 파일을 만들어 본다

1. Add a README

2. 파일 장성

3. Commit new file

 

마크다운 기본 문법 알아보기

마크다운은 사용하기 쉽고 HTML 태그에 비해 간단한 문법이다.

  • # : 제목 입력, # 1개~6개까지 크기별로 제목이며, 1단계와 2단계는 제목 아래에 가로줄도 그려짐.
  • enter x2 : 단락 줄 바꾸기, enter 두번 눌러야 함
  • 1. 2. 3.  : 숫자 목록
  • -, +, * : 순서 없는 목록, Tab 눌러서 들여 쓸 경우 여러 개로 이루어진 목록 만들어짐.
  • **ㅇㅇ**, __ㅇㅇ__ : * 2개나 _ 2개를 ㅆ ㅡ면 텍스트의 일부분이 굵게 표시된다
  • *ㅇㅇ*, _ㅇㅇ_ : *나 _ 1개를 쓰면 기울임체가 된다
  • ***ㅇㅇㅇ*, ___ㅇㅇ___ : 굵은 기울임체
  • ~~ㅇㅇ~~ : 취소선
  • ` : 키보드 1 옆에 백틱 기호, 정식 명칭은 그레이브(grave), 텍스트 사이에 소스 코드를 삽입할 때 사용
  • ``` : 여러 줄 짜리 소스 콛 삽입
  • <> : 링크 주소 그대로 표현
  • [텍스트](주소) : 텍스트를 누르면 주소로 이동
  • [텍스트](주소, "부가 설명") : 텍스트 누르면 주소로 이동하는데, 커서 위로 올리면 부가 설명 나타남.

README 파일 수정하기

README 파일 수정하고 preview를 통해 결과 확인

show diff 를 통해 수정사항 확인

수정 완료하면 커밋 메세지 입력하여 커밋 체인지.

 

README 파일에 이미지 추가하기

마크다운에서 이미지 삽입 시에는 맨 앞에 ! 를 붙인 후 대체 텍스트와 이미지 파일 경로를 저장

![대체 텍스트](이미지 파일 경로)

이 경우 사용할 이미지가 온라인에 있어야 한다.

따라서 깃허브 저장소에 이미지를 올려 놓고, 그 이미지를 README 파일에 삽입을 한다.

 

1. 저장소 위쪽 Code 클릭해서 저장소 첫 화면으로 이동. Add file - Upload files 클릭.

2. Drag & Drop 으로 이미지 업로드

3. README 파일 수정 - ![프로필 이미지](./파일명.확장자)

* ./ 은 현재 저장소 폴더를 가르킴

4. 커밋 메세지 작성해서 커밋 체인지

 

 

오픈 소스 프로젝트에 기여하기

깃허브에는 다양한 오픈 소스 프로젝트들이 있다. 절차에 대해 알아보자.

컨트리뷰션 안내 참고

https://github.com/kamranahmedse/developer-roadmap 

 

GitHub - kamranahmedse/developer-roadmap: Interactive roadmaps, guides and other educational content to help developers grow in

Interactive roadmaps, guides and other educational content to help developers grow in their careers. - kamranahmedse/developer-roadmap

github.com

개발자 로드맵을 제공하는 곳. 참고.

 

한글로 번역하는 것도 중요한 컨트리뷰션

https://github.com/trekhleb/javascript-algorithms 

 

GitHub - trekhleb/javascript-algorithms: 📝 Algorithms and data structures implemented in JavaScript with explanations and lin

📝 Algorithms and data structures implemented in JavaScript with explanations and links to further readings - trekhleb/javascript-algorithms

github.com

자바스크립트 알고리즘 한글로 많이 번역되어 있음.

README.ko-KR.md 를 통해 확인할 수 있음

 

문서화 작업을 돕기

오타 수정, 번역 수정 등이 있음.

VS Code 가 대표적인 오픈소스 프로그램. VS code 번역 문제가 있으면 수정 가능.

https://github.com/microsoft/vscode 

 

GitHub - microsoft/vscode: Visual Studio Code

Visual Studio Code. Contribute to microsoft/vscode development by creating an account on GitHub.

github.com

 

 

소스 오류나 버그 수정

가장 많이 참여하는분야이다. 

https://github.com/nhn/tui.editor 

 

GitHub - nhn/tui.editor: 🍞📝 Markdown WYSIWYG Editor. GFM Standard + Chart & UML Extensible.

🍞📝 Markdown WYSIWYG Editor. GFM Standard + Chart & UML Extensible. - nhn/tui.editor

github.com

TOAST UI Editor 위지윅 편집기의 기능.

저장소에서 Issue 탭에서 다양한 개발자들과 소통이 가능.

댓글

💲 추천