블로그 서비스 비교, Chirpy 블로그 트러블슈팅

블로그 종류

블로그를 개인 기록 보관, 사설 투고, 개인 갤러리, 포트폴리오 등 여러 용도로 사용할 수 있으며, 한국에서 사용하는데 있어서는 대중적인 선택지가 제한적인 것은 사실이다. 오늘은 가능한 옵션들을 각각의 특징에 따라 비교해보고, 내가 선택한 옵션인 깃허브 페이지 블로그, 그중에서도 사용하기로 정한 테마인 Chirpy테마에 대해 글을 남기고자 한다.

대중적인 블로그 선택지로는 다음과 같은 것들이 있다.

1. 네이버 블로그(Naver Blog)

   • 한국에서 가장 널리 쓰이는 포털 사이트인 네이버에서 제공하는 블로그 서비스인만큼 가장 대중적인 선택지라고 할 수 있다.
   • 네이버 계정만 있으면 손쉽게 시작할 수 있으며, 기본제공되는 기능들도 가볍게 꾸미는데 크게 손이 많이 가지 않는다. 다양한 레이아웃과 배경 이미지, 위젯등이 기본적으로 제공된다.
   • 네이버 검색 엔진에서 쉽게 접근 가능하다. 맛집, 제품이나 여행 후기 등등 네이버 지도, 카페등의 서비스를 함께 사용한다면 연동하여 사용하기 좋을 것이고, 검색을 통한 노출 또한 타 블로그보다 쉬울 것이다.
   • 다만 마크다운(MD) 형식의 글을 지원하지 않는다. 워드나 한글처럼 보이는대로 글을 작성하고자 하는데 불편사항없고 오히려 간편하지만, 동영상과 사진 이외의 것들을 보여주는데 한계가 있을 수 있다. 코드블록 기능은 그래도 제공중이다.
   • 네이버에서 제공하는 기능 외에 추가적으로 확장을 하는데 제한사항이 있다. 대표적으로 구글 애드센스는 연결이 불가능하고, 개별적으로 개발된 오픈소스 기능들이 있다면 블로그 위젯이나 기능 형식으로 추가하는건 사실상 포기해야될 것이다.

2. 티스토리(Tistory)

   • 과거에 다음의 블로그 서비스로 유명했던 티스토리이다. 초창기에는 이미 사용하고 있는 사람들의 초대장을 통해서만 개설/시작할 수 있었지만 상당한 과거의 이야기이고, 현재는 다음/카카오 계정만 있으면 손쉽게 시작할 수 있으며, 네이버 블로그에 비해 확장성, 자유도가 높아 선호하는 층이 꽤 크다.
   • 자유도가 괭장히 높은 편이다. HTML을 이용해 블로그의 꽤나 많 기능을 편집할 수 있다. 구글 에드센스등 기능을 추가하는 것 또한 당연히 제약이 없다. 전문적인 블로거중에 이용자 층이 생각보다 많아서 그런지, 스킨 종류도 어찌보면 네이버 블로그보다 다양하다. 블로그 수익화에 상당히 유리한 점이라 할 수 있다.
   • 마크다운(MD)를 지원한다.
   • 하지만 네이버에서의 노출을 원한다면 네이버 블로그에 비해 불리할 수 밖에 없다. 카카오 자회사에서 운영중임에도 다음에서 뜨는 글들을 찾아보면 블로그 글 기준 노출은 토픽 별로 다르다 하더라도 네이버 블로그가 물량때문인지 먼저 뜬다고 봐야한다. 그렇다고 해서 아예 안뜨는건 아니고, 또 구글 검색 기준에선 주제와 컨텐츠에 따라 티스토리도 많이 뜨는 경우도 많다. (코딩 블로그는 네이버에 비해서는 티스토리가 많은편)
   • 자유로운 편집이 가능하다고 해서 완벽히 모든 기능에 대한 접근이 가능하다는건 아니다. 어찌보면 당연하지만 댓글이나 방문추적 기능의 수정, 외부 플러그인 추가등 개인용 다른 블로그 서비스에서 가능할 법한 것들은 안된다. 쉽게 말하면 백엔드 영역에 대해 접근이 제한된다는 말. (하지만 개인적으로는 그정도의 기능까지 건드리면서 블로그에 글쓰기보단 기능 구축에 집중하면 블로그의 본질을 떨어뜨리지 않을까 생각한다. 결국 개인 성향에 따라 부각되는 단점일 수도 있다.)
   • 운영사측과의 소통 창구가 폐쇄적이라는 말이 많다. 정지에 대한 내부 기준이 비교적 모호하고 정지당하면 이의신청 하거나 되살릴 방법은 많이 없다는 평이 꽤 보인다.

