Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |
Tags
- NEXT
- npm publish
- typescript
- React
- 마이크 권한 요청
- useQuery
- npm module
- flutter
- useSwr
- 웹 디자인
- 웹 애니메이션
- CJS
- nextauth
- npm library
- useState
- useCallback()
- useSWRImmutable
- svg style
- window.scrollY
- python
- next.js
- recoil
- es module
- github login
- Tailwind CSS
- react-icons
- Lottie web
- 백틱
- 템플릿 리터럴
- 동적 디자인
Archives
- Today
- Total
김재욱의 이모저모
깃허브 프로필 꾸미기! 본문
728x90
시험 기간인 내가 할 일은 아니지만 갑자기 깃허브 프로필이 꾸미고 싶어졌다 하하하. 왜 시험기간만 되면 이런 이상한 게 하고 싶을까...
Github repository 만들기
우선 github profile 을 꾸미기 위해 필요한 것은 본인의 깃허브 닉네임으로 만든 repository가 필요하다. 나는 계정명이 kjyook이어서 kjyook라는 repository를 만들었다.
다음과 같이 repository를 만들면 readme.md 파일이 생기고 깃허브 대문에도 해당 readme.md파일이 나온다.
이제 이 README.md 파일을 수정하면 된다!!
shields.io 를 통해 배지를 주입하기
먼저 가장 해보고 싶었던거는 나의 skill을 이미지로 넣는 것이었다.
이런 귀여운 배지들을 넣고 싶었다!
이러한 배지들은 https://shields.io/ 페이지에서 만들 수 있다. 위와 같은 배지를 만들기 위해서는 README.md에 배지에 대한 img 태그를 작성해주면 되는데 해당 뱃지의 url은 다음과 같다.
<img src="https://img.shields.io/badge/<LABEL>-<MESSAGE>-<COLOR>">
그래서 우리가 채우면 되는 내용은 코드로 표현하면 이렇게 된다.
<img src="https://img.shields.io/badge/뱃지레이블-배경색?style=뱃지모양&logo=로고&logoColor=로고색상">
그리고 위 React 아이콘과 텍스트가 들어간 벳지의 코드는 아래와 같다.
<img src="https://img.shields.io/badge/React-61DAFB?style=flat-square&logo=React&logoColor=black"/>
이 뱃지에 넣을 수 있는 로고는 https://simpleicons.org/ 사이트를 참고하면 좋다
배경색은 000000과 FFFFFF을 제외하고는 모두 가능하다.
README에 github stats 표시하기
다른 사람들 깃허브에 들어가면 자주 보이던 그것! github stats를 표시해보고 싶었다.
![kjyook's GitHub stats](https://github-readme-stats.vercel.app/api?username=사용자ID&show_icons=true&theme=radical)
위 코드에서 [] 안의 text를 수정하고, 사용자 ID에 본인의 git id를 적으면 된다.
728x90
'Git' 카테고리의 다른 글
Git에서 프로젝트 repository 이사가기 (0) | 2023.06.08 |
---|