심혈을 기울려 만든 “나만의 블로그”를 1년이 안된 채, redesign 하게 되었다.
그 과정을 단백하게 기록해보고자 한다.
내가 하고 싶은 것을 다시 발견하다.
취뽀는 목적지가 아니다.
‘난 뭘 하고 싶지?’ 계속 스스로 물어봐야 한다.
한 번뿐인 청춘, 하고 싶은 것을 이루기 위해 불태우자. 직장은 그저 수단일 뿐이다.
카카오 입사하면서 마음에 새겼던 백신이다.
바쁘게 살다가, 이 백신 덕분에 내가 하고 싶은 것을 다시 발견할 수 있었다.
나는 무언가 단순하고, 명료하고, 부드럽고, 여유로운 것을 만들고 싶다.
내 손에 거쳐간 것들에 이가 일종의 브랜드처럼 담겼으면 했고, 이것을 가장 자유롭게 표현할 수 있는 곳이 바로 내가 직접 만든 블로그였다.
이전 블로그를 피드벡하다.
그렇기에 이전 블로그를 다시 살펴보지 않을 수 없었다.
나름 심혈을 기울려 만든 작품이기에 부드러움은 합격이었다. 만족스러웠다.
하지만 마음 한편에 찝찝한 복잡함이 느껴졌다.
이런 저런 아쉬움이 남았다.
- 수행할 수 있는 동작에 비해 콘텐츠 간의 간격이 크다보니 주의가 쉽게 분산되며 피로감를 느낀다.
- 제목과 글 사이의 간격이 좁아 답답함이 느껴진다.
- 본문이 중심에서 좌로 치우쳐 콘텐츠 소비에 부담이 있다.
- 코드 하이라이트가 vscode와 차이가 좀 있어 몰입도가 떨어진다.
- 글씨의 크기와 스타일이 다양하여 UI가 조잡하다고 느껴진다.
- …
화면이 극도로 단순해졌으면 좋겠다.
블로그를 새롭게 설계하다.
때마침 단비같은 존재들이 있으니, 바로 출퇴근 중 트위터에서 접하게 된 개발 장인들이다.
Paco Coursey, Rauno, Anthony Fu 로부터 정말 많은 영감을 받았다.
열정이 불타오르기 시작했다. 나도 이분들 처럼 멋진 블로그를 만들고 싶었다.
그 첫 과정은 “Next.js 13 app directory 전환”으로 시작하게 되었다.
- 당시 신기술이 었던 app directory에 대한 호기심
shadcn/ui의 탄탄한 Next.js 13 프로젝트 구조 참고rehype-pretty-code도입- 훨씬 vscode 스러운 syntax highlighter,
shiki기반rehype플러그인
- 훨씬 vscode 스러운 syntax highlighter,
- 장인들의 고도화된 심플 레이아웃 모방
- …
이후 콘텐츠에 대해서도 새롭게 생각하게 되었다.
- 내 생각과 의견이 담긴 글과 정보를 전달하는 글을 더 명확하게 구분 되었으면 좋겠다.
- 그것이 곧 서재와 수첩이 되었다.
- 열심히 개발 → 알게된 것을 옵시디언에 기록 → 콘텐츠를 조합하여 글을 작성.
7월, 8월이 흘러 어느새 블로그 형태가 잡혔다.
가졌던 아쉬움들을 하나 하나 보완하니 역시나 마음이 무척 편안해졌다. 특히 글 예시 페이지는 너무나 만족 스러웠다. 조금은 주춤했던 글 쓸 욕구도 빵빵해졌다.
소스코드는 누군가에게는 도움이 되겠지 싶어 public으로 뒀다.
Astro로 이전하다.
하지만, 만들자마자 이사를 결심하게 되었다.
사이트에 글 뿐만이 아니라 dnd-playground 같이 무언가 흥미로운 것(craft)도 담고 싶었다. 회사에서 열심히 사용하고 있는 Svelte로도 무언가 끄적여 보고 싶지만 Next.js은 React에 중점을 두고 있어 다양한 언어의 코드를 다루기 어렵다.
때마침 회사 동료로부터 Astro을 알게 되었다.
- 콘텐츠 전달에 최적화되어 있어 그냥 빠르다.
markdown관련 설정이 프레임워크 단에서 탑재하고 있다.html을 더 직관적으로 다룬다.Astro Islands을 통해 다양한 언어를 쉽게 탑재할 수 있다.
“바로 이거다” 싶었다.
가히 MPA의 정점이라고 칭할 수 있을 것 같다. 만약 브런치를 최신 프레임워크로 이전시킨다면 Astro가 가장 매력적이지 않을까 생각이 들기도 했다. 하지만 그런 날은 오지 않을 듯하다
그렇게 작업이 시작되었고 9월, 10월이 흘러 마침네 새롭게 단장되었다.
관련 후기는 별도로 글을 정리 해볼까 한다.
그렇게 블로그에 공방이 추가되었다.
덤으로 핫한 bun을 패키지 매니저로 처음 써보게 되었다. 체감이 될 정도로 빠르긴 하다.
https://bepyan-me-v2.vercel.app/
추가로 글 레이아웃의에 대한 철학과 디테일은 글 예시에 추가했다.
마침내 도메인을 구매하다.
도메인은 가비아에서 구매했다. 타 사이트와 비교했을 때 가격도 저렴하고 UI도 깔끔했던 것 같았다. 자켓 하나 산다고 생각하고 3년에 7만원으로 결재했다.
사실 처음 도메인을 구매해 서비스에 연결하는거라 조금 겁났었다.
하지만 vercel은 신이었다.
DNS 정보만 붙여놨더니 바로 도메인이 연결되었다.
맺으면서
기술 블로그는 진짜 애정없이는 유지가 안되는 것 같다. 앞으로도 이 애정을 유지하기 위해 계속 내 마음과 대면 해야겠다. “넌 블로그에서 뭘하고 싶니?”