Github 본인 프로필 README.md 꾸미기

깃허브 처음 썼을 때는 개념도 어려웠고, 이해가 잘 안되었었는데 프로필을 꾸미면서 어떤 식으로 작성해야 할지 알게 되니 조금 더 친숙해졌던 것 같다. 

 

1. 배너 만들기

• 공식 사이트 : https://github.com/kyechan99/capsule-render
• 추가적으로 궁금한 사항은 공식 사이트를 참고하여서 사용하시면 됩니다! 더 디테일한 내용이 많이 있어요 :D

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

 

• 사용법

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

// 건들지 말 부분 ![header](https://capsule-render.vercel.app/api?까지
// type은 원하는 모양을 넣어주면 되고, color로 어떤 색으로 보여줄지 결정한다.
// height로 높이를 설정하고, section은 상단바인지 하단바인지 타입 설정
// text로 원하는 내용을 넣어주면 된다. 띄어쓰기를 하려면 %20을 텍스트 바로 뒤에 붙여주면 됨.
// fontsize는 원하는 글자 크기 사이즈

 

• Type

Type 이름	Type 사진
wave (default-기본형)
egg
shark
slice
rect
soft (모서리가 약간 둥글다)
rounded
cylinder
waving (웨이브로 움직인다)
transparent (텍스트만)

 

• Color

Type 뒤에 &을 붙이고 아래 Color 명령어를 입력해주면 된다.

Color 이름	설명
color=auto	랜덤으로 색이 제공된다. 글자 색도 랜덤으로 바뀐다.
color=timeAuto	랜덤으로 색이 제공된다. 시간에 따라 결정된다.
color=random	제작자도 모르게 진짜로 랜덤 색이 제공된다.
color=gradient	랜덤 색이 제공된다. 0 - 50 -100 순으로 그라데이션이 랜덤으로 색상 3개가 들어간다.
color=timeGradient	랜덤 색이 그라데이션으로 제공된다. 시간에 따라 결정된다.
color=_hexcode	검정색으로 고정된다.

 

• Height

&height=높이사이즈(숫자만)

 

• Section

header냐 footer냐에 따라서 단면 방향이 바뀝니다.

 

• header

![header](https://capsule-render.vercel.app/api?type=wave&color=gradient&height=300&section=header&text=Dobby&fontSize=80)

header로 만들었을 때

 

• footer

![footer](https://capsule-render.vercel.app/api?type=wave&color=gradient&height=300&section=footer&text=Dobby&fontSize=80)

footer로 만들었을 때

 

• Text
  • 텍스트에는 특수기호는 사용할 수 없다(ex: #, &, / 등..)
  • 글자 사이에 %20을 사용하면 한 칸을 빈칸으로 만들 수 있다.

&text=텍스트사이즈

 

• FontSize
  • 기본적으로 70으로 값이 정해져 있다.

&fontSize=폰트숫자값

 

2. 히트 수(HITS) 

방문자 수를 나타낸다.

 

• 공식 사이트 : https://hits.seeyoufarm.com/

HITS

 

1. TARGET URL을 수정한다.

• 자신의 깃허브 메인 페이지에 가준다. (ex) https://github.com/자신의깃허브유저이름)
• 해당 링크를 복사해서 안에 넣어준다.

링크를 넣는 위치

 

2. 필수적인 건 아니지만 옵션으로 수정할 수 있다.

수정할 수 있는 옵션들

 

• 옵션 기능들

이름	사용법	사용 후
+ Add Icon	원하는 아이콘을 넣을 수 있다. 원하는 아이콘 선택하면 바로 적용이 된다.
BORDER	FLAT 과 ROUND 두 가지 선택지가 있다. 미묘하게 다르다.	- FLAT(모서리가 각져있다) - ROUND(모서리가 둥글다)
TITLE	넣고 싶은 내용을 넣으면 안에 텍스트가 바뀐다. - 넣고 싶은 텍스트 입력
TITLE BG COLOR	앞에 있는 타이틀의 배경 색을 바꿀 수 있다. 원하는 색 선택 후 SAVE 버튼 클릭
COUNT BG COLOR	뒤에 있는 방문자 수의 색을 바꿀 수 있다. 색상을 바꾸는 법은 TITLE BG COLOR 방법과 동일하다.

 

3. 바로 아래에 MARKDOWN이라고 적힌 소스를 복사 붙여넣기 해서 사용하면 된다.

• 예시 소스코드

[![Hits](https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2FDobby&count_bg=%239593FA&title_bg=%23FF9292&icon=hey.svg&icon_color=%23E7E7E7&title=Dobby%27s+Github&edge_flat=false)](https://hits.seeyoufarm.com)

 

COPY 버튼을 눌러서 복사해서 README에 사용하면 됩니다.

 

3. 기술 스택 작성하기

• 로고 가져오는 사이트 : https://simpleicons.org/

Simple Icons

 

• 복사 붙여넣기만 하면 되는 깃허브 사이트 : https://github.com/Ileriayo/markdown-badges

GitHub - Ileriayo/markdown-badges: Badges for your personal developer branding, profile, and projects.

 

• 개인적으로 귀찮기 때문에 복사 붙여넣기 할 수 있는 깃허브 사이트를 추천드립니다!

 

4. Stats 표시

• 해당 깃허브 : https://github.com/anuraghazra/github-readme-stats/blob/master/themes/README.md

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

 

• 바꿔줘야 할 내용들
  • 맨 앞에 [] 괄호 안에 원하는 Text를 넣으면 원하는 내용으로 바뀝니다.
  • ?username=자신의깃허브아이디를 넣어주면 자신의 내용으로 바뀝니다.
  • &theme=원하는테마를 넣어주면 됩니다. 테마가 너무 많으므로 위에 깃허브를 참고해주시면 됩니다.
• 예시 소스코드

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

 

5. 백준 티어 프로필 카드

• 해당 깃허브 : https://github.com/mazassumnida/mazassumnida

GitHub - mazassumnida/mazassumnida: Github 프로필에서 boj 프로필을 이쁘게 보여주는 프로젝트

 

• 사용법 : 백준아이디라고 적힌 부분을 자신의 백준 아이디를 입력해주시면 됩니다.

[![Solved.ac
프로필](http://mazassumnida.wtf/api/generate_badge?boj=백준아이디)](https://solved.ac/백준아이디)