여태까지 써왔던 블로그 플랫폼

글을 그렇게 많이 쓰진 않았지만, 그래도 블로그 플랫폼을 몇 번 바꿔가면서 써왔다.

• Hugo
• Ghost
• 노션

물론, 위 플랫폼들은 모두 잘 만들어진 플랫폼이고, 일상적인 블로그 글 작성에는 충분히 좋은 플랫폼들이었다. 하지만, 내가 원하는 기능이 없거나, 내가 원하는 대로 커스터마이징하기 어려운 부분이 있었다. 그래서, 결국에는 내가 직접 블로그 플랫폼을 만들어서 사용하게 되었다.

내가 원했던 기능들:

• Markdown 지원: 글을 작성할 때, Markdown을 사용하고 싶었다. Markdown은 간단한 문법으로 글을 작성할 수 있어서, 글 작성이 훨씬 편리하다.
• 커스터마이징: 블로그의 디자인이나 기능을 내가 원하는 대로 커스터마이징하고 싶었다. 기존 플랫폼들은 기본적인 디자인은 제공하지만, 내가 원하는 대로 커스터마이징하기에는 한계가 있었다.
• 호스팅: 내가 원하는 호스팅 환경에서 블로그를 운영하고 싶었다.
• 자유로운 자동화 기능: 글 작성 후, 자동으로 배포되거나, 특정 작업을 자동으로 수행할 수 있는 기능이 필요했다.
• 무료: 비용이 들지 않는 무료 플랫폼을 원했다. 물론, 유료 플랫폼도 있지만, 개인적인 블로그라서 비용이 들지 않는 것이 좋았다.

솔직히, 위 기능들을 아까 말했던 플랫폼들에서 어느정도 지원하고 있지만, 그냥 내 블로그를 직접 만들고 싶었다. ㅎㅎ

블로그 플랫폼을 만들면서

먼저 블로그를 만들기 전, 디자인 영감을 얻기 위해 많은 블로그들을 참고했다. 그 중 가장 마음에 들었던 블로그는 https://www.joshwcomeau.com였다. 이 블로그는 디자인이 깔끔하고, 이전부터 봐왔던 블로그라서 자연스럽게 많은 영향을 받았다. 블로그를 둘러보면 알겠지만, Josh Comeau의 블로그 스타일과 디자인을 많이 참고했다. (추후에 나만의 스타일로 바꿀 예정이다.)

그 후, Next.js를 사용해서 블로그 플랫폼을 만들었다. Next.js를 쓴 이유는... 뭐 간단하다. 내가 제일 잘(?) 또는 익숙하게 쓸 수 있는 프레임워크이기 때문이다. 보통 이런 자기만의 블로그를 만들땐 내가 한번 써보고 싶은 프레임워크 또는 요즘 뜨는 프레임워크를 쓰는 것 같던데, 그냥 내가 제일 잘 쓰는 프레임워크를 쓰는 것이 가장 좋다고 생각했다.

마크다운으로 블로그를 쓰고 싶었기에, MDX를 사용하여 블로그 글을 작성할 수 있도록 했다. MDX는 Markdown과 JSX를 함께 사용할 수 있는 문법으로, React 컴포넌트를 Markdown 안에 삽입할 수 있어 매우 유용하다. 또한, Next.js와 잘 통합되어 있어 블로그 글을 작성하는 데 큰 도움이 되었다.

커스터마이징 또한 tailwindcss를 사용하여 쉽게 할 수 있었다. 다만 아직 익숙하지 않아서 (기존에는 Styled Components를 사용했었음) 약간의 시행착오와 지속적으로 문서를 찾아봐야 했다. 뭐 이러면서 점점 익숙해질 것이라고 생각한다.

제일 어려웠던 부분은 code syntax highlighting이었다. MDX에서 코드 블록을 사용할 때, syntax highlighting을 적용하는 것이 생각보다 까다로웠다. 하지만, rehype와 remark를 사용하여 문제를 해결했다. 이 부분은 나중에 블로그 글로 자세히 다룰 예정이다. (이 또한 Josh Comeau의 블로그에서 많은 도움을 받았다.)

나는 블로그를 영어와 한국어로 적기 때문에 i18n은 고려를 많이 했지만, 이 블로그 플랫폼에는 도입이 굳이 필요하지 않다는 결론을 내렸다. 아마 왠만하면 영어로 글을 작성할 것 같고, 한국어로는 가끔식 작성할 것 같다.

앞으로의 계획

앞으로의 계획은 다음과 같다:

로드맵에 쓰기에는 너무 아직 구체적으로 정해진 것이 없어 적지 않았지만, 스타일링도 추가적으로 계속 할 예정이다.

(위 로드맵도 따로 컴포넌트로 만들어서 MDX에 사용할 수 있다. 여러모로 MDX는 정말 편리하다.)