github 꾸미는 법

다른 사람의 github를 보다 보면 이쁘게 프로필을 꾸민 것을 볼 수 있다.

 

이를 보고 나도 저렇게 꾸며야겠다는 마음을 먹게 되어 한번 꾸며 보도록 하겠다.

 

먼저 자신의 아이디와 동일한 이름의 repository를 생성한다.

위 그림을 보면 자신의 아이디와 동일하게 생성하는 경우 파란색 박스가 생기면 된 것이다. 

 

이제 Add a README file을 체크해서 README를 만들면서 repository를 생성하면 된다.

 

 

그러면 repository가 정상적으로 생성되면서 기본 프로젝트와는 다르게 생긴 README파일이 생긴 모습을 볼 수 있을 것이다.

 

이제 README를 꾸미면 된다.

 

Header Footer

 

Header 와 Footer를 꾸미려면  아래 사이트를 참조해서 꾸밀 수 있다.

GitHub - kyechan99/capsule-render: 🌈 Dynamic Coloful Image Render

 

아래와 같은코드를 사용하여 header를 만들 수 있으며 자신이 원하는 타입과 색상을 아래코드의 type과 color 부분에 바꿔 적으면 된다.

![header](https://capsule-render.vercel.app/api?type=wave&color=auto&height=300&section=header&text=capsule%20render&fontSize=90)

 

또한 section에 적힌 header에 footer라고 적으면 footer로 꾸미기가 가능하다.

 

 

Badge

 

badge를 사용하여 자신의 기술스택을 꾸미기도 가능하다.

 

뱃지는 아래 사이트에 존재하는 아이콘을 사용하여 꾸미는 것이 가능하다.

Simple Icons

 

아래는 python 뱃지를 생성하는 예시이다.

<img src="https://img.shields.io/badge/python-3776AB?style=for-the-badge&logo=python&logoColor=white">

 

또한 a태그를 사용하여 클릭시 자신의 블로그나 깃허브로 이동을 시키게 꾸밀 수도 있다.

<a href="https://code-escape.tistory.com" target="_blank"><img src="https://img.shields.io/badge/티스토리 블로그-f75748?style=for-the-badge&logo=tistory&logoColor=black"/></a>

 

 

 

Stats

아래 사이트를 참조하여 자신의 커밋 이력이나 자신이 자주 사용하는 상태로 꾸밀 수가 있다.

 

GitHub - anuraghazra/github-readme-stats: :zap: Dynamically generated stats for your github readmes

아래와 같이 자신의 테마를 변경해서 색깔을 바꾸거나 레이아웃을 변경할 수 도 있다.

아래 코드를 사용하면 보라색 테마의 전체 커밋 내역으로 꾸미는게 가능하며

 ![HoJun's GitHub stats](https://github-readme-stats.vercel.app/api?username=hoejun1208&show_icons=true&theme=buefy&include_all_commits=true)

 

아래 코드를 사용하면 타이틀을 보라색으로 기술스탯을 꾸밀 수 있다.

[![hoejun1208 github stats](https://github-readme-stats.vercel.app/api/top-langs/?username=hoejun1208&show_icons=true&hide_border=true&title_color=8e72dc&icon_color=004386&layout=compact)](https://github.com/hoejun1208)

View

아래 사이트를 참조하여 자신의 깃허브에 방문한 방문자수를 띄울 수 도 있다.

 

HITS

 

사이트를 들어가서 TARGET URL에 자신의 깃허브 주소를 넣고 

마크다운 부분의 코드를 복사해서 집어넣으면 된다.

 

코드를 집어 넣으면 아래와 같은 뱃지가 생기게 될 것이다.

[![Hits](https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Fhoejun1208&count_bg=%2379C83D&title_bg=%23555555&icon=github.svg&icon_color=%23E7E7E7&title=Views&edge_flat=false)](https://hits.seeyoufarm.com)

 

 

 

필자는 위에 것들을 이용하여 아래와 같이 깃허브를 꾸몄다.

 

 

만약 코드가 궁금하다면 아래 링크를 통해 확인이 가능하다.

 

hoejun1208 - Overview