GatsbyJS + Netlify에서 예약 게시물 같은 것을하십시오

GatsbyJS + Netlify에서 예약 게시물 같은 것을한다.
정해진 시간에 제대로 투고시키는 것은 어렵기 때문에 매시간 단위로 실현시켰다.
마크다운에서 게시한 기사가 대상입니다.

개요는 다음 👇

TL;DR

gatsby-plugin-draft을 사용하여 frontmatter의 date를 현재 시간과 비교하여 현재 시간 이전의 기사 만 빌드하십시오.

Netlify 빌드 후크 (Webhook) 발행

IFTTT로 매시간 Build hooks를 두드려 빌드를 달리기

gatsby-plugin-draft

gatsby-plugin-draft 라는 고마운 플러그인으로 frontmatter 의 시각과 현재 시각을 비교해 빌드를 제어할 수 있습니다.

npm 또는 yarn으로 패키지를 설치하고 gatsby-config.js 및 gatsby-node.js 에 설정을 추가합니다.

gatsby-config.js

    {
      resolve: 'gatsby-plugin-draft',
      options: {
        timezone: 'Asia/Tokyo',
      },
    },

gatsby-node.js

  return graphql(`
    {
      allMarkdownRemark(
        limit: 1000
        filter: { fields: { draft: { eq: false } } }
      ) {
# ~以下略~

그리고는 마크다운의 date 에 일시를 쓸 뿐.

post.md

---
id: 2
title: Second Post
date: 2019-12-31T12:00:00+09:00
---

Draft content.

포인트로서는, +09:00 (을)를 써 일본 시간의 타임 존으로 지정하는 것.
빌드했을 때의 시간은 UTC±00:00에서 봐 버린 것 같다.
이것은 Netlify CMS에서는 지정할 수 없기 때문에 Netlify CMS로 시간까지 설정하고 싶은 경우는 마이너스 9시간을 계산해 설정할 필요가 있다.
Netlify CMS는 Build & deploy > Environment variables 의 설정으로 환경 변수를 설정하면 md의 쓰기를 자동으로 -9시간 해 주었습니다.

Key: TZ
Value: Asia/Tokyo
그리고 설정.

덧붙여서 date: 2019-12-31 같이 시간 없이도 지정할 수 있다.
이 경우는 타임 존의 관계로 일본에서는 아침 9시에 빌드→공개되게 된다.

Gatsby의 설정은 할 수 있었으므로, 후에는 Netlify의 빌드를 매시에 돌려, 예약 투고같은 것을 실현한다.

Netlify Build hooks

Netlify에서 빌드 후크를 게시합니다.

사이트 관리 화면에서,
Settings > Build & deploy > Continuous Deployment로 이동하여
빌드 후크에서 Add build hook를 선택합니다.

이름과 분기를 설정합니다.

https://api.netlify.com/build_hooks/********라는 Webhook URL이 발행됩니다.

IFTTT

발행한 URL을 IFTTT로 매시 두드린다.
리뉴얼하고 신규 레시피 작성이 전혀 어딘지 모르게 되어 헤매었지만, 오른쪽 상단의 아이콘으로부터 create 를 선택.

This

This 는 date & time , 트리거는 Every hour at 를 선택.

Minutes past the hour 로 몇 분에 빌드할지 설정한다.
「:00, :15, :30, :45」에서 선택할 수 있지만 일단 「00」에.
이제 매시간 00분에 Then을 실행한다.

Then

Then은 Webhooks , 트리거는 Receive a web request 를 선택.
`


URL에 Netlify에서 발행한 URL을 copipe.
Method는 POST, Content Type은 application/x-www-form-urlencoded를 선택.



나머지는 Create action 버튼을 눌러 레시피 이름을 결정하고 Finish

완성

Netlify 관리 화면의 Deploys에서 확인하면 매시간 빌드되어 있는 것을 알 수 있다.
빌드 시간이 있으므로 지정한 날짜와 시간부터 플러스 몇 분 안에 공개됩니다.



이번에는 IFTTT를 사용했지만 CI나 Zapier에서도 가능하다.
다만 Zapier는 무료 플랜에서는 100 태스크/월이므로, 매시 빌드에는 Starter 플랜 이상이 필요하게 된다.