wp-block-development

wp-block-development 스킬 개요

wp-block-development이 하는 일

wp-block-development는 WordPress Gutenberg 블록을 만들고 수정할 때 쓰는 실용적인 스킬로, 특히 문제의 원인이 block.json, 블록 등록, 저장된 마크업, 빌드 도구에 있을 때 강합니다. wp-block-development 스킬은 API 표면만 이해하는 사람이 아니라, 블록을 안전하게 배포해야 하는 사람에게 가장 잘 맞습니다.

가장 잘 맞는 사용 사례

새 블록을 만들 때, 기존 블록을 업데이트할 때, invalid block을 진단할 때, 또는 블록을 dynamic rendering 쪽으로 옮길 때 이 wp-block-development 가이드를 사용하세요. viewScript, viewScriptModule, supports, wrapper 출력, 프런트엔드/에디터 일치성에 걸린 Frontend Development 작업에도 유용합니다.

무엇이 다른가

이 스킬은 의사결정 중심입니다. 적절한 블록 패턴을 고르게 하고, 문제가 배포되기 전에 breaking change를 찾아내며, 취약한 attribute source나 누락된 deprecation path 같은 흔한 WordPress 함정을 피하도록 돕습니다. wp-block-development 스킬의 핵심 가치는 registration, serialization, compatibility에 대한 추측을 줄여준다는 점입니다.

wp-block-development 스킬 사용 방법

올바르게 설치하고 범위를 잡기

npx skills add WordPress/agent-skills --skill wp-block-development로 wp-block-development 스킬을 설치하세요. 그다음 프롬프트를 넣기 전에 작업 범위를 분명히 정하세요. repo 루트, block namespace, 알고 있다면 block 경로, 그리고 WordPress 버전 범위를 함께 알려주세요. apiVersion, modules, server rendering 지원 여부에 따라 wp-block-development의 동작이 달라지기 때문에 이런 맥락이 중요합니다.

먼저 맞는 파일부터 보기

가장 먼저 SKILL.md를 읽고, 작업과 가장 관련 있는 reference 파일을 확인하세요: references/block-json.md, references/attributes-and-serialization.md, references/creating-new-blocks.md, references/dynamic-rendering.md, references/deprecations.md, references/debugging.md. 블록을 빠르게 찾아야 한다면, 추측하지 말고 scripts/list_blocks.mjs를 사용해 block.json 루트를 찾으세요.

실행 가능한 프롬프트를 만들기

좋은 wp-block-development 사용 프롬프트는 목표, 현재 실패 지점, 제약 조건을 함께 담습니다. 예를 들어: “my-plugin/blocks/cta에서 저장 후에도 버튼 아이콘이 유지되게 하고, 기존 글은 유효한 상태로 남겨두며, WordPress 6.9+를 지원하게 해줘.” 이런 식이 “내 블록을 고쳐줘”보다 낫습니다. 무엇을 바꿔야 하는지 wp-block-development 스킬이 마크업을 수정해야 하는지, deprecated를 추가해야 하는지, 등록을 조정해야 하는지 판단할 수 있기 때문입니다.

블록 유형에 맞는 워크플로를 쓰기

static block이라면 attribute source, 직렬화된 마크업, save()에 집중하세요. dynamic block이라면 render.php, render_callback, wrapper attribute를 중심으로 보세요. container block이라면 템플릿 규칙을 바꾸기 전에 InnerBlocks 구조부터 확인해야 합니다. 이 wp-block-development 설치 패턴은 블록 루트를 먼저 읽고, 큰 리팩터링 전에 작은 변경 경로를 시험해 볼 때 가장 잘 맞습니다.

wp-block-development 스킬 FAQ

wp-block-development은 Gutenberg 블록 생성에만 쓰이나요?

아닙니다. wp-block-development 스킬은 문제 해결과 유지보수에도 잘 맞습니다. invalid content, editor style 누락, 등록 실패, deprecation, 프런트엔드 출력 불일치까지 포함됩니다. 블록 메타데이터나 serialization이 조금이라도 관련되어 있다면 이 스킬이 유용합니다.

WordPress를 이미 안다면 이 스킬이 꼭 필요한가요?

WordPress는 잘 알고 있지만 블록 구현에서 실수를 줄이고 싶다면, 그렇습니다. 일반적인 프롬프트는 블록 개발에서 숨은 호환성 작업을 자주 놓치지만, wp-block-development는 저장된 콘텐츠와 에디터 동작에 영향을 주는 파일과 결정을 더 정확히 보게 해줍니다.

언제 wp-block-development을 쓰지 말아야 하나요?

일반적인 PHP 플러그인 구조, 테마 스타일링, 또는 관련 없는 JavaScript 앱 작업에는 쓰지 마세요. 이 스킬은 문제의 중심이 블록 등록, 블록 마크업, dynamic rendering, WordPress editor behavior에 있을 때 가장 유용합니다.

wp-block-development은 초보자에게도 친화적인가요?

범위가 분명하다면 그렇습니다. 이 스킬은 정확히 어떤 파일이 중요한지 짚어주고, static, dynamic, nested block 패턴을 구분해 주기 때문에 초보자에게 도움이 됩니다. 다만 block root를 식별할 수 없거나, 블록이 마크업을 저장하는지 서버에서 렌더링하는지 모를 때는 도움이 덜합니다.

wp-block-development 스킬을 더 좋게 쓰는 방법

블록 정보를 먼저 제공하기

가장 좋은 wp-block-development 결과는 block name, 폴더, static인지 dynamic인지, 지원해야 하는 WordPress 버전을 함께 준 입력에서 나옵니다. 현재 block.json, edit/save 구조, 실패한 마크업을 붙여 넣을 수 있다면, 스킬이 추측이 아니라 호환성 관점에서 판단할 수 있습니다.

기능이 아니라 실패 양상을 설명하기

모델에게 무엇이 깨지는지 알려주세요. 예: “업데이트 후 attributes가 초기화된다,” “editor에 invalid block이 표시된다,” “iframe에서 frontend CSS가 빠진다,” “새 마크업이 기존 글을 깨뜨리면 안 된다.” 이런 세부 정보가 있어야 wp-block-development가 migration, registration fix, wrapper 변경, build 변경 중 무엇을 권할지 정할 수 있습니다.

기존 콘텐츠를 보호하기

가장 중요한 개선 습관은 예전 글을 보존하는 것입니다. 저장된 HTML이 바뀐다면 deprecated 경로와 migration plan을 요청하세요. attribute가 취약한 selector에서 온다면 현재 HTML과 기대 출력값을 함께 주어, wp-block-development 가이드가 더 안전한 source를 제안하도록 하세요.

좁은 테스트 루프로 반복하기

첫 답변 뒤에는 한 번에 한 블록, 한 글, 한 WordPress 버전만 테스트하세요. 결과가 여전히 틀리면 정확한 console warning, invalid-content 메시지, 렌더링된 HTML diff를 다시 알려주세요. 그러면 다음 wp-block-development 반복이 훨씬 더 정밀해지고, 불필요한 리팩터링도 줄어듭니다.