Ann's log

[GitHub] Readme Badge 만들기 본문

GitHub

[GitHub] Readme Badge 만들기

-Ann- 2022. 3. 6. 23:51

이미지 출처: GitHub blog

 

정리가 안 되어 있는 Github 각 저장소의 Readme 파일을 수정하기 위해 badge 만드는 방법을 찾아 보았다!

 

Shields.io 사이트에 들어가면 다양한 형태의 badge를 만드는 법을 볼 수 있다.

https://shields.io/

 

Shields.io: Quality metadata badges for open source projects

Love Shields? Please consider donating to sustain our activitiesYour BadgeStaticUsing dash "-" separator/badge/ - - Dashes --→- DashUnderscores __→_ Underscore_ or Space  →  SpaceUsing query string parameters/static/v1?label= &message= &color= Colo

shields.io

 

그리고Simple Icons 사이트에 들어가보면 badge에 적용할 각 아이콘의 로고명과 아이콘의 대표 색상을 알 수 있다.

https://simpleicons.org/

 

Simple Icons

2190 Free SVG icons for popular brands.

simpleicons.org

 

 

간단한 로고 badge를 만들기 위해서는 이미지 주소의 로고명과 색상만 알맞게 적어주면 된다.

https://img.shields.io/badge/로고명-색상.svg?&logo=로고명

 

 

예를 들어, 이렇게 생긴 Sass 로고 badge를 만들고 싶다면

Readme 파일에 다음과 같이 적어주면 된다. (logoColor 파라미터 추가)

![Badge](https://img.shields.io/badge/Sass-CC6699.svg?&logo=Sass&logoColor=fff)

 

또는 img 태그를 이용하여 다음과 같이 적어줘도 된다.

<img src="https://img.shields.io/badge/Sass-CC6699.svg?&logo=Sass&logoColor=fff"/>

 

 

이렇게 Readme 파일에 로고 badge를 추가해 주니까 가독성이 훨씬 좋아지고 프로젝트에서 어떤 것을 사용했는지 한눈에 볼 수 있다.

 

Shields.io 사이트에서 badge로 더 다양한 정보를 나타내는 방법에 대해 알려주는 것 같은데 조금 더 공부해서 잘 활용해 봐야겠다!

 

 

저작자표시 (새창열림)
Comments