안녕하세요! 저는 펜타곤이라는 닉네임으로 활동하는 백엔드 개발자입니다.
최근 자기소개 페이지를 만들면서 자연스럽게 제 실적물을 소개할 수 있는 블로그를 만들기로 결심했습니다.
상용 블로그 플랫폼도 고려했지만, 커스터마이징의 한계를 느껴 직접 구현하기로 마음먹게 되었습니다.
이 글에서는 블로그 개발의 과정을 여러분과 공유하려 합니다.
1. 첫 번째 시도: Jekyll
블로그를 직접 구현하기로 결심한 후, 가장 먼저 시도한 것은 Jekyll이었습니다. Jekyll은 정적 사이트 생성기로, GitHub Pages와의 호환성이 좋아 많은 개발자들이 사용하고 있죠. 또한, 마크다운을 사용해 쉽게 콘텐츠를 작성할 수 있다는 점이 매력적이었습니다.
Jekyll로 간단한 블로그를 만들어 보니, 기본적인 기능 구현과 배포는 쉽게 할 수 있었습니다. 그러나 조금 더 동적인 기능들을 추가하고 싶어지면서 한계를 느끼기 시작했습니다. Jekyll은 정적 사이트 생성기인 만큼, 동적 데이터 처리나 사용자 인터랙션 부분에서는 제약이 있었습니다.
Ruby 환경에 익숙하지 않은 점도 한 몫 하였습니다
2. 두 번째 시도: React
Jekyll의 한계를 느끼고 나서, 좀 더 동적인 웹사이트를 만들기 위해 React로 눈을 돌렸습니다. React는 컴포넌트 기반의 라이브러리로, 재사용 가능한 UI 컴포넌트를 만들 수 있어 대규모 애플리케이션 개발에 적합합니다.
React로 블로그를 만들어 보니, 컴포넌트 단위로 설계된 구조가 마음에 들었습니다. 그러나, 블로그와 같이 SEO가 중요한 사이트에서는 클라이언트 사이드 렌더링의 한계가 있었습니다. 초기 로딩 속도와 SEO 문제를 해결하기 위해 서버 사이드 렌더링이 필요하다는 결론에 도달했습니다.
3. 최종 선택: Next.js
SEO와 성능 문제를 해결하기 위해 선택한 것은 바로 Next.js였습니다. Next.js는 React를 기반으로 한 프레임워크로, 서버 사이드 렌더링(SSR)과 정적 사이트 생성(SSG)을 지원합니다. 이를 통해 SEO를 개선하고 초기 로딩 속도를 줄일 수 있어 저에게 딱 맞는 선택지 였습니다.
그러나, 사실 저는 Next.js를 한 번도 해본 적이 없었습니다....
따라서, Next.js의 기본 개념과 사용법을 익히기 위해 공식 문서를 참고하고, D5BL5G 블로그의 MDX 렌더링과정을 차용하여 (감사합니다) 블로그를 구현하게 되었습니다.
Next.js를 사용해 블로그를 개발하면서, 정적 파일 생성과 동적 데이터 처리의 균형을 맞출 수 있었습니다. 특히, Next.js의 getStaticProps와 getServerSideProps 기능을 통해 필요한 데이터를 사전에 준비하거나, 실시간으로 서버에서 가져올 수 있었습니다.
결론
이렇게 해서 저의 블로그는 Next.js를 사용해 개발되었습니다. 처음에는 Jekyll로 시작했지만, React를 거쳐 최종적으로 Next.js로 마무리하게 된 이 과정은 많은 것을 배우게 해주었습니다. 앞으로도 블로그를 통해 더 많은 실적물을 공유하고, 개발 과정을 나누겠습니다.
다음에는 블로그에 기능을 추가하게 된다면, 그 기능을 구현하는 과정도 함께 공유하겠습니다. 혹시, 블로그에 추가할 만한 기능이 있다면 댓글로 남겨주세요. 여러분의 의견을 존중하고 반영하겠습니다.
감사합니다.