본문 바로가기

🎟️ 깃허브

[깃허브] 프로필부터 여러 기능 활용까지 한방에 끝내기

개발자이거나, 코딩 / 프로그래밍에 관심이 있으시다면
한 번쯤은 깃허브1 에 대해 들어 보셨을 겁니다.

(아니라도 상관 없어요~^^)

하지만 깃허브 블로그에 관한 내용은 좀 어려우니,
이번엔 깃허브 사용법을 간단하게 알려 드리도록 하겠습니다!

🔥 회원가입

image.png

깃허브👉바로가기

우선 깃허브에 들어가면, 이런 (있어보이는) 페이지가 뜹니다.
아쉽게도 외국 페이지라서 영어로 봐야 할 듯 하네요.
깃허브 계정이 있다면 다음 단계로 넘어가셔도 됩니다. 계정이 없으신 분들은 계정을 새로 만들어 주셔야 해요!

sign up이라는 버튼을 눌러서 회원가입 창으로 들어가 주세요.

  1. 이메일 입력
    image.png
  2. 비밀번호 입력
    image.png
  3. 닉네임 설정
    image.png
  4. 인간 증명 2

이메일 인증 등 간단한 절차를 걸치면 바로 깃허브 계정이 생성됩니다.
이제 이 계정으로 로그인을 하시면 됩니다!

🔥 레포지토리 만들기

우리가 저장소 라고 부르던 것을 깃허브에서 레포지토리 라고 부릅니다.

(뭐 대충 이렇게 이해하면 될 것 같네요...)

레포지토리를 만들면, 그 안에 폴더파일들을 만들어 줄 수 있어요.
그러니 한번 만들어 봅시다.

image.png

깃허브에 로그인하면, 이런 화면을 볼 수 있습니다.
아직 레포지토리를 만들지 않아서 없는 경우에는,
왼쪽에 초록색 버튼이 있을 거예요.

Create repository라는 버튼을 클릭해 주시면 됩니다.
이 버튼이 표시되지 않을 경우에는 New 버튼을 눌러주세요.

image.png

레포지토리 생성 창입니다.
여기서 기본 정보들을 입력해 줘야 해요 (좀 귀찮지만...)
첫 레포지토리니까 본인 닉네임을 제목으로 레포지토리를 만들어 주세요. 이 레포지토리의 Readme.md 파일은 여러분 깃허브 프로필에 표시됩니다.

image.png

이렇게 대놓고 말이예요

아 맞다! Add readme file 체크란에 체크도 꼭 해주세요.

그렇게 여러분의 첫 레포지토리를 만들고 나면, 다시 깃허브 홈으로 들어와 보세요.

여러분이 만든 것을 한번 구경해 봅시다.

오른쪽 위에 아주 작게 있는 프로필 사진을 클릭하면, Your Profile이라는 버튼이 뿅! 하고 나타납니다. 클릭해주세요.

image.png

아마 이런식으로 표시될 것 같습니다.

🔥 프로필 꾸미기

여러분의 깃허브 프로필을 꾸미려면, 아까 여러분 닉네임으로 만들었던 레포지토리 안에 있는

Readme.md 파일을 수정하면 됩니다. (말은 쉽죠?)

이 .md 파일 확장자는 "마크다운"3 파일을 뜻해요.

그래서 마크다운 문법을 이용하면 쉽게 프로필을 작성할 수 있습니다.

✅ 기본적인 마크다운 문법

