나는 Next.js로 개발한 블로그를 사용하고 있었다.
블로그에 어떤 글을 포스팅 하든 얼마나 편하게 포스트를 작성하고 배포할 수 있는지가 굉장히 중요한데 Next.js로 개발한 블로그는 항상 불편함을 느꼈다.
새로 만들자는 생각은 여러 번 했지만 계속해서 미루다가 얼마 전에 Gatsby를 이용해 새로운 블로그를 만들면서 겪은 내용들을 공유해보려 한다.
Next.js
SSR을 지원하는 SPA를 지원했고 리액트를 사용해봤다면 어렵지 않게 사용 가능하다는 점과 별도의 라이브러리 없이 간편 라우팅을 지원하고 Typescript를 지원했기 때문에 블로그 개발을 위해 Next.js를 선택했었다.
나중에 알게 된 사실이지만 모든 페이지를 Static Page로 배포하는 Github Pages에서는 SSG로 개발한 웹만 지원되고 굳이 Next.js의 SSR을 사용할 필요가 없었다.
사용하면서 느낀 문제점
정보 부족
Next.js를 Typescript로 작성해서 Github Pages로 배포하는 블로그가 대중적인 조합이 아니라 개발 중에 발생하는 이슈들에 대한 정보를 찾기가 어려웠다.
개발 편의성
작성한 포스트의 배포 과정이 너무 복잡하고 잔 오류가 너무 많았다.
분명 Javascript Next.js 앱을 Github Pages로 배포했을 때는 아무런 문제가 없었는데 Typescript를 이용해 작성하면 Static page로 정상 빌드되는데 Github에 Push가 불가능한 경우가 왕왕 있었다.
한두 번이면 참고 사용했겠지만 빈도가 잦았음
결국...
새로 블로그를 만들 엄두가 안 나서 잔 오류들을 수정해가면서 사용했는데 라이브러리 의 존성이 조금만 바뀌어도 계속 새로운 오류가 발생했다.
포스팅 보다 이슈 해결을 위한 리소스가 더 많이 들어가는 것을 보고 항상 문제를 일으키는 Github Pages를 통한 배포를 포기하고 다른 방법을 찾아보려 했다.
일단 가장 중요한 건 블로그 유지를 위해 요금을 지불할 필요 없는 무료 서비스를 찾는 것이었다.
가장 처음 생각난 건 AWS를 이용한 호스팅이었지만 한번 만들어두고 계속 사용하려는 생각이었기 때문에 기간 한정 무료 서비스는 이용하고 싶지 않았다.
평소 Toyproject용으로 자주 사용하던 Heroku로 배포해봤는데 서버가 Sleep상태일 때 페이지를 불러오는데 딜레이가 생기는 것이 블로그로 사용하기에는 부적합하다고 판단했다.
결국 기간 제한 없이 무료로 사용할 수 있는 건 Github Pages가 가장 낫다고 생각했고 Github Pages에 적합한 다른 도구들을 찾아보게 되었다.
새로운 블로그 개발을 위한 도구
가장 크게 두 가지 고려 사항이 있었다.
우선 한번 만들어두면 계속 쓰게 될 텐데 유지보수 편의성은 개인적으로 Javascript보다 Typescript가 편하다고 생각했기 때문에 Typescript를 지원하는 도구를 사용하고 싶었다.
그리고 새로운 블로그를 개발하게 된 가장 큰 이유인 Github Pages와의 궁합이 좋은 도구를 선택하려 했다.
후보
위 조건을 만족하는 도구는 크게 두 가지로 Jekyll와 Gatsby가 있었고 둘 다 사용해보니 새삼 개발 도구 선택이 얼마나 중요한지 느꼈다.
그동안 많은 시간을 들여 구현해야 했던 기능들이 플러그인이나 기본 기능으로 제공되는 경우가 많았고 이것이 인기의 비결이 아닌가 싶다.
두 가지 도구를 모두 사용해보면서 내가 느낀 점이라면 다음과 같다.
Gatsby
리액트 기반이라 익숙했고 GraphQL을 통한 간편한 Data 관리가 가능했다.
Jekyll
간편하게 블로그 개발이 가능하지만 Ruby가 익숙하지 않아 정해진 템플릿에서 큰 수정이 어려웠다.
Gatsby보다 커뮤니티가 더 활성화되어있다고 느꼈다.
결국 Gatsby
내가 Ruby를 사용할 줄 모르기 때문에 내 생각이 100% 반영된 블로그를 개발하지 못할것 같아 Gatsby를 선택했다.
블로그 개발에 큰 시간을 쏟고 싶지 않은것도 한몫
Gatsby Starter Library에 쓰기 좋은 템플릿들이 많았지만 블로그 제작을 목적으로 하는 템플릿 중에 맘에 드는 것이 없었고 다른 목적을 가진 예쁜 템플릿들은 수정 중에 다음과 같은 문제점을 마주하게 되었다.
- 사용하지 않는 잡다한 기능들이 많음
- 최신 CSS로 구현 가능한 기능들이 JS로 구현되어있음
- 전역으로 선언된 스타일시트가 때때로 많은 고민을 하게 만듦
위에서 언급한 문제들 외에도 특이한 나만의 공간이 가지고 싶다는 생각 때문에 결국 처음부터 템플릿 없이 개발하기로 했다.