3. 벨로그(Velog)

   • 개발자들이 많이 사용하는 블로그로 널리 알려진 국내 블로그 서비스이다. 개인적으로 최근 코딩 이슈로 검색하다보면 한국어 작성글 벨로그에서 많이 보는 것 같다. 운영사에서 내걸은 멘트도 “개발자를 위한 블로그”이니 잘 특성화된 서비스라고 볼 수 있다.
   • 선호하는 사람이 많을 수 있는 미니멀리즘스러운 깔끔한 디자인이 특징이며, MD를 통해 작성이 가능하다.
   • 서비스 자체가 개발자 커뮤니티의 성격을 어느정도 띄어서 개발자 블로그, 포트폴리오 용도로 좋을 수 있다.
   • 다만 개인이 광고 수익을 얻을 수 있는 구조는 아니고 구글 애드센스를 추가하는등 수익화도 불가능하다. 벨로그 측에서 달아놓는 광고로 운영사가 수익을 모두 가져간다.
   • 보다 화려하고 많은 위젯과 UI로 구성된 블로그를 구성하기 힘들다.

4. 깃허브 페이지(GitHub Page)

   • 깃허브의 페이지 호스팅/리디렉션 서비스를 이용해 블로그처럼 활용하는 기능이다. 높은 자유도를 제공하는 많큼 많은 유지보수를 필요로 하는 서비스라 볼 수 있다. 기본적으로는 정적 웹사이트를 추구한다.
   • 꽤나 중요한 점인데, 모든 블로그의 정보에 대한 권한을 가지면서도 무료이다. 다른 상업적으로 제공되는 서비스라면 무료라도 보안때문에 기능에 대한 접근이 제한적이거나, 아니면 접근 권한이 넓은 대신 많은 구현 능력과 노력을 요구할 것이다. 템플릿과 커뮤니티를 통해 얻을 수 있는 퀄리티의 양과 질, 서비스의 안정성을 생각한다면, 모든 장점을 챙기는 것은 꽤나 큰 요소라고 할 수 있다.
   • 개발자의 성지인 깃허브 답게 당연하게도 마크다운을 지원하고, 마크다운이 권장된다. (깃허브 페이지 구축에 보통 쓰이는 Jekyll이 특정한 형식의 md 문서로 포스트를 작성하길 강제한다.)
   • 기본적으로 공개된 템플릿에 더해, 원하고 실력만 된다면 HTML, CSS, JavaScript로 추가적인 기능과 수정을 더할 수 있다. 이미 깃허브에는 많은 플러그인, 프로젝트들이 공개되어 있어, 취향과 실력껏 블로그에 맞게 조합하여 사용할 수 있다.
   • 그래도 모든 권한을 가진다는 것은, 곧 모든 것에 책임을 진다는 말과 같다. 템플릿을 불러오는 것부터, 누군가에게는 힘든 일일 수도 있으며, 기능의 추가와 수정은 AI가 도와준다 해도 코드 파일 수정하려고 에디터 여는 것도 두려운 사람에겐 꽤나 큰 난관일 것이다.
   • 블로그의 핵심이라 할 수 있는 사진과 영상 첨부가 꽤나 불편하다. 기존에는 드래그앤드롭으로 쉽게 첨부했다면, 깃허브는 지원하지 않기에 레포지토리나 클라우드에 올린 후, 링크를 통해 첨부하는 형식으로 가야한다.

