Next js 블로그 개발 회고
왜 블로그를 만들었을까?
개발자로 진로를 결정한 이후 notion에 개발과 관련한 글을 작성했습니다. notion을 통해 쉽게 글들을 작성하고 다시 볼 수 있었지만, 모든 글이 일관성 있지는 않았습니다. 하지만 이 중 제가 열심히 자료를 찾고 준비한 글은 다른 사람과 공유를 하고 싶었습니다. 이러한 이유로 별도로 블로그를 만들어서 notion에 정리한 글 중 일부를 다듬어 올리기로 결정했습니다.
대부분의 기술 블로그는 티스토리 , 벨로그, 미디엄 플랫폼을 사용하고 있었습니다. 저도 해당 플랫폼을 사용해볼까 고민을 하다가 개발자로 진로를 정한 만큼 직접 블로그를 만들어서 SEO 설정과 배포를 해서 관리하기 위해 직접 블로그를 만들었습니다.
블로그를 만들기 위한 프레임워크로는 Next.js를 활용했습니다. 정적 사이트 생성의 대표적인 프레임워크로 Gatsby와 Next.js가 있는데, 이중 Next.js를 선택하여 블로그를 만들었습니다. 정적 사이트를 만드는 목적에서는 Gatsby가 더 적합하다고 느꼈지만, Gatsby에서 제공하는 대부분의 기능을 Next.js에서도 지원을 해주고 있었으며, 또한 현재 Next.js가 대세라는 점이 선택의 계기가 되었습니다. 특히 당시에는 Next.js를 접해보지 못했기 때문에, Next.js의 SSR과 RSC에 대한 개념이 잡혀있지 않았습니다. 블로그를 만들면서 이러한 Next.js의 App router 개념에 대한 학습과 SSR, RSC에 대한 학습을 하기 위해 Next.js를 선택했습니다.
무엇을 고려해야 할까?
- 블로그 글 관리하기
가장 먼저 고려해야 하는 것은 블로그를 운영하기 위해서는 블로그에 개시할 글이 있어야 하고, 해당 글을 어떻게 관리할지 결정해야 했습니다. 저는 서버에 글을 저장하고 관리하는 방식이 아닌, 프로젝트 내부에서 mdx파일로 글을 관리하고 이를 jsx 컴포넌트로 변환하여 보여주는 전략을 취했습니다. 해당 방법은 FE 개발자로 빠르게 블로그 환경을 갖춰주는 것에 도움이 되었습니다.
이를 위해 Contentlayer을 활용했습니다. mdx로 글을 만들고 Next.js를 빌드하는 과정에서 해당 mdx 파일을 모두 코드에서 활용할 수 있는 data로 변환하는 과정을 거칩니다. 외부, 내부 소스에 관계 없이 이를 모두 javascript와 JSON 파일로 변환하여 블로그에 적용할 수 있었습니다.
또한 typescript를 지원하는 점도 좋았습니다. 각 mdx 파일에 타입을 설정해서 글을 분류하고 정리하는 과정을 쉽게 적용할 수 있었습니다.
- 블로그 스타일
블로그 스타일을 적용할 때, 컴퓨터 환경 뿐만 아니라 모바일 환경도 고려해 반응형으로 디자인을 관리해야 했습니다. 다양한 CSS 방법론이 있는데 이중 tailwindcss를 선택했습니다. 일반적인 React만을 활용할때는 CSS-IN-JS 방법을 많이 활용했는데, 서버컴포넌트를 지원하는 Next.js에서는 불편한점(스타일 삽입 순서 지정의 어려움, 인스턴스 로드 에러)이 많고 적용하는 과정이 어렵기 때문에 tailwindcss를 적용했습니다.
- SEO
블로그 글은 무엇보다 검색 사이트에 노출이 되어야 합니다. 이를 위해 sitemap을 작성하고 SEO 최적화를 위해 meta tag를 활용했습니다.
해당 세 가지 기능이 블로그를 만들 때 가장 중요하게 고려해야 할 점으로 꼽았습니다. 이 외에 사용자 편의를 위한, 댓글, 이미지 최적화, TOC, 다크모드 등을 추가로 구현해야 할 과제로 잡았습니다.
불편한 점
블로그를 모두 배포하고 운영하는 단계에서 겪은 불편한 점은 글 작성이었습니다. 저는 블로그에 글을 올리기 전에 notion에서 먼저 작성한 후에 이를 md 파일로 변환하여 블로그에 적용하고 있습니다. 이때 해당 과정에 생각보다 시간 소요가 있다는 것을 알았습니다. contentlayer에 맞추어 md 파일은 mdx 파일로 변환 및 수정을 해야 하고, 개발 환경에서 깨지는 이미지, 글을 확인하고 이를 수정해야 하는 작업이 어려웠습니다.
해당 작업을 통해 글의 맞춤법을 확인하고 다시 글을 읽어보며 되짚어보는 시간을 가지는 것은 유익했지만, 해당 과정이 불편해서 블로그에 글을 업로드하기 보다는 notion에 만 글을 작성하는 빈도가 많았습니다.
하지만 이러한 불편한 점이 기존의 목표였던 제가 생각하는 양질의 글을 올리는 작업의 연장선으로 생각하기로 하였습니다. blog에 많은 글을 올리지 못하더라도 이러한 불편한 점이 배포 직전 까지 해당 글을 반영할지 결정하고 글을 다듬는 것에 도움이 된다고 생각합니다.
느낀점
항상 배포를 한 후 양가적인 감정을 가집니다. 프로젝트를 무사히 마무리했다는 만족감과 기능, 디자인, 구성이 마음에 들지 않는 아쉬움이 공존합니다. 그래도 언제나 만족감이 더 큽니다. 게으르게 작업을 했지만, 마무리가 되었고 드문드문 글이 업로드 되고 있다는 점에서 충족감을 느낍니다.
구글 Search Console에 페이지 색인 생성을 별도로 해야 하는 점을 몰라서 뒤늦게 수동으로 진행을 해지만, 가끔 구글에서 search를 진행할 때, 하단의 저의 post도 확인할 수 있다는 점이 좋았습니다. (검색어 우선순위에 밀려 스크롤을 아래로 열심히 내리긴 해야 했습니다.. ㅎㅎ)
또한 다음과 같이 실적도 확인할 수 있으니 기분이 상당히 좋네요! 회고를 작성한 5월 동안의 블로그 실적입니다.
앞으로도 꾸준히 글을 작성해서 많은 분들이 찾아오는 블로그를 만들기 위해 노력하겠습니다!
- 왜 블로그를 만들었을까?
- 무엇을 고려해야 할까?
- 불편한 점
- 느낀점