WordPress 훅과 GraphQL 디렉티브의 유사점

WordPress 애플리케이션은 플러그인과 훅（액션과 필터）을 활용하여 높은 확장성을 가집니다. 훅은 WordPress 코어, 테마, 플러그인 코드의 동작을 변경하기 위한 것입니다. 훅은 간단한 코드 조각으로, 트리거될 때마다 값을 재정의하거나 액션을 실행할 수 있습니다.

다음 예시에서는 필터 block_categories를 사용하여 WordPress 편집기에서 활성화된 블록 카테고리를 변경하고 있습니다.

\add_filter(
  'block_categories',
  function(array $categories): array
  {
    return [
      ...$categories,
      [
        'slug' => 'graphql-api-access-control',
        'title' => __('Access Control for GraphQL', 'graphql-api'),
      ],
    ];
  }
);

훅은 단순하고 범용적이며 강력합니다. 잘못 사용될 수도 있지만, 올바르게 구현하면 개발자가 미리 계획하지 않은 방식으로도 애플리케이션을 크게 확장할 수 있습니다.

GraphQL 디렉티브를 훅으로 활용하기

디렉티브는 WordPress에서 훅이 하는 역할과 동등한 GraphQL의 개념으로 볼 수 있습니다.

WordPress 훅과 마찬가지로, 디렉티브는 필드의 값을 변경하여 다른 기능을 확장하는 함수입니다. 그 대응 개념과 마찬가지로 단순하고 범용적이며 강력합니다.

예를 들어, 다음 쿼리로 게시물 제목 목록을 가져온다고 가정해 보겠습니다.

query {
  posts {
    title
  }
}

이 결과는 영어로 되어 있습니다. 프랑스어로 번역하려면 어떻게 해야 할까요? 필드 title에 디렉티브 @strTranslate를 적용하면 됩니다. 이 디렉티브는 필드의 값을 입력으로 받아 Google Translate API를 호출하여 번역하고, 그 결과를 반환합니다. 다음 쿼리를 참조하세요.

query {
  posts {
    title @strTranslate(from: "en", to: "fr")
  }
}

확장성의 활용 사례는 명확합니다. 필드 title의 값이 주어지면, 디렉티브를 통해 원하는 방식으로 변경할 수 있습니다. 이 예시에서는 @strTranslate를 통한 프랑스어 번역이지만, @strUpperCase나 @strLowerCase를 통한 대소문자 변환 등 다른 변환도 가능합니다.

​GraphQL 디렉티브를 훅으로 활용하기

GraphQL 디렉티브를 훅으로 활용하기