5. 워드프레스(WordPress)

   • 전세계에서 가장 많이 쓰이는 오픈소스 블로그 구축 서비스이다. 깃허브 블로그와 유사하지만, 동적 웹사이트를 추구하고, 퀄리티에 비해 많이 제공되는 자유도와 기능, 간편함이 특징이다.
   • 지금 소개하고 있는 어떤 서비스보다 많은 템플릿, 플러그인, 테마, 자유도가 있다. 유저층도 세계적으로 많고 대중적이기에 정보나 자료도 찾아보기 쉽다.
   • 당연한 것이지만 개인 호스팅이라면 깃허브와 마찬가지로 블로그의 정보, 데이터베이스에 대해 접근 권한을 가진다. 쇼핑몰, 회사 사이트등 비즈니스 용도로 들어간다면 이는 꽤나 중요한 영역이다.
   • 다만 양질의 사이트를 구축하는 것 자체는 쉬울지 몰라도, 사이트의 호스팅과 유지보수는 개인의 몫이다. 무료에선 상당히 제한적인 워드프레스닷컴이란 별도의 파생형 호스팅 블로그 서비스가 있고, 무료 도메인을 얻어서 개인적으로 호스팅을 이어나가는게 아니라면 별도의 비용이 지속적으로 발생할 수 있다. 여기서 걸린다면 깃허브 페이지가 차라리 나을 수도 있다.

6. 블로거(Blogger)

   • 구글에서 제공하는 블로그 서비스이다. 블로그스팟(Blogspot)이라고도 불리며, 국제적으로 보면 꽤나 메이저하다고 해야 하겠으나, 한국 내에선 상당히 마이너하다.
   • 무료이고, 구글 계정으로 쉽게 시작할 수 있다.
   • HTML 수정으로 커스터마이징 하는데는 네이버, Velog 같은 제한적인 서비스보단 훨씬 용이한 편이다.
   • 무료에다 구글에서 제공하는 서비스답게 구글 서비스와의 연동은 좋은 편이다. 구글 애드센스, 애널리틱스등 간단한 수익형 블로그에 꽤나 좋을 수 있다.
   • 하지만 헤비한 블로그를 구현하는데는 서비스 자체의 한계 탓에 제한이 있다. 티스토리와 마찬가지로 백엔드까지 건드리는건 불가능하다고 보면 된다. (나름 가벼운 블로그를 추구하는 서비스다.)
   • 한국에서 마이너한 편인 서비스 답게 친화적인 서비스라 할 수는 없다. 네이버등 국내 포탈에서는 검색을 통해 노출되는건 많이 불리한 편이다.

지금 소개한 것들이 사실상 떠오르는 전부인데, 쓰면서 나중에 생각난 것들도 꼽노라면 노션, 텀블러, 브런치, WIX, 경우에 따라서는 개인 서버용 프론트 페이지까지 가지각색의 경우들이 있다. 대학에서 만났던 튜터님중 한분은 집에 홈서버를 이용해 개인 소개 겸 resume에 해당하는 페이지를 만들어 놓으셨고, 교수님들도 그런식으로 연구성과를 정리해놓은 페이지를 해놓으신 경우를 많이 봤다. 결국 어떤 형식으로, 어떤 주제의, 어떤 목적의 블로그를 운영하고자 하냐에 따 많이 갈린다고 할 수 있다. 캐주얼하게 일기나 일상 기록목적에서는 편의성에 좀 더 초점이 맞춰지겠으나, 코딩, 기술, 과학, 분석, 장문의 사설, 광고 대행, 회사 소개글 같은 영역에선 디자인, 편의성, 권한등 영역에 따라 다양한 선택을 할 수 있을것이다. 다만 여러 플렛폼과 서비스를 오갈 생각이라면 자료를 서로 옮기는 것이 꽤나 힘들 수도 있다는 점은 고려해야 하기에, 처음부터 잘 정하는게 좋지 않겠는가?

GitHub 페이지 블로그

깃허브는 프로젝트의 소개, 데모 시현, 블로그 형식의 페이지 구축등 여러 목적의 사이트를 레포지토리와 연결할 수 있는 깃허브 페이지라는 기능을 제공하고, 여기서 해당 페이지를 손쉽게 구축할 수 있도록 jekyll이라는 정적 사이트 구현용 라이브러리를 제작해 배포하고 있다. 깃허브 페이지 블로그는 해당 기능을 이용해 레포지토리를 블로그 형식으로 사용하는 것을 말한다. 계정당 1개에 한해서 무료로 호스팅까지 해주니 꽤나 감지덕지한 기능이다. 개인이 구축할 능력과 시간을 가진게 아니라면 대부분의 선택지는 공개된 테마를 불러와 사용하는 것이며, 이미 꽤나 높은 완성도를 보이고있다. Chirpy와 Minimal Mistake 정도가 블로그 형식에선 제일 많이 쓰이는 것 같지만 내 눈길을 얻은 Hyde이나 Moon같은 미니멀리즘스런 테마도 있다. 기능상으론 Chirpy가 원래 사용하던 네이버 블로그나 티스토리와 유사한 편이나, 테마 자체가 dark, light밖에 제공되지 않는다. 추가적인 것들은 수정이 필요하지만, 그래도 Chirpy를 이용해보기로 했다. 다른 블로그 테마들에 비해 다음 기능들 때문에 고르게 됬다:

