# 정적 사이트 생성기란
웹사이트 구축
# 서두
정적 사이트 생성기(SSG, Static Site Generator). 꽤 오래전부터 들어왔지만 실제 사용은 이번이 처음이다. 자세한 사항들은 다른 블로그에 널리고 널렸으니 내가 굳이 다시 정리할 필요는 없겠다. 내가 필요한 정보들만 다루어 보겠다.
결국에 중요한 문제는 어느 시점에서 동적이면 되는가의 문제로 귀결됩니다. 블로그가 정적 웹페이지로도 만들어질 수도 있는 건 모든 시점에 동적일 필요가 없었기 때문입니다.
이 블로그의 내용중 가장 핵심 문장이라고 생각하는 부분이다. 인터넷의 초창기 목적이었던 정보 전달과도 부합하는 SSG이다. 참으로 유행은 돌고 돈다.
# 언제 생겼을까?
SSG | 위키피디아 (opens new window)를 찾아보면 이미 옛날부터 홈페이지 제작시 사용하던 드림위버같은 WYSIWYG (opens new window) 툴들도 SSG라고 할 수 있다. Static Site Generators (opens new window)에서 인기도로 정렬하고 생성연도를 대략 훑어보면, 2014년 정도부터 크게 유행하기 시작한 것으로 보인다.
요즘 유행하는 마크다운 형태로 작성된 소스를 빌드하여 html로 만드는 툴들 중에는 Jekyll (opens new window)이 가장 인기가 많고 오래된 것으로 보인다. 프로젝트 자체는 2008년 시작되었지만 Github Page와 연동되기 시작한 것은 2014년으로 보이며(SSG가 인기 폭발하는 시점과 일치한다, Jekyll # Features | 위키피디아 (opens new window)), 구글링 해보면 2015년부터 SSG와 Jekyll의 관계가 검색에 등장하며, 그 후로는 랭킹 사이트들에서 변함없이 1위를 달리고 있다.
# 누가 주로 사용할까?
사실 누구든 사용은 가능하겠지만 글을 작성 후 배포하는 방식이 Git 같은 소스 형상 관리 툴을 이용하거나, 빌드된 html을 직접 업로드 해야 하기 때문에 주로 소스를 다루는 S/W 기술자들이 익숙하게 사용하게 될 것 같다.
# 어디에 주로 사용될까?
정적인 정보를 다루는데에 적합하므로 정보 변화가 크지 않은 프로젝트 홈페이지, 튜토리얼등이 제일 적합할 것으로 생각된다. 잘 생각해보면 사이트 소유자만이 생성/수정할 수 있는 곳이라면 모두 해당될 수 있겠다.
요즘은 개발자들이 개인 블로그나 Github 프로젝트 소개에 많이 쓰고 있다. 오해하지 말아야 할 것은 웹페이지의 모양이 정적이라는 것이 아니다. Javascript가 동작되므로 애니메이션이나 각종 효과는 동작 가능하다. 다만 해당 웹페이지 내에서 제공한 정보 이외의 변형이 쉽지 않다는 뜻이다. 동적 컨텐츠도 플러그인이나 각종 연동을 하면 불가능하지는 않다. 많은 곳에서 댓글 시스템은 주로 Disqus라는 서비스를 사용하고 있다.
# 왜 사용하는가?
언뜻 생각하기에는 동적인 컨텐츠를 다루기 매우 제한되기 때문에 사용처가 적을것 같지만, 서두에 언급한것 처럼 모든 사이트가 동적일 필요는 없으며, 이로 인해 얻는 장점 중에
- html만 제공하면 되므로 웹서버 설정이 간편하다.
- DB관리등 운영에 필요한 자원 소모가 거의 없다.
- 기본 컨텐츠가 md 파일이므로, 다른 플랫폼으로 이전이 쉽다.
이런 특징들이 있기 때문에 분명 수요가 존재한다. 개인적 경험으로도 개인 사이트와 블로그 구축에도 SSG를 사용하는게 관리 측면에서 매우 편했다.
# 최신 동향
StaticGen (opens new window)에서 Github Star를 기준으로 인기 순위를 확인해 볼 수 있다. 현재 사용중인 VuePress의 경우 8위에 랭크되어있다.
몇가지 주요 도구를 요약해보면...
# Jekyll
단순 사용에는 문제가 없지만 Ruby로 제작된 도구라서 커스터마이징은 Ruby언어에 익숙한 사람만이 가능하겠다. 단연 1등인 만큼 테마나 플러그인 등이 제일 풍부하다. 단점으로는 빌드할 페이지 숫자가 많아질수록 기하급수적으로 빌드 속도가 느려진다고 한다. Github Pages등에 내장되어 있으므로 일반적으로 사용하기에 제일 무난할 것으로 보인다.
# Hugo
인기순위 랭킹 2위. Go언어로 개발되서인지 빌드 속도가 엄청나게 빠른 것으로 유명하다. 빌드 속도가 빠르기 때문에 문서 작성 단계에서 실시간으로 브라우저에서 확인이 가능하므로 WYSIWYG 툴에 준하는 사용성을 보일 것으로 생각된다.
# Hexo
인기순위 랭킹 3위. Node.js 기반이라서 인기가 많은 것으로 보인다. 공식 한글 문서가 지원되는 것이 눈에 띈다.
# Gatsby
React 컴포넌트를 사용할 수 있다는 점에서 매우 큰 인기를 얻은 것으로 보인다. 홈페이지 정보를 보니, 정적 컨텐츠 외에 동적 데이타를 GraphQL을 사용해서 다룰 수 있다.
# VuePress
Gatsby와 유사하게 Vue 컴포넌트를 사용할 수 있다. Vue와 더불어 급속히 인기를 얻고 있으므로 주목할 만하다.
# Next, Nuxt
SSG보다 SSR(Server Side Rendering)이라고 불러야 할 도구들이다. Eject해서 SSG처럼 사용할 수 있으므로 SSG 목록에 포함된 것으로 보인다. SSR 역시 중요한 개념이니 별도로 다루어 봐야겠다.
# 결론
일반적인 블로그 플랫폼들이 컨텐츠 작성이나 꾸미기가 간편한 반면 테마 적용이나 커스터마이징이 제한적이라면, SSG는 그 반대점에 있다고 볼 수 있다. 또한 개발자라면 익숙한 md와 Git을 사용하기 때문에 워크플로우도 매끄럽다. 장점과 단점이 뚜렷한 분야이고, React/Vue같은 컴포넌트 사용을 넘어서 동적 데이타를 연동하는 방향으로도 발전하고 있다. 앞으로의 발전 방향이 꽤 재밌을것 같다.
← 마크다운 예제 1인당 1계정의 법칙 →