thisyujeong.dev

내가 Next.js 블로그를 시작한 배경
June 5, 2022
8 min read

블로그를 직접 만들어보고 싶다는 생각은 누구나 한 번쯤 했을 것이라고 생각한다. 그래서 나는 블로그 환승이 많았던 것은 아니지만, 이 블로그의 첫 포스팅으로 내가 어떻게 Next.js 로 블로그를 만들게 되었는지 작은 여정을 풀어보려고 한다.

벨로그, 처음 시작한 블로그

개발의 영역에 들어오고 처음 시작한 블로그는 Velog(벨로그)였다. 초보 개발자가 입문하기에 딱 좋은 플랫폼이라고 생각한다. 벨로그를 선택한 이유는 접근하기 쉽고 입문하기 좋으니까, 다들 벨로그하니까 따라서 시작했다.

그러다 며칠 안지나서 벨로그를 그만 뒀다. 어떤 계기가 있던 것은 아니고 글 쓰는 맛이 없다고 해야하나? 그냥 재미가 없었다. 하고싶어서 하는 블로그가 아니라 해야하니까 어쩔 수 없이 하는 블로그였다. 물론 재미로 블로그를 하는 건 아니지만 글을 꾸준히 쓰게 해줄만한 동기부여나 자극제가 없었다. 그렇게 자연스레 흐지부지 벨로그를 그만두게 됐다.

수 개월이 흐르고 문득 블로그를 다시 시작해야겠다는 생각이 들어 새로운 블로그 개설을 계획했다. 거창한건 아니고..

예전부터 블로그를 직접 만들고 싶다는 생각은 꽤 예전부터 했었다. 그러나 초보 개발자인 나는 막막하기만 할 뿐 어떻게 시작해야할지 몰라 여기저기 커뮤니티에 질문하고, 자문을 구하고 다녔다. 당시 MongoDB + Node.js 와 리액트를 공부하고 있던 시기라 뭣 모르고 서버가 딸린 블로그를 만들어볼까.. 하는 생각을 했는데 참 겁도 없이 간도 컸다.

추천받은 정적 블로그 후보

아무튼, 멋진 개발자 분들이 추천해준 블로그는 아래 3가지가 가장 많았다.

  1. Jekyll
  2. Gatsby
  3. Next.js

먼저 Jekyll은 Ruby에 대해 완벽하게 무지했기 때문에 가장 첫번째로 탈락시켰다.
Gatsby 는 Graphql에 무지했기에 제외되었다. Next.js 는 리액트 기반으로 개발이 가능했기 때문에 유력한 후보였는데, 이 마저도 초보 개발자한테는 어려웠다. 그만큼 내가 많이 부족했던 거지..

나의 선택은?

그렇게 열심히 서치해가며 삽질하다가 Vuepress로 제작한 블로그를 발견했고, 나는 방향을 틀어 vuepress 기반 블로그 제작을 도전했다. 여기저기 서치해가며 vuepress로 만들어진 블로그란 블로그는 모두 참고해가며 만들었는데, 그렇게 제작된 블로그가 바로 thisyujeong-til 이 TIL 블로그다. 실제로 TIL 블로그를 만들고 공부량이 늘었고, 직접 만들어서 그런지 꾸준히 하게되더라는..

지금은 사이드 네비게이션이 동작하지 않을 것이다(글 하나 먼저 누르고 나면 동작하긴 한다). 당시 vuepress를 만들때 부족한 실력으로 어정쩡하게 만들다보니 템플릿 테마를 설치가 아닌 다운받아 제작했던게 문제였던 것 같다. 아마 vue 버전 업이 되면서 발생한 에러라고 추측중이다. 지금 생각해보면 왜 그렇게 만들었는지 나도 모르겠다.

돌고 돌아 Next.js 로

이렇게 된 김에 아예 TIL 이 아닌 진짜 블로그 다운 블로그를 만들보고자 했다. 그리고 Next.js 로 넘어오게 된 결정적인 이유는 TIL 블로그의 SEO 관리가 굉장히 힘들었다. 검색 노출을 하려면 Search Console에 사이트맵을 제출해야 하는데, 모든 방법을 총 동원해 제출해도 가져올 수 없다고 한다. Google Developer에 직접 질문도 남겨봤고, 참고했던 블로그 주에게 직접 자문을 구해보기도 했지만 아직까지도 그 상태 그대로 남아있다.

결국 돌고 돌아! 사전렌더링을 사용과 Seo 관리에 최적화되어있다는 Next.js 로 환승하게 되었다!

기획 시 꼭 넣고자 했던 것

  • TOC(Table of Content; 목차)를 넣을 것
    • 다음 게시글로 업로드 했다.
  • markdown 사용
  • Git 과 연결된 comment 달기
    • Giscus 를 사용했다. 리액션을 할 수 있어 Giscus를 고집했다.
  • Dark / Light 모드

그래서 나는 만족하는가

결론부터 말하자면 매우 그렇다. 불과 몇달 전까지만해도 부족한 실력으로 포기했었다. 아, 그렇다고 이 블로그를 개설한 과정이 쉬었다는 건 아니다. 다른 블로그 오픈 소스들을 정말 많이 참고했다. 이전에는 오픈소스를 뜯어봐도 이해가 안되는 부분이 많았다. 지금은 코드를 보고 어느정도는 이해가 가는 정도가 되었다.

내가 만족한 이유를 몇 가지 뽑자면

  1. 자유로운 커스텀
  2. seo 관리 정말 간편했다. 진작 배워볼걸 휘회했다.
  3. 참고할 자료가 이전 TIL 블로그를 만들 때 보다 많았다. (이건 나만 해당 될 듯)
  4. 위에서 말했듯 제작하면서 여기저기 다른 오픈 소스들을 많이 참고 했다. 그 과정에서 이 사람들은 왜 이렇게 코드를 짰을까 고민해보고 뜯어보는 재미가 있었다. 덕분에 새로운 지식을 정말 많이 얻었다. 멋쟁이 개발자님들 최고다!

나의 블로그 환승 이야기는 여기서 마친다!


Next.js를 이해하는 데 도움을 많이 받았던 강의 😎

React 완벽 가이드 with Redux, Next.js, TypeScript

이전 포스트가 없습니다.
Next.js 정적 블로그에 TOC 목차 생성하기