[Github] 깃허브 프로필의 리드미 꾸미기
친한 분한테 깃허브는 필수다, 라고 말을 들어서...짬이 날 때마다 내 깃허브를 한번 꾸며보기로 했다. 필수라는 게 꾸미는 게 아니란 건 알지만 찾아보니 꽤 괜찮게 꾸며놓은 깃허브 페이지들이 많아서 나도 해 봐? 싶어서 기록한다.
먼저 깃허브 레포를 만들어야 한다. 이 때 이름은 내 이름으로 만들어야 한다.
내 깃허브 아이디가 aaa000이라면 뒤의 레포지토리 이름도 똑같이 aaa000으로 만들어야 한다는 뜻이다.
이렇게 레포 이름을 정하면 하단에 녹색으로 이런 글자와 움직이는 고양이 이미지가 나온다.
그 밑의 설정 중에선 Add a README file 체크박스에 체크만 하면 건드릴 건 없다. 처음 생성 시 기본 public으로 설정되어 있기 때문에 따로 건들 필요는 없다. 아래와 같이 설정하면 된다.
이제 Create repository를 눌러서 레포를 만든다. 그리고 README를 보면 아래처럼 "Hi there" 문자열과 손 모양 이모지가 나오는 걸 볼 수 있다.
여기서 잠깐 내 깃허브 메인으로 이동하면 아래와 같이 내 계정 이름의 레포 안에 있는 README가 최상단에 노출되는 걸 확인할 수 있다.
이제 간단하게 꾸며보자. 이미지로 내 이름 같은 게 멋있게 표현되는 걸 원해서 찾아보니 이런 게 있었다.
https://github.com/kyechan99/capsule-render
kyechan99/capsule-render
:rainbow: Decorate Dynamic GitHub Profile !! Contribute to kyechan99/capsule-render development by creating an account on GitHub.
github.com
이걸 쓰면 뭔가 있어보이는(?) 이미지를 만들어서 깃허브 프로필에 장식할 수 있는 듯했다. 그래서 바로 적용해봤다.
꽤 괜찮다. 사선 아래의 직각삼각형 부분은 새로고침할 때마다 색이 바뀌었다.
적용하는 방법은 리드미를 열고 아래와 같이 작성하면 된다. 엔드 포인트(api?) 뒷 부분의 인자값들은 본인 입맛에 맞게 수정하면 된다.
인자값들에 대해선 위의 링크를 타고 들어가면 자세히 알 수 있지만 여기서 간단하게 짚고 넘어가자면
- type : wave, egg, shark, slice, rect, soft, rounded, cylinder, waving의 총 9개가 있으며, 일종의 테마라고 생각된다. 글자 뒤의 이미지를 어떤 것으로 할지 정할 수 있으며 위의 url에서 "type=slice"의 slice 부분을 다른 것으로 바꾸면 된다.
- color : 이미지의 색상을 정할 수 있다. gradient로 설정하면 위 이미지처럼 그라데이션 효과를 줄 수 있으며 색깔은 새로고침할 때마다 랜덤으로 변한다.
- height : 이미지의 높이다. 이 숫자를 바꾸면 README에서 위 이미지가 얼마만큼의 높이를 차지할지를 정할 수 있다.
- section : 현재 footer로 되어 있는데 이렇게 하면 위 이미지처럼 사선 하단에 이미지가 나오고, header로 하면 사선 위에 이미지가 나온다. 어떻게 나오는지 궁금하다면 하단 이미지 참고
- text : 이미지 위에 어떤 글자를 놓을지 정하는 곳이다. 띄어쓰기를 할 거라면 "%20"을 꼭 넣어줘야 하며, 당연한 말이지만 "%20" 다음에 띄어쓰기를 하면 이미지는 적용되지 않는다.
- fontsize : 글자 크기
section을 header로 설정하면 아래와 같이 나온다.
그 다음 깃허브를 돌아다니다 보면 이런 뱃지같은 것들을 볼 수 있다.
이것들을 설정하는 방법도 찾아봤다.
이미지와 똑같이 README에 입력하는데, 아래 링크에 잘 설명돼 있으니 여길 참고하자.
[Github] github profile 예쁘게 꾸미기
들어가자마자 보이는 첫 페이지 예쁘면 더 좋잖아요 ?!
velog.io
예시로 위의 사진의 자바를 보이게 하고 싶다면, Java-007396이라 쓰여진 img 태그를 README에 붙여넣고 저장하면 된다.
이것 말고도 깃허브를 개성적으로 꾸밀 수 있는 다양한 요소가 있으니 시간날 때 시도해 보면 좋을 듯하다.