깃허브 프로필을 터미널 테마로 전면 개편한 과정
목차
프로필 README 갈아엎은 이유
오랜만에 깃허브 프로필 들어가봤더니 예전에 대충 박아둔 자기소개랑 깨진 뱃지 몇 개가 다였음. 방문자가 와도 내가 뭘 하는 사람인지, 뭘 만들어왔는지 30초 안에 파악이 안 되는 구조였음. 한 번 갈아엎기로 결정.
목표는 두 가지로 잡음.
- 첫 인상에서 정체성 전달: 어떤 스택을 쓰고 어떤 결과물을 만드는지 즉시 보이게
- 프로젝트 쇼케이스: 그동안 작업한 것들을 카드 형태로 노출
터미널 테마로 간 이유
처음엔 흔한 그라데이션 헤더 이미지로 갈까 했는데, 다른 프로필이랑 다 비슷해 보여서 차별화가 안 됨. 결국 검정 배경 + 모노스페이스 + 프롬프트 기호 조합으로 결정. 내가 매일 보는 화면 그대로 옮긴 셈.
| 영역 | 이전 | 이후 |
|---|---|---|
| 헤더 | 한 줄 자기소개 | ASCII 배너 + 프롬프트 라인 |
| 스택 | 뱃지 나열 | 카테고리별 그룹 + 사용 빈도 |
| 프로젝트 | 링크 텍스트 | 카드형 미리보기 + 한 줄 설명 |
| 통계 | 없음 | 다크 테마 통계 위젯 |
$ whoami
> backend engineer · payments · 이커머스
$ ls ~/projects
> partner-settlement/ shorts-pipeline/ retro-blog/
이 부분 손볼 때 의외로 시간이 오래 걸렸음. SVG 가운데 정렬이 깃허브 마크다운 렌더러에서 자꾸 깨져서 결국 <div align="center">로 감싸는 정공법 사용. picture 태그로 라이트/다크 모드 분기까지 넣었더니 그제야 의도한 화면이 나옴.
막혔던 지점
- 이모지 폭 차이: 모노스페이스 흉내 내려고 정렬 맞췄는데 이모지마다 셀 폭이 달라서 줄이 어긋남. 결과적으로 이모지는 헤더 한 줄에만 쓰고 본문은 텍스트만 둠
- 통계 위젯 캐시: 테마 바꿔도 한참 이전 색이 잡혀 있음. URL에
&cache_seconds=1800박아서 갱신 주기 강제 - 프로젝트 카드 비율: 썸네일 1280×640 으로 통일하니 카드가 두 개씩 배치됐을 때 안 깨짐
회고
README 하나 다듬는 게 별 거 아닐 줄 알았는데, "이 사람 뭐 하는지 한눈에 보이게" 라는 기준 하나 잡고 끝까지 끌고 가니 의외로 디테일 작업이 많았음. 특히 카드 썸네일 톤을 터미널 배경색이랑 맞추는 게 만족도가 컸음.
다음에 손볼 거: 기여 그래프 위젯 색상 커스텀, 핀 프로젝트 자동 갱신 워크플로 추가.
끝
댓글 0
첫 댓글 달아줘.