skills.rest
reactive
reactiveOFFICIAL
Explore all skills by this author →
Website𝕏@dataclientioGitHub

data-client-schema

Define normalized data schemas with Entity, Collection, Union, and Query for @data-client applications.

2.0k|99|Updated Feb 15, 2019
Search Tags:#Schema#Caching#typeScript#Entity#data-client#reAct#Normalization
One-click install
npx skills add https://github.com/reactive/data-client --skill data-client-schema
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: data-client-schema
Source: https://github.com/reactive/data-client/tree/main/.agents/skills/data-client-schema
Command: npx skills add https://github.com/reactive/data-client --skill data-client-schema

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Modeling remote data for React applications often leads to duplicated state, inconsistent cache updates, and manual merge logic. This Skill guides the definition of @data-client schemas so API responses are normalized into a single source of truth with identity-based caching and referentially equal results.

Core Features & Use Cases

  • Schema Modeling: Define Entity, EntityMixin, Collection, Union, Values, All, Invalidate, Lazy, and Scalar schemas for objects, lists, maps, and polymorphic data.
  • Mutable Collections: Use Collection extenders like push, unshift, assign, remove, and move to mutate lists and maps with consistent cache updates across nested and top-level views.
  • Derived Data & Joins: Build memoized Query selectors and client-side joins via Entity.schema for relational, nested, or supplementary endpoint data.
  • Use Case: When building a todo app where the same Todo appears in a user-scoped list and a global list, define one Collection with matching argsKey and nestKey so mutations on either view update both with referential equality.

Quick Start

Ask the assistant to define an Entity and Collection schema for your REST resource, including pk handling and a polymorphic Union if your API returns multiple event types.

Frequently Asked Questions about data-client-schema

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I define a normalized schema in @data-client?▼

Create an Entity subclass with default values for all serialized fields, then attach it as the schema on your resource or RestEndpoint. Compose nested schemas via the static schema property for relational data.

How do I model polymorphic API responses with Union?▼

Pass a mapping of Entity classes and a discriminator field name to new Union(). The discriminator field, such as type, determines which Entity class each response object normalizes into.

What is the difference between Collection and Array schemas?▼

Array schemas represent immutable lists, while Collection wraps Array or Values to enable mutations like push, unshift, assign, remove, and move. Collections use argsKey or nestKey to route updates to matching cached lists.

Does @data-client schema work with GraphQL and REST?▼

Yes, the same schema types apply across @data-client/rest, /endpoint, /graphql, and /normalizr. Use the Denormalize type from these packages instead of InstanceType to handle Unions and other schema types.

Why does my Entity lose class methods after caching?▼

The normalized cache stores plain JSON objects, not class instances. Denormalization restores instances via fromJS(), but you must define default field values since bare TypeScript field declarations emit no runtime defaults.

When should I use Query instead of a custom hook selector?▼

Use Query for memoized derived data defined alongside your data model in the resources directory. Wrapping useSuspense in custom hooks hides data dependencies and couples data logic to view code.

Related Skills

Explore More Software Engineering Skills→
reactivereactive
2.0k

rdc-rest

Define type-safe REST APIs with schema-driven normalization and caching.

Official
Advanced
TheBushidoCollectiveTheBushidoCollective
187

relay-mutations-patterns

Implement Relay mutations with optimistic updates and connection-based cache updates.

Official
Advanced
trusted-americantrusted-american

ember-model-validator

Validate Ember Data models with declarative static validations and inline errors.

Official
Advanced
kinneyyankinneyyan
2

react-state-management

Manage global and server state in React with Redux Toolkit, Zustand, Jotai, and React Query.

Community
Intermediate