Wp Headless And Wpgraphql
jorgerosal/wordpress-skills
Headless WordPress and WPGraphQL review guidance. An agent skill from jorgerosal/wordpress-skills.
Model data with @data-client schemas (Entity, EntityMixin, Collection, Union, Query, Values, All, Invalidate, Lazy, Scalar) for atomic, consistent, referentially-equal async data via normalization…
$ npx skills add reactive/data-client --skill data-client-schema -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install reactive/data-client data-client-schema --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/reactive/data-client.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/data-client-schema .claude/skills/data-client-schema && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "data-client-schema" agent skill from https://github.com/reactive/data-client/tree/master/.agents/skills/data-client-schema into .claude/skills/data-client-schema/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "data-client-schema", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/reactive/data-client/tree/master/.agents/skills/data-client-schemaType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add reactive/data-client --skill data-client-schema -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install reactive/data-client data-client-schema --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/reactive/data-client.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/data-client-schema .agents/skills/data-client-schema && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "data-client-schema" agent skill from https://github.com/reactive/data-client/tree/master/.agents/skills/data-client-schema into .agents/skills/data-client-schema/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "data-client-schema", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add reactive/data-client --skill data-client-schema -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install reactive/data-client data-client-schema --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/reactive/data-client.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/data-client-schema .cursor/skills/data-client-schema && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "data-client-schema" agent skill from https://github.com/reactive/data-client/tree/master/.agents/skills/data-client-schema into .cursor/skills/data-client-schema/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "data-client-schema", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/reactive/data-client.git --path .agents/skills/data-client-schema--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add reactive/data-client --skill data-client-schema -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install reactive/data-client data-client-schema --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/reactive/data-client.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/data-client-schema .gemini/skills/data-client-schema && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "data-client-schema" agent skill from https://github.com/reactive/data-client/tree/master/.agents/skills/data-client-schema into .gemini/skills/data-client-schema/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "data-client-schema", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install reactive/data-client data-client-schemaInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add reactive/data-client --skill data-client-schema -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/reactive/data-client.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/data-client-schema .github/skills/data-client-schema && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "data-client-schema" agent skill from https://github.com/reactive/data-client/tree/master/.agents/skills/data-client-schema into .github/skills/data-client-schema/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "data-client-schema", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add reactive/data-client --skill data-client-schema -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install reactive/data-client data-client-schema --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/reactive/data-client.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/data-client-schema .opencode/skills/data-client-schema && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "data-client-schema" agent skill from https://github.com/reactive/data-client/tree/master/.agents/skills/data-client-schema into .opencode/skills/data-client-schema/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "data-client-schema", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
data-client-schemaModel data with @data-client schemas (Entity, EntityMixin, Collection, Union, Query, Values, All, Invalidate, Lazy, Scalar) for atomic, consistent, referentially-equal async data via normalization…
Data Client Schema is an agent skill from reactive/data-client. Model data with @data-client schemas (Entity, EntityMixin, Collection, Union, Query, Values, All, Invalidate, Lazy, Scalar) for atomic, consistent, referentially-equal async data via normalization, identity-based caching, and a single source of truth. Use when defining or editing pk, static schema, resource()/RestEndpoint schema, mutable lists/maps (push/unshift/assign/remove/move), polymorphic/discriminated types, memoized selectors / derived data, partial/supplementary entities, relational/nested/joined data…
Its SKILL.md is about 2.3k tokens, which your agent loads only when the skill is triggered. The skill folder holds 42 other files, including reference files (for example `references.json`, `references/All.md` and `references/All.vue.md`).
It sits in Backend & APIs, covering Caching, Database schema design and GraphQL. It works with GraphQL. The repository describes itself as: Async State Management without the Management. REST, GraphQL, SSE, Websockets. The licence is Apache-2.0.
8 steps, taken from the step headings in SKILL.md.
Read from SKILL.md and the folder at commit 02c0932. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
No scripts in the folder and no shell commands in SKILL.md (its code samples are typescript).
From the folder's file list and the shell code blocks in SKILL.md.
Links to these hosts (documentation or services it may open):
dataclient.ioFrom URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Data Client Schema loads about 2.3k tokens when it runs, and up to ~79k if it reads all its reference files. Until then it costs about 201 tokens; SKILL.md has 750 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from reactive/data-client at commit 02c0932, republished under its Apache-2.0 licence (© reactive). 750 words, ~2,332 tokens.
.claude/skills/data-client-schema/SKILL.md (or your agent's skills folder). This skill also uses 41 other files; get the full folder from GitHub.Define schemas to represent the JSON returned by an endpoint. Compose these to represent the data expected.
{[key:string]: Schema} - immutable objects[Schema] - immutable listsnew Collection(Values(Schema)) - mutable/growable mapsnew Query(Queryable) - memoized programmatic selectors
const queryRemainingTodos = new Query(
TodoResource.getList.schema,
entries => entries.filter(todo => !todo.completed).length,
);const groupTodoByUser = new Query(
TodoResource.getList.schema,
todos => Object.groupBy(todos, todo => todo.userId),
);Define Query transformations with the data model (e.g. src/resources/) — not inside custom hooks
wrapping useSuspense/useQuery, which hides data dependencies and couples data logic to view code.
Entity subclass defines defaults for all non-optional serialised fields.pk() only when the primary key ≠ id.pk() return type is number | string | undefinedEntity.process(value, parent, key, args) to insert fields based on args/urlstatic schema (optional) for nested schemas or deserialization functionsprocess() → pk() → validate() → visit nested schemas (recurse into schema fields) → if existing: mergeWithStore() which calls shouldUpdate() and maybe shouldReorder() + merge(); metadata via mergeMetaWithStore().fromJS(), restoring prototype chain so getters, methods, and schema processing work. Order: createIfValid() → validate() → fromJS() → unvisit nested schemas (recurse into schema fields).To define polymorphic resources (e.g., events), use Union and a discriminator field.
import { Union } from '@data-client/rest'; // also available from @data-client/endpoint
export abstract class Event extends Entity {
type: EventType = 'Issue'; // discriminator field is shared
/* ... */
}
export class PullRequestEvent extends Event { /* ... */ }
export class IssuesEvent extends Event { /* ... */ }
export const EventResource = resource({
path: '/users/:login/events/public/:id',
schema: new Union(
{
PullRequestEvent,
IssuesEvent,
// ...other event types...
},
'type', // discriminator field
),
});Collections wrap Array or Values schemas to enable mutations (add/remove/move).
pk() uses nestKey(parent, key) when nested in an Entity and available; otherwise it uses argsKey(...args), then serializes the result. Without options, it defaults to argsKey: params => ({ ...params }), using all endpoint args as the collection key.
argsKey — derive pk from endpoint arguments (default)nestKey — derive pk from parent entity for nested shared-state collectionsDefine both on the same Collection to reuse one definition top-level and nested. When argsKey(args) and nestKey(parent) produce the same object shape, the top-level fetch and the nested read resolve to the same (referentially equal) array/map — push/unshift/assign/move/remove on either updates both:
const userTodos = new Collection([Todo], {
argsKey: ({ userId }: { userId?: string }) => ({ userId }),
nestKey: (parent: User) => ({ userId: parent.id }),
});Default createCollectionFilter uses nonFilterArgumentKeys (default: keys starting with 'order') to exclude non-filter args when matching collections. This affects which existing collections receive new items from push/unshift/assign/move.
Override as function, RegExp, or string[]:
new Collection([Todo], { nonFilterArgumentKeys: /orderBy|sortDir/ })All usable with ctrl.set() (local-only) or via RestEndpoint extenders (network).
| Method | Type | Description |
|---|---|---|
push | Array | Entity |
unshift | Array | Entity |
assign | Values | Merge entries into map |
remove | Both | Remove items by value from matching collections |
move | Both | Remove from collections matching existing state, add to collections matching new state |
addWith(merge, filter?) | Both | Custom creation schema (used internally by push/unshift/assign) |
moveWith(merge) | Both | Custom move schema (control insertion order, e.g., unshift merge for prepending) |
When an endpoint returns partial or differently-shaped data for an entity already in cache (e.g., a metadata endpoint, a stats endpoint, a lazy-load expansion endpoint), use the same Entity as the schema — don't create a wrapper entity.
See partial-entities for patterns and examples.
schema on every resource/entity/collection for normalizationEntity.schema for client-side joinsDenormalize<> type from rest/endpoint/graphql instead of InstanceType<>. This will handle all schemas like Unions, not just Entity.fromJS() or assign default properties for class fields — bare TS field types emit no runtime defaults, so schema inference breaksEntity.schema for client-side joinsVue projects: read <name>.vue.md instead of <name>.md when it exists.
For detailed API documentation, see the references directory:
© reactive, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
SKILL.md and 41 other files (references) in .agents/skills/data-client-schema of reactive/data-client.
Open the folder on GitHubat commit 02c0932
Data Client Schema next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Data Client Schema this skillreactive/data-client | 2k | — | ~2.3k | Automated safety check: Pass | Apache-2.0 | |
| Wp Headless And Wpgraphqljorgerosal/wordpress-skills | 100 | — | ~1.7k | Automated safety check: Pass | MIT | |
| API Architectcuriositech/some_claude_skills | 243 | 1 repos | ~1.4k | Automated safety check: Pass | MIT | |
| Apollo GraphqlKilo-Org/kilo-marketplace | 189 | 1 repos | ~3.1k | Automated safety check: Pass | Apache-2.0 | |
| API DesignerJeffallan/claude-skills | 12k | 2 repos | ~2k | Automated safety check: Pass | MIT | |
| Nodejs Backend Patternsever-works/ever-works | 158 | 17 repos | ~4k | Automated safety check: Pass | AGPL-3.0 |
jorgerosal/wordpress-skills
Headless WordPress and WPGraphQL review guidance. An agent skill from jorgerosal/wordpress-skills.
curiositech/some_claude_skills
Expert API designer for REST, GraphQL, gRPC architectures. An agent skill from curiositech/some_claude_skills.
Kilo-Org/kilo-marketplace
Guidelines for developing GraphQL APIs and React applications using Apollo Client for state management, data fetching, and caching
Jeffallan/claude-skills
Designs REST and GraphQL APIs from resource modeling to an OpenAPI 3.1 contract, with versioning, pagination and RFC 7807 error handling.
ever-works/ever-works
Build production-ready Node.js backend services with Express/Fastify, implementing middleware patterns, error handling, authentication, database integration, and API design best practices.
qf-studio/navigator
Create REST/GraphQL API endpoint with validation, error handling, and tests.
reactive/data-client
Set up and migrate to @data-client/rest for REST APIs. An agent skill from reactive/data-client.
reactive/data-client
Implement @data-client Managers for global/background side effects - websocket, SSE, polling, real-time updates, subscriptions, logging, analytics, metrics/timing, error reporting (Sentry), toast…
reactive/data-client
Use @data-client/react hooks for data fetching, mutations, and rendering - useSuspense, useFetch, useQuery, useCache, useLive, useDLE, useSubscription, useController, DataProvider, AsyncBoundary…
reactive/data-client
Test @data-client/react with renderDataHook and mountDataClient - jest unit tests, fixtures, interceptors, MockResolver, mock responses, nock HTTP mocking, fake timers for polling/subscription…
reactive/data-client
Define REST APIs with @data-client/rest - resource(), RestEndpoint, CRUD (GET/POST/PUT/PATCH/DELETE), HTTP fetch, normalize, cache, urlPrefix, path-to-regexp parameters, searchParams, pagination…
reactive/data-client
Use @data-client/vue composables for data fetching, mutations, and rendering - useSuspense, useFetch, useQuery, useCache, useLive, useDLE, useSubscription, useController, useLoading, useDebounce…
Works with
Categories
Model data with @data-client schemas (Entity, EntityMixin, Collection, Union, Query, Values, All, Invalidate, Lazy, Scalar) for atomic, consistent, referentially-equal async data via normalization…. Data Client Schema is an agent skill from reactive/data-client. Model data with @data-client schemas (Entity, EntityMixin, Collection, Union, Query, Values, All, Invalidate, Lazy, Scalar) for atomic, consistent, referentially-equal async data via normalization, identity-based caching, and a single source of truth.
Data Client Schema fits situations like: resource()/RestEndpoint schema; mutable lists/maps (push/unshift/assign/remove/move); polymorphic/discriminated types; memoized selectors / derived data.
Run `npx skills add reactive/data-client --skill data-client-schema -a claude-code`. Or copy the skill folder (.agents/skills/data-client-schema in reactive/data-client) into .claude/skills/data-client-schema in your project. Claude Code loads it when a task matches its description.
Run `npx skills add reactive/data-client --skill data-client-schema -a codex`. Or copy the skill folder (.agents/skills/data-client-schema in reactive/data-client) into .agents/skills/data-client-schema in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add reactive/data-client --skill data-client-schema -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/data-client-schema, .gemini/skills/data-client-schema, .github/skills/data-client-schema and .opencode/skills/data-client-schema in your project.
SKILL.md names no scripts, command-line tools or credentials: Data Client Schema is instructions for the agent only.
SKILL.md names 1 domain. As links in the text: dataclient.io. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
Data Client Schema is published under the Apache-2.0 licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.
About 2.3k tokens (SKILL.md is roughly 9.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 76k tokens, read only when the agent opens those files.
Skills that share tags, products or a category with Data Client Schema: Wp Headless And Wpgraphql (jorgerosal/wordpress-skills, 100 stars), API Architect (curiositech/some_claude_skills, 243 stars), Apollo Graphql (Kilo-Org/kilo-marketplace, 189 stars) and API Designer (Jeffallan/claude-skills, 12k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
reactive (a GitHub organization) maintains it in reactive/data-client, which has 2,037 GitHub stars. The repository holds 17 skills in this directory. The repository was last updated on October 7, 2026.
Source: reactive/data-client on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.