Is It Keto: Month 12

Michael Lynch

Keto인가: 12개월 차

한 줄 요약

월 방문자 5만 명의 가치를 내가 너무 낮게 평가하고 있다.

주요 내용

  • Is It Keto에 프로그램으로 생성한 새 글 88개를 추가했습니다.
  • 월간 페이지뷰가 10만 회에 이른 만큼, 이제 Is It Keto의 독자층과 협업할 새로운 방법을 모색할 때가 됐습니다.
  • 하드웨어 비용 100달러 미만으로 제작할 수 있는 IP 기반 KVM 장치를 만들었습니다.

목표 달성도

매달 초에 그달에 이루고 싶은 목표를 정합니다. 그 목표를 얼마나 달성했는지 정리하면 다음과 같습니다.

Is It Keto에 새 글 100개 추가하기

  • 결과: Is It Keto에 새 글 88개 추가
  • 평가: B

콘텐츠를 프로그램으로 생성하는 일은 예상보다 어렵습니다. 점수와 영양 데이터를 생성하는 건 쉽지만, 다양한 제품에 적용할 수 있는 많은 양의 문장을 템플릿화하는 건 어렵습니다.

앞으로도 템플릿을 계속 만들고 새로운 식품을 추가할 예정이지만, 사이트 수익을 늘릴 다른 방법도 찾아보겠습니다.

새 블로그 글 하나 올리기

어떤 형태로든 지난 2년 동안 작업해 온 글이라, 드디어 게시하게 되어 기쁩니다. 결과물에도 만족하고, 이 글이 다른 사람들의 디지털화 프로젝트에 유용한 아이디어를 줬다는 이야기를 들을 수 있어 좋았습니다.

이 글은 Reddit에서 좋은 반응을 얻었지만, Hacker News에서는 주목받지 못했습니다. 그래도 Hacker News에서 반응을 얻을 가능성은 있다고 생각하므로 일주일쯤 뒤에 다시 시도해 보겠습니다.

통계

Is It Keto

지표2020년 4월2020년 5월변화
순 방문자 수35,45150,352+14,901 (+42%)
총 페이지뷰72,89499,391+26,497 (+36%)
도메인 레이팅(Ahrefs)27.027.00
AdSense 수익$92.09$109.92+$17.83 (+19%)
Amazon 제휴 수익$128.39$111.61-$16.78 (-13%)
총수익$220.48$221.53+$1.05 (+0%)

Is It Keto의 방문자 수는 계속 증가했습니다. 코로나19 이전의 평소 수준으로 회복한 것 같습니다. 걱정스러운 점은 AdSense 수익이 방문자 증가를 따라가지 못했고, Amazon 제휴 수익은 오히려 줄었다는 것입니다.

통계를 자세히 살펴보니 Is It Keto가 5월에 Amazon을 위해 창출한 수익은 4월보다 25% 많았습니다. 하지만 Amazon이 제휴 프로그램의 지급률을 대폭 삭감하면서 Is It Keto의 수익이 크게 줄었습니다.

Is It Keto의 독자층으로 더 많은 일 하기

몇 주 전, Justin Vincent이 연락해 왔습니다. 그는 연쇄 창업가이자 The Nugget Startup Academy의 창립자입니다. 제 블로그를 재미있게 읽고 있다며, Is It Keto의 수익화 아이디어를 함께 떠올려 보는 Zoom 통화를 해도 괜찮겠냐고 물었습니다. 저는 응했고, 그 대화에서 사업에 관한 유용한 통찰을 여러 가지 얻었습니다.

처음으로 놀란 점은 Justin이 Is It Keto의 방문자 통계를 매우 높게 평가한다는 사실이었습니다.

Justin: 일주일에 순 방문자가 몇 명이나 와요?

: 1만 명 정도요.

Justin: 와. 황금알을 낳는 거위를 갖고 있네요.

상위권 케토 레시피 블로그는 월 순 방문자가 약 300만 명에 달하니, 제 사이트의 4만~5만 명은 아무것도 아닌 것처럼 느껴졌습니다. Justin은 제품을 출시할 때 가장 어려운 일 중 하나가 관심 있는 고객을 찾는 것이라고 했습니다. 그런데 제가 매주 케토에 관심 있는 1만 명에게 접근할 수 있다면, 이미 엄청난 출발점에 서 있는 셈이라는 겁니다.