마크다운을 A부터 Z까지 설명하기에는 힘드니까 (절대 귀찮은게 아니고...)
제 프로필에 쓰인 마크다운에 대해서 설명을 해 드릴게요.

  • 헤딩 (제목)
    마크다운에서 제목은 샵 [#] 으로 표현합니다.
    이 샵의 개수에 따라서 제목의 크기가 정해지죠. 헤딩은 1단계부터 6단계까지 사용할 수 있고, 1단계가 제일 큰 제목이랍니다. 4

  • 순서 없는 목록 (점)
  • 👋 Hi, I’m @Eggjini
  • 👀 I’m interested in Programing
  • 🌱 I’m currently learning Visual C++, Python, MySQL, Md
  • 💞️ I’m looking to translate Readme to Korean
  • 📫 How to reach me Just send a mail egg.design@daum.net

이 결과를 보시면, 각각 목록 앞에 점이 있는 것을 볼 수 있습니다.
이 점은 대쉬 (-) 를 나타내서 사용해요. 키보드의 0 옆에 있는 빼기 버튼이요.

순서 있는 목록 (숫자)
이거는 제일 간단한 구문입니다. 그냥 숫자를 쓰고, 마침표 (.)를 붙이면 자동으로 숫자가 붙은 목록을 만들 수 있어요.

✅ 스킬 배지 만들기

제가 처음 깃허브를 보고 제일 궁금해했던 배지 입니다.

생긴건

image.png

이렇게 뭔가 있어보이게 생겼는데,
은근슬쩍 내 실력이 이정도다 자랑할 수 있습니다.

코드를 보여드리자면...

결과:

아이콘 사이트 https://simpleicons.org/ 에 접속해서 아이콘의 이름을 확인하고, 아래 코드에 대입하면 됩니다.

여기서 색깔은 모두 16진수 색상 코드를 말합니다.
Red나 Blue, White 같은 색상 이름도 가능해요.

내용에는 배지에 표기될 글자를 입력하시면 됩니다.

스타일에는 plastic, flat, flat-square, for-the-badge, social 이 있습니다.
저는 for-the-badge 스타일을 사용하고 있어요.

image.png
각각 스타일에 따른 모양입니다.

로고이름에는 아까 아이콘 사이트에서 찾은 아이콘의 이름을 대입하면 됩니다. 예외적으로 C++는 그대로 쓰는 것이 아니라, C%2B%2B라고 작성해야 해요.

깃허브 스탯

깃허브 스탯은
깃허브에서 내가 활동한 데이터를 바탕으로 스탯을 시각적으로 제공해줍니다.
마찬가지로, 내가 이만큼 한다 라는걸 보여줄 수 있겠죠?

많이 쓴 언어
Top Langs

[![Top Langs](https://github-readme-stats.vercel.app/api/top-langs/?username=깃허브 닉네임&theme=radical&layout=compact&)](https://github.com/깃허브 닉네임/github-readme-stats)

깃허브 스탯

![깃허브 닉네임's GitHub stats](https://github-readme-stats.vercel.app/api?username=깃허브 닉네임&theme=radical&show_icons=true)

결과:

Eggjini's GitHub stats

3. 트로피

![trophy](https://github-profile-trophy.vercel.app/?username=깃허브 닉네임&theme=radical)

trophy

이 스탯 마크다운들은 제가 표시해 둔 "깃허브 닉네임" 부분을 잘 입력해 주셔야 합니다.

안그럼 작동이 안될수도 있어요.

(아니면 다른 사람 스탯이 들어가는 경우도 있습니다)

다른 사람 파일 이용하기

저는 블로그 예제파일을 깃허브를 통해서 공유하고 있습니다.
사실상 제일 편리합니다. (히힛)

Fork

이렇게 다른 사람이 올려놓은 파일을 깃허브에서는 나한테 가져올 수 있습니다.

간단히 말하면 Ctrl + C 해서 Ctrl + V 하는 개념이예요.

레포지토리의 위쪽에 보시면 Fork 라는 버튼이 있는데, 말 그대로 포크로 집어서 가져옵니다.

우선 이번에는 로컬 저장소로 저장하지 않고, 내 레포지토리에서 바로 수정하는 방법을 알아봅시다.

이 링크를 따라 들어가면 제가 연습을 하라고 만들어 둔 레포지토리가 나올 겁니다.

image.png

요렇게 레포지토리가 나오면, 저~ 오른쪽 위에 Fork 라는 버튼이 보일 겁니다. 별 모양 버튼 왼쪽에요!

Fork 버튼을 누르시면, 이 연습용 레포지토리가 여러분의 계정에 복제됩니다.

다시, 여러분의 프로필에 들어가서 두 번째 탭인 "Repository" 를 눌러 주면

image.png

이렇게 여러분의 레포지토리가 보일 겁니다.
방금 Fork 한 레포지토리는 아마 맨~ 위에 있을 거예요.
그 레포지토리를 클릭해서 들어가보세요.
그리고 Readme.md 파일을 클릭해서 열어보세요.

image.png

오른쪽 위에, 연필 모양 아이콘을 눌러서 편집 모드로 들어가도록 합시다.

image.png

여기서 제가 이 부분을 수정해 보세요! 라고 적어 놓은 부분을 지우고, 마음껏 수정해 보세요.
그러고 나서 아래쪽에 초록색 Commit Change 버튼을 누르면 됩니다.

image.png

(__수정한 게 없으면 커밋이 되지 않아요~)
그러면 이 파일은 여러분의 레포지토리에서만 저장된 거랍니다.

Pull request

아까 수정한 파일은 그저 여러분의 복사본 레포지토리에서만 반영이 된 거랍니다.

제가 만든 원본에는 절대 반영되지 않아요. 나는 그냥 이렇게만 사용할 거예요~ 하는 분들은 상관 없지만,

다른 사람의 코드에서 버그!오류 ,오타 를 찾았을 경우, 또는 내 아이디어를 이 코드에 반영시키고 싶다 하시면

원본 파일에 제가 수정한 내용을 합쳐 주세요~ 부탁을 해야 합니다.

그 방법이 바로 Pull request 예요.
여러분이 아까 복제해 와서, 수정한 레포지토리에서
두 번째 탭 Pull request 에 들어오면, 아래와 같은 화면이 나옵니다.

image.png

여기서 또 파릇파릇한 초록색 New Pull request 버튼을 눌러 주세요.

image.png

그러면 이렇게 여러분이 수정한 부분이 한눈에 보이게 됩니다.

image.png

아래쪽에 이렇게 메시지를 쓸 수 있는 칸이 있는데, 여기에 여러분이 수정한 내용을 잘 알아볼 수 있도록

설명을 해 주셔야 해요. 그래야 개발자도 여러분의 수정사항을 반영할 확률이 크답니다.

어쨌든 수정한 내용을 다 확인하고, 또 초록색 Create pull request 버튼을 누르면

image.png

이렇게 원본 파일에 Pull request가 달리게 됩니다.
원본 파일 주인이 이를 확인하고, 질문 사항이 있으면 토론도 하고 해서
수정 사항을 Merge 하게 되면, 여러분의 수정 사항이 자동으로 원본 파일에 반영됩니다.

이를 통해 개발자들과 소통하고, 여러분의 프로그래밍, 코딩 실력도 향상시킬 수 있다고 생각해요.

그래서 개발자들이 깃허브를 많이 사용하는지도 모르죠.


이 글을 여기까지 읽으신 여러분, 수고 많으셨습니다.
보면서 한번씩 꼭! 따라해 보세요. 보는 걸로는 절대 기억이 나지 않더라고요.

다음 포스팅에서 다시 돌아오겠습니다~

🎈 각주

[1]: 깃허브는 분산 버전 관리 툴인 깃 저장소 호스팅을 지원하는 웹 서비스이다. 루비 온 레일스로 작성되었다. GitHub는 영리적인 서비스와 오픈소스를 위한 무상 서비스를 모두 제공한다. 위키백과

[2]: 생각보다 어려울지도 모른다.

[3]: 마크다운은 일반 텍스트 기반의 경량 마크업 언어다. 일반 텍스트로 서식이 있는 문서를 작성하는 데 사용되며, 일반 마크업 언어에 비해 문법이 쉽고 간단한 것이 특징이다. 위키백과

[4]: 샵을 7개 쓰면 표시되지 않는다. (6이 최대)
####### This is Heading?

🔗 링크