개요

나는 당당하게 말할 수 있다. React보다 Vue가 더 좋다.

왜 뜬금없이 이런말을 하는지 모르는 사람들이 많은것같아서 알려주자면, 최근에 Vue의 서브프로젝트인 VuePress (opens new window) 의 메이저 업데이트(1.0.0버전으로 드디어!)가 진행되었다. stable은 아니고 alpha 릴리즈이지만, 이래도 어떠하리 저래도 어떠하리.

예전에 사용하던 Ghost보단 좋을것같아서, 가이드도 제작되어있지 않은 상황에서 일단은 사용하기로 마음먹고 3일동안 죽어라 파봤다.

Ghost에서 VuePress로

다음과 같은 항목들이 나에게 자극을 주었다.

1. Ghost의 안정성이 떨어지는 편이다.
2. ghost.org의 블로그 호스팅을 사용하는것이 아니면 서버 호스팅을 받아 직접 설치하고 운용해야되는데 서버비용과 서버보안에 대한 비용이 증가한다
3. Markdown을 이용한 포스트의 백업이 되지 않는다. 즉 자료이전에 대한 호환성이 떨어진다.

목표

• VuePress Next저장소의 기능들을 모두 끌어올려서 개발
  • 블로그, 검색, 페이지네이션
  • 포스트 내 목차 별도 제작
  • 임베디드 형태의 코멘트 제작
• 블로그 게시물 작성보다 열람에 있어 편의성을 더 향상
• 2017년경 제작한 블로그 레이아웃 활용
• style은 SCSS를 이용하여 전역변수 및 라이브러리 이용하여 제작(컬러부분의 도움만 받기로 했다)
• 섬네일 관련 플러그인 제작
• 별도 SEO 적용

제작과정

1. VuePress의 릴리즈가 알파릴리즈라서 제대로된 문서가 존재하지 않았다. 다행히 VuePress의 메인 컨트리뷰터중 한명인 ulivz가 올린 저장소 예제 (opens new window)를 통해 테마 및 기본 설정을 보고 확인 할 수 있게 되었다.
2. 그 외에 올라와있지 않은 내용들은 직접 VuePress의 코어를 뜯어가며 확인했다. .vuepress 폴더에 components 폴더가 들어가는것이 지원된다는것과 enhancedApp.js이 적용되는것, 설정에 CSS Pre-Processor들(SASS, SCSS, Stylus등)의 설정이 가능한것도 알게 되었다.
3. 테마도 다행히 VuePress 블로그용 테마 저장소 예제 (opens new window)를 통해서 소스를 확인해가며 적용했다.
4. 그 외에 웹폰트, 스타일이라던가 이것저것은 내 입맛에 맞춰 적용했다.

결론

이 블로그의 기능, 디자인은 아직 100% 완성되지 않았다. 조만간 포스트가 늘어날때 대비할 페이지네이션과 지금 문제로 인하여 만들지 못한 태그, 카테고리 페이지의 디자인. 그리고 검색 기능과 코드 하이라이트 기능, 목차와 SEO까지.(코드 하이라이트는 솔직히 라이브러리를 뭐써야될지 모르겠어서 아직 결정을 못했다)

별도로 이슈되는 항목 (opens new window)이 존재해서 해당 항목이 적용되기 전까진 카테고리/태그 관련된 기능을 적용할수가 없다. 별도로 플러그인 기능의 문서가 정식적으로 생기면 포스트 커버 플러그인도 만들어야된다.

스타일도 포스트 커버 스타일 적용을 못했다.

계속 포스트를 작성하면서 기능도 개선시켜야하는 문제가 남아있다. 정말로 아직 갈길이 멀다.

v1.0.0-alpha.0 릴리즈가 배포되었을때 크리티컬 이슈로 사용도 제대로 못했는데, 평소같으면 VuePress를 더이상 사용하지 않았을법한 문제였음에도 불구하고 이슈리포트도 하고 오픈소스 정신(?)에 맞춰서 나름 잘 사용한것같다.

테마 자체도 충분히 시간을 들여서 개발할만한 가치가 있었음에는 틀림없다. 다시금 블로그로 무언가 작성하는 일이 즐거워질것같은 느낌이다.

그리고 지금 이 글을 보고계신 여러분들에게 환영한다. 이게 VuePress로 만들어진 블로그의 결과물이다.