Justin: 기존 케토 커뮤니티를 보면 사람들이 어떤 문제로 어려움을 겪고 있나요? 자주 등장하는 고민은 뭐죠?

: 잘 모르겠어요. 대부분 사람들이 자신의 진행 상황을 공유하고 다른 회원들이 축하해 주는 내용인 것 같아요.

Justin: 서로 축하해 준다… 흥미롭네요. wip.chat을 본 적 있어요?

인디 소프트웨어 개발자를 위한 인기 소셜 네트워크 wip.chat의 스크린샷

wip.chat, 인디 소프트웨어 개발자를 위한 인기 소셜 네트워크

wip.chat은 인디 개발자 사이에서 인기 있는 소셜 네트워크입니다. 비회원도 일부 콘텐츠를 볼 수 있지만, 글을 올리려면 회원이어야 하고 월 20달러를 내야 합니다. wip.chat 커뮤니티가 프로젝트의 마일스톤을 지키도록 압박해 제품 개발을 도와준다는 것이 이 서비스의 홍보 문구입니다.

케토를 위한 wip.chat을 만들자는 이야기를 나눌수록 아이디어가 마음에 들었습니다. 제가 본 케토 관련 소셜 네트워크는 모두 Facebook 그룹, 서브레딧, Discord 채널 같은 범용 도구를 사용합니다. 케토 다이어터를 위해 특별히 만들어진 도구가 있다면 어떨까요? 그다음 일주일 동안 25가지 아이디어를 더 떠올렸지만, wip.chat의 복제 서비스가 여전히 목록 맨 위에 있었습니다.

이번 주에는 이론상으로만 존재하는 케토 소셜 네트워크의 랜딩 페이지를 만들고 Is It Keto에 광고할 예정입니다. 가입 버튼도 넣을 겁니다. 하지만 사용자가 결제를 시도하면 이런 메시지를 보게 됩니다. “아직 사이트를 만드는 중이지만, 완성될 때 알림을 받고 싶다면 이 메일링 리스트에 가입할 수 있습니다.”

그 대화에서 얻은 또 하나의 훌륭한 통찰은 파트너십에 관한 것이었습니다.

Justin: 멤버십 제품을 만들고 나면 다른 케토 사업자들과 직접 파트너십을 맺고 제휴 계약을 체결할 수 있어요.

: 하지만 이미 방문자가 있잖아요. 지금 당장 그렇게 하지 않을 이유가 뭐죠?

Justin: 좋은 질문이네요. 지금 당장 그렇게 하지 않을 이유가 뭐죠?

이래서 외부인의 관점이 가치 있습니다. Is It Keto를 시작한 초기에 다른 케토 업체들에 제휴 계약을 제안해 본 적이 있지만, 당시에는 제가 너무 규모가 작아서 대부분 무시했습니다. 이제 월간 페이지뷰가 10만 회에 이르렀으니 Is It Keto는 파트너십을 추진할 만한 규모가 됐습니다. 오랫동안 실행할 수 없는 일이라고 생각해 왔던 탓에 그 아이디어를 다시 검토하는 걸 깜빡하고 있었던 겁니다. 그런데 AdSense를 통해 제 사이트에 광고하는 케토 업체에 연락해서 직접 계약을 맺고 싶은지 물어보지 못할 이유가 있을까요?

wip.chat의 스크린샷

Google AdSense를 거치지 않고 이 광고주와 직접 계약을 맺을 수도 있겠습니다.

Is It Keto의 브라우저 성능 개선

Is It Keto를 운영한 대부분의 기간 동안 성능은 뒷전이었습니다. 눈에 띄는 속도 저하를 일으키는 구성 요소를 가끔 수정하긴 했지만, 속도를 고려해 설계하는 경우는 거의 없었습니다.

