Airtable 데이터를 GatsbyJS로 확장하여Graph QL 모드로 처리할 수 있도록 합니다

GraphiQL을 사용하면 에어테이블을 간단하게 처리할 수 있을 것 같지만GatsbyJS를 사용하면 간단하게 완성할 수 있을 것 같습니다.
gatsby-source-airtable 사용
편리한 플러그인인gatsby-source-airtable이 있기 때문에 설치합니다.

yarn add -D gatsby-source-airtable gatsby-source-filesystem

gatsby-source-file system에 가입하지 않으면 욕을 먹을 수 있으니 넣으세요.
플러그인 상세 정보: https://www.gatsbyjs.com/plugins/gatsby-source-airtable/?=airtable
성과물
일단 성과물부터.다음은 두 워크시트의 스트레칭을 지정하는 옵션입니다.
gatsby-config.js

plugins: [
// 省略
    {
      resolve: `gatsby-source-airtable`,
      options: {
        apiKey: process.env.AIRTABLE_API_KEY,  
        concurrency: 5, 
        tables: [
          {
            baseId: process.env.AIRTABLE_SHEET_ID, // テーブル専用ドキュメントページのURLの一部がID名となっている
            tableName: `TestData`, // 対象のシート名
            queryName: `TestGraph`, // 複数のシートを引っ張るかつキーが被るなら欲しい
            separateNodeType: true, 
          },
          {
            baseId: process.env.AIRTABLE_SHEET_ID,
            tableName: `HogeData`,
            queryName: `HogeGraph`,
            separateNodeType: true, 
          }
        ]
      }
    }
// 省略
]

위에서 설명한 대로 플러그인 옵션을 설정하면 Airtable 모드가 생성됩니다.

최소 구성
gatsby-config.js

plugins: [
// 省略
    {
      resolve: `gatsby-source-airtable`,
      options: {
        apiKey: process.env.AIRTABLE_API_KEY,  
        concurrency: 5, 
        tables: [
          {
            baseId: process.env.AIRTABLE_SHEET_ID, // テーブル専用ドキュメントページのURLの一部がID名となっている
            tableName: `TestData`, // 対象のシート名
          }
        ]
      }
    }
// 省略
]

이것만으로도 당길 수 있다.
올에어테이블, 에어테이블은 그래픽QL에서 생성되기 때문에 확인할 수 있습니다.만약 할 수 없다면 설정 오류 등을 고려할 수 있다.

          {
            baseId: process.env.AIRTABLE_SHEET_ID,
            tableName: `TestData`,
            queryName: `TestGraph`, // +追加
            separateNodeType: true,  // +追加
          },

나는 여기에 옵션을 추가했다.
queryName은GraphiQL에서 edges/node/queryName 디렉터리에 설정된 이름을 드래그합니다.여러 테이블이 혼합된 경우queryName에서 분리해서 가져오는 옵션입니다.
separateNodeType은 "airtableAll 임의의 이름(query Name이 지정한 문자)"으로 모드를 생성합니다.
만약 각 표 이름 사이에서 데이터를 완전히 분리하여 처리한다면 함께 사용하면 매우 편리할 것이다.