Gatsby 블로그를 인터넷에서 서비스하기 위한 호스팅 환경이 필요하다.
블로그로 글을 써보려다가 너무 멀리 온 것은 아닌가하는 생각이 든다.
그러나 장기적으로 롱런하는 블로그를 운영하기 위한 큰 그림이라 생각하고 계속 글을 이어본다.
유념해야하는 것은 이 내용들을 실행하기 전에 다음과 같은 각오를 다져야 한다.
최소한의 연간 투자, 블로그 글 쓰기 대한 자신감과 생산성, 애드센스 수익화, 약간의 번거로움에 대한 인내심에 자신 있다면 계속 읽어나가 보자.
더이상 기술적인 부분에 대해서 따라갈 수 없다면, 별도로 메시지를 달라. 어려움을 겪는 이들을 위해 큰 플랜을 하나 준비하고 소개해 보겠다.
자 그럼, 본격적으로 더 파고 들어가보자. Netlify 는 무엇을 하는 서비스인가?
Netlify 살펴보기
개발씬을 한동안 떠나 있었더니 많은 플랫폼들이 생겨나 있었다. Gatsby 를 통해 블로그를 만들다 보니 Netlify 에서 올려야 된다고 자꾸 검색되었다.
Gatsby 사이트에서는 이 분들하고 통합되었다고 좋다고 광고하고 있었다. 먼저, 사이트의 한줄 소개 문구를 보자
Instantly build and deploy your sites to our global network from Git. Custom domains, https, deploy previews, rollbacks and much more.
좋은 말이다.
대충 해석해보면 Git에서 끌어와서 웹서비스 해주고, 형상 관리해서 이전 버전으로도 가게 해주고 그렇다고 한다.
커스텀 도메인도 달 수 있다고 한다. 그런가? 그러면 비용은? 좀 살펴보니 무료 버전부터 시작한다. 어디까지 무료인가?
100GB bandwidth and 300 build minutes
월에 100GB만큼 쓸 수 있다면 괜찮은 양이다.
블로그 빌드업을 할 때에 워드프레스를 접근하게 되는데 카페24의 저가 워드프레스를 사용하더라도 한달에 하루 800MB 트래픽이다.
하루 제약이 800MB 트래픽이다. 한달로 봐도 24GB. 물론 한달에 3만원씩 주고 비싼 플랜으로 갈수도 있다.
이에 비하면 Netlify 의 100GB 트래픽은 혜자인 것이다.
카페24의 한달 5500월 서비스가 하루 6G 트래픽, 월 180GB 수준으로 유사한 수준이다. (검색 버프가 걸릴 때에 하루 6G 이상 안되면 손해이긴 하다.)
카페24 워드프레스로 조금 테스트를 해보니 뭐 조금만 해도 트래픽이 쭉쭉 빠진다.
한달 100GB를 초과하는 트래픽에 도달 하면? 이 때에는 수익이 발생할 것이다. Netlify 다음 단계가 한달 1TB, 2.5만원 정도이니 투자하면 된다.
티스토리나 블로거는 이런 제한이 없기 때문에 고민이 없었지만 자체 블로그 테크를 가져가려면 비용이 발생한다.
자칫 이런 비용이 호스팅 업체만 배불리는 현실을 만들 수도 있어서 매우 고민되는 상황이다.
가능하면 무료로 접근할 수 있는 플랫폼들을 통해 시작하면서 수익화에 대한 가능성을 확신할 때에 추가 투자를 하는 것이 합리적이라고 본다.
필자가 국내에서 많이 접근하는 카페24 워크프레스 블로그를 사용하기보다 Gatsby와 Netlify를 고려한 이유도 이런 부분이 있다.
물론 향후에 콘텐츠가 많아지면 투자를 통해 호스팅 서비스를 사용해야하는 상황이 올 지도 모르겠다.
이런 상황을 대비하여 애드센스 고시를 위한 도메인 만큼은 꼭 하나 구매해서 준비해두면 좋겠다.
Netlify 설정하기
본론으로 돌아와서 Netlify를 세팅해 보자
https://www.netlify.com/
사이트로 이동해 보자. 로그인을 위해 가입을 해야한다. 앞서 생성한 github 계정을 이용하자.
github 에서 소스코드를 끌어와야하니 이렇게 하는 것이 최선이다.
로그인하고 메인 화면의 메뉴로 가면 Sites 항목이 있다. 여기서 새로운 사이트를 만들 수 있다.
“Imort an existing project” 을 선택하고 “Deploy with Github” 를 선택하고 설치를 진행한다.
몇가지 설정값이 나오는데 자신의 Github 레포지토리를 선택하고 아래 기본값들은 그냥 사용하면 된다.
- Branch to deploy -> master
- Build command -> npm run build
- Publish directory -> public
크게 변경할 일이 없을 것이다.
전체적인 과정을 진행하게 되면 Netlify 가 신통방통하게 설정한 Github의 레포지토리에서 소스코드를 끌어온다.
그리고 빌드를 진행하면서 [유니크한 문자열].netlify.app 로 구성된 사이트를 생성한다.
여기서 [유니크한 문자열]에 해당하는 내용은 “Edit site name” 기능으로 수정할 수 있다. 예를 들면 다음과 같다.
https://kindjm.netlify.app
글을 정리하면서…
여기까지 설명한 내용은 사실 팩트를 확인하며 만들기 위해 동분서주한 시간들에 비하면 매우 짧게 진행된 것 같다.
왠지 삽질을 많이 했었다는 느낌을 지울 수가 없다. ㅠㅠ
혹시라도 글을 참고하여 설정하다가 중간에 안되거나 하는 부분들이 나타날 수 있다.
앞서 얘기했지만 기억을 더듬어 순서대로 정리하고 있기 때문에 일부 디테일이 빠져 있을 수 있다.
다행히 블로그에 댓글 기능을 달아두었기 때문에 궁금하신 부분이 있다면 성심껏 댓글을 달아보겠다. ㅎ
이제 여러분만의 정적 블로그 사이트가 준비되었다.
이제부터는 순정 블로그를 튜닝할 시간이다. 그냥 쓰기에는 역시 입맛에 맞지 않는 부분이 있다.
여러가지가 있지만 그중에서도 앞으로 설명할 마크다운 편집기가 참 고민거리이다.
이것 때문에 Gatsby 는 생산성이 떨어진다는 생각을 지울 수 없었지만 불굴의 의지로 최소한의 생산성에 접근했다. 이건 뒤에 설명하겠다.
아 참, 그리고 Netlify 는 자동 배포를 지향한다.
이게 무슨 말인가 하면 여러분이 앞에 작업 했던 Github 의 소스코드가 변경되면 이를 자동으로 탐지하여 소스코드를 끌어와 사이트를 새롭게 배포한다.
이런 자동화는 편리함도 있지만 배포시간으로 비용을 설정하는 시스템이기 때문에 관리요소도 필요하게 된다.
이후 설명하는 내용을 통해 더 이해를 돕도록 하겠다.