Gatsby로 블로그 만들기
개발 배경
난 원체 기록하고 그걸 남에게 보여주는 것을 부끄러워 하는 편입니다. 그러나 부트캠프를 하면서 팀장도 맡아보고 발표도 해보면서 이런 생각이 많이 바뀌었어요. 내 생각과 배움이 휘발되지 않도록 하는 것에서 멈추지 않고, 정리하고 이를 공유하는 과정에서 재미를 느끼게 되었어요.
기존에는 벨로그라는 개발자들을 위한 블로그 서비스를 이용했습니다. 벨로그만으로도 충분할 수 있으나, 나만의 블로그를 만든 이유는 명쾌해요.
첫번째로 플랫폼부터 내 손으로 만들면 그만큼의 애정이 있어서 관리에 소홀하지 않을 것이고,
두번째로 무엇보다 디자인을 할 수 있는 저로써는 원하는대로 UI를 그리고 싶었어요.
마지막으로 스스로가 움직일 수 밖에 없는 환경을 만들어 조금이라도 부지런해지고 싶었습니다.
그러나 기술 블로그를 개발함에 있어서 너무 많은 시간을 소요하지 않았으면 했고, 기초 수준의 개발자이기 때문에 개발 난이도가 높지 않아야 했습니다. Jekyll, Gastby, Hexo 등 정적 사이트 생성(SSG) 프레임워크는 많지만 그 중 Gatsby는 React 기반의 프레임워크라서 상대적으로 익숙하고, 마침 해당 기술을 이용한 블로그 개발 무료강의도 있어 앞서 말한 조건에 딱이었어요. 그래서 Gatsby와 Github Pages를 이용하여 개발 블로그를 만들기로 결정했습니다.
Gastby?
앞서 말한 것처럼 Gatsby는 React 기반의 정적 페이지 생성 프레임워크입니다. 그렇기때문에 React를 중심으로 공부한 저에게 매우 익숙하고 러닝 커브도 낮다고 판단했어요.
Gastby는 정적 사이트 생성기(Static Site Generator)이므로 개발 후 Build 과정에서 마크업이 생성됩니다. 그렇기 떄문에 배포시에 이미 페이지 내 모든 콘텐츠가 생성되어 있어 SEO 측면에서도 큰 도움이 됩니다. 필요에 따라 lady loading과 같은 기능을 섞어 사용할 수 있다는 점은 성능 면에서도 확실한 이점이기도 하죠.
또한 Build 과정에서 Markdown으로 작성한 내용들이 모두 담겨지기 때문에 README를 작성하는 것처럼 글을 쓰기만 하면 되니까 비교적 쉽게 콘텐츠를 관리할 수도 있어서 업데이트를 할 때마다 복잡하게 할 필요 없다는 거죠.
만들고보니
- 너무 재밌었습니다. 제가 직접 디자인을 하고 개발을 하니 시간 가는 줄 몰랐어요. 무엇보다 블로그에 가는 관심과 애정이 몇 배는 더 커진 것 같아요.
- 블로그를 만들면서 SPA, SSR, SSG에 대해서 다시 공부했고, SSR과 SSG에 차이에 대해 이해하게 됐어요.
- Gatsby 공식문서를 통해 가볍게 실습을 한 뒤에 개발했지만 무료 강의를 보면서 개발했기 때문에 아직 제 블로그의 구조에 대해 이해하지 못한 부분들이 많아요. 이 부분은 차근차근 공부하려고 합니다.
개선해야 할 것들도 많아요
지금 생각나는 것만으로도 성능 최적화와 다크모드, 검색 기능, 카테고리 필터 등등... 우선 제 블로그만의 디자인 시스템을 구축하고 반영해보려고 합니다. 점차 발전해나갈 블로그를 생각하니 기분이 너무 좋네요!
참고 사이트