사이트 방문자의 90%를 Google이 유입시키고, Google이 검색 결과 순위를 매길 때 성능을 지표로 사용하기 때문에, 며칠 동안 Is It Keto의 병목 지점을 찾아봤습니다. Is It Keto의 콘텐츠를 생성할 때 Gridsome 프레임워크를 사용하고 있어서, 이 글을 참고해 성능을 조금 개선할 수 있었습니다.

변경 사항성능 영향
Bootstrap-Vue와 Bootstrap-Vue-Icons를 모두 가져오는 대신 Bootstrap-Vue 구성 요소를 필요한 것만 선택해 로드높음
정적 JSON 파일의 크기를 줄이기 위해 Gridsome 데이터를 Vue 계층이 아니라 GraphQL 계층에서 필터링높음
동적 경로를 사용해 Gridsome에서 이미지를 로드하기 위한 해킹을 되돌림중간
Google Fonts를 CSS의 @import 대신 <link rel> 태그로 가져옴낮음
필요한 글꼴만 내려받도록 Google Fonts URL을 조정함낮음
HTML <head>에 Google Fonts를 위한 preconnectdns-prefetch를 추가낮음
“보이지 않는 텍스트가 나타나는 현상”을 막기 위해 Google Fonts 가져오기 URL에 ?display=swap 추가낮음

JavaScript 번들에서 큰 구성 요소를 찾을 때 webpack-bundle-analyzer를 사용하라는 이야기는 모두가 합니다. 그런데 실제로 어떻게 사용하는지 설명한 자료를 찾지 못해서 제가 이상한 사람이라도 된 줄 알았습니다. 설명은 대부분 다음과 같습니다.

  1. npm install webpack-bundle-analyzer
  2. ???
  3. 브라우저에서 유용한 시각화 결과를 확인한다.

하지만 시각화 결과를 어떻게 생성하는지는 아무도 설명하지 않습니다. 결국 2단계에서 빠진 내용은 webpack-bundle-analyzer를 빌드 과정에 연결하는 것이라는 사실을 알아냈습니다. 스택에 따라 방법은 다르지만, Gridsome에서는 여기에 설명된 방식으로 할 수 있습니다. 그러면 다음에 앱을 빌드할 때 이런 줄이 표시됩니다.

Webpack Bundle Analyzer saved report to /home/user/isitketo/dist/report.html

이제 report.html을 열면 모두가 이야기하던 시각화 결과를 볼 수 있습니다.

웹 성능은 생각보다 어렵다

Is It Keto는 원래 Python 2를 사용하는 App Engine에서 실행되었습니다. 사이트에 다시 집중하기로 한 데다 Google이 Python 2 지원을 종료할 계획이었기 때문에, 4월에 사이트를 다시 작성하기로 했습니다. Vue 기반 정적 사이트 생성기인 Gridsome을 선택했습니다.

미리 렌더링된 웹사이트의 성능과 Vue의 유연한 개발 경험, 두 가지 장점을 모두 얻을 수 있을 것 같았습니다. 그런데 웹 성능은 제가 생각했던 것보다 조금 더 복잡했습니다.

저는 브라우저가 미리 생성된 HTML을 전부 렌더링한 다음 JavaScript를 백그라운드에서 실행할 거라고 생각했습니다. 하지만 실제로 브라우저는 무엇보다 먼저 JavaScript를 실행하려고 합니다. Is It Keto에서는 <script> 태그를 HTML 맨 아래에 배치했고 defer 속성도 지정했는데, 그래도 성능 지표를 크게 떨어뜨립니다.

스크립트를 활성화했을 때 Lighthouse 점수 47
스크립트를 삭제했을 때 Lighthouse 점수 87

Is It Keto에서 <script> 태그를 삭제하면 Lighthouse 점수가 40점이나 오릅니다. 하지만 그러면 사이트가 작동하지 않습니다.

몇 달 뒤 출시될 예정인 Vue 3는 트리 셰이킹 덕분에 성능이 개선될 것으로 보입니다. 사용하지 않는 프레임워크 코드를 제거해 JavaScript 페이로드의 크기를 줄일 수 있다는 뜻입니다. Gridsome은 1.0 릴리스가 Vue 3와 호환될 것이라고 밝혔지만, 개발 인력이 너무 부족해 보여서 실제로 그렇게 되기까지 몇 년이 걸릴까 봐 걱정됩니다.

가상 키보드와 모니터로 사용하는 Raspberry Pi

지난 몇 주 동안 취미 프로젝트를 하나 진행했습니다. 사업으로 이어질 것 같지는 않지만, 어쩌면 시장이 있을지도 모르겠습니다.

제가 현재 사용하는 서버는 헤드리스라서 키보드나 모니터가 연결되어 있지 않습니다. SSH로만 접속해 사용합니다. 문제는 운영체제가 로드되지 않거나 BIOS 설정을 바꾸고 싶을 때입니다. 서버에 접근하려면 서버 전체를 책상까지 끌고 와서 데스크톱 모니터와 키보드를 연결해야 하니 난감합니다.

다음 서버에는 일종의 가상 콘솔을 달고 싶다는 생각을 오래전부터 했습니다. Dell의 iDRACHP의 iLO 같은 엔터프라이즈 솔루션도 있지만, 서버 가격에 수백 달러를 더합니다. IP 기반 KVM 장치도 있지만 가격이 400달러 이상이고 덩치 큰 클라이언트 소프트웨어가 필요합니다.

지난 몇 주 동안 Raspberry Pi 4로 가난한 사람을 위한 원격 콘솔을 만들어 보았습니다. 네트워크를 통한 키보드 기능은 아주 잘 작동합니다.

Raspberry Pi를 브라우저로 제어하는 키보드로 작동하게 만들었습니다.

대상 컴퓨터의 영상을 표시하는 건 더 까다롭지만, 이제 약 1초의 지연으로 작동합니다. 다음과 같은 모습입니다.

Raspberry Pi를 브라우저로 제어하는 키보드로 작동하게 만들었습니다.

현재 영상은 별도의 창에 표시되지만, 웹페이지에 직접 삽입하는 작업을 진행 중입니다.

자세한 내용을 설명하는 블로그 글을 작성하고 있습니다. 소스 코드가 궁금하다면 아직 문서화가 완전히 끝나지는 않았지만 공개되어 있습니다.

  • key-mime-pi: 키 입력을 Raspberry Pi의 가상 키보드 장치로 전달하는 웹 서버입니다.
  • ansible-role-key-mime-pi: Pi의 USB 가젯 기능을 설정해 키보드를 흉내 내도록 하고, 웹 서버를 systemd 서비스로 설치하는 Ansible 역할입니다.

약 180달러에 사전 구성된 키트를 판매하는 방안을 고려하고 있습니다. 구매에 관심이 있다면 다음 사이트를 방문해 주세요.

기존 프로젝트

아직 유지 관리하고 있지만 개발의 주된 초점은 아닌 프로젝트들의 간단한 소식을 전합니다.

Zestful

지표2020년 4월2020년 5월변화
순 방문자 수1,142467-675 (-59%)
총 페이지뷰2,9601,258-1,702 (-57%)
RapidAPI 수익$32.19$6.48-$25.71 (-80%)
총수익$32.19$6.48-$25.71 (-80%)

무슨 이유에서인지 Zestful에 5월 들어 갑자기 관심이 몰렸습니다. 고객 세 명이 엔터프라이즈 요금을 문의했습니다. 그중 두 명은 가능성이 없어 보이지만, 세 번째 고객에게는 잘 맞는 제안을 할 수 있을지도 모르겠습니다. 이번 주가 끝날 때쯤이면 어떻게 될지 알 수 있을 것 같습니다.

마무리

무엇을 해냈나?

배운 점

  • 미리 렌더링된 Vue 사이트도 여전히 상당한 성능 저하를 감수해야 합니다.
  • 새로운 사람에게 사업 이야기를 들려주면 자신의 가정을 다시 점검하게 됩니다.

다음 달 목표

  • Is It Keto의 자매 제품 아이디어를 검증합니다.
  • Is It Keto에 새 글 30개를 추가합니다.
  • 웹 브라우저로 제어할 수 있는, Raspberry Pi 기반의 작동하는 IP 기반 KVM을 만듭니다.

원문은 Michael Lynch님이 에 게재했습니다.

이 글은 gpt-5.6-terra 모델을 사용해 번역했습니다.