• 태그 시스템을 응용한 2단 카테고리 구현 (다른 테마들은 태그를 이용한 분류/검색 정도만 제공하는 것 같았다.)
• 검색, 아카이브 기능 내장
• 사이드바 형식의 메뉴 (다른 테마들은 상단바 형식이 많은 편이였다.)

Chirpy 설치

Chirpy는 인기가 많은 테마여서 이미 많은 설치 가이드 글들이 존재하고, 또 공식으로 나와있는 가이드도 나름 잘 구성되어있다.

• Chirpy 공식 가이드드:https://chirpy.cotes.page/posts/getting-started/
• 하얀눈길님의 Chirpy 테마 사용 가이드: https://www.irgroup.org/posts/jekyll-chirpy/

대략적인 과정만 적노라면 다음과 같다. 다른 테마들도 기본적인 방법은 유사하다:

1. 선택한 레포지토리(Chirpy 혹은 Chirpy-Starter)를 ‘username.github.io’ 라는 이름으로 포크해온다. username 위치에는 자신의 이름이 들어가야 한다.
2. config.yml 파일에서 기초적인 정보(이름, 설명, 아바타 사진, 언어, 이메일 등등)을 수정한다.
3. Commit되면 페이지가 빌드된 후 자동으로 호스팅되어, ‘https://username.github.io’를 통해 접속해볼 수 있다.
4. 글은 _post 폴더에 jekyll 포스트 헤더 형식만 맞추어 마크다운 파일(.md)로 작성한다.

Chirpy 트러블슈팅

이 흐름대로 쉽게 해결이 되었으면 좋았겠으나, 꽤나 길게 헤매게되었다.

1. Chirpy-Starter를 처음에 사용해보니 포크해와 config.yml만 수정해주니 바로 사용할 수 있었다.
   • 하지만 추후에 기능 추가를 위해 수정하고자 하는 파일이 Starter에서는 포함되지 않는 구조였다.
   • 삭제한 후 원본의 Chirpy 레포지토리를 가져왔다.
2. Chirpy 원본 레포지토리의 경우 로컬 환경에서는 Jekyll 서버를 구동해 로컬 주소로 접속해볼 수 있었다.
   • 온라인 환경에서는 포크해온다고 바로 사이트를 정상적으로 빌드할 수 없었다. 호스팅된 블로그 링크로 들어가면 한줄 가량의 텍스트만 하얀 화면 위에 떠있었다. Actions에서는 Build후 Deploy가 이뤄지지 않고있었다.
   • Chirpy-Starter와 비교해보니 .github/workflows 폴더 안에 pages-deploy.yml 파일이 빠져있었다. .github/workflows/starter에 있던 것을 위치에 맞게 옮겨주었다.

3. 이번엔 빌드에서 에러가 나왔다.

   Error: Can't find stylesheet to import. | 1 | @use 'vendors/bootstrap'; | ^^^^^^^^^^^^^^^^^^^^^^^^ |

   • 로컬에서는 빌드도, 페이지 보이는 것도 정상이였지만, 깃허브에서만 빌드가 문제가 있었다.
   • 로컬에서 실행할 때는 npm을 요구하고 있어서 개별적으로 설치했었던 것에 반해, pages-deploy.yml 파일에는 npm을 설정하는 스탭이 빠져있었다.
4. pages-deploy.yml에 node.js 빌드 과정을 추가했다. ```
   • name: Setup Node.js uses: actions/setup-node@v4 with: node-version: ‘lts/*’

• name: Build assets run: npm install && npm run build ```

여기까지 오니 드디어 해결됬다. 깃허브에 올라가 웹 상에서 빌드될때는 백지상태에서 빌드되기 시작하는걸 몰랐던 것이다. 웹개발은 따로 배워본 적이 없어서 이것저것 많이 검색해보면서 배우기까지 오래 걸렸다.