Define Resources

Resources are a collection of methods for a given data model.

Entities and Schemas declaratively define the data model. Endpoints are the methods on that data.

REST

npm install --save @data-client/rest

Codegen  Instructions

resource() constructs a namespace of RestEndpoints

TodoResource

import { Entity, resource } from '@data-client/rest';  export class Todo extends Entity {  id = 0;  userId = 0;  title = '';  completed = false;   static key = 'Todo'; }  export const TodoResource = resource({  urlPrefix: 'https://jsonplaceholder.typicode.com',  path: '/todos/:id',  schema: Todo,  searchParams: {} as { userId?: string | number } | undefined,  paginationField: 'page', });  /** Methods can be called as functions or used in hooks */  // GET https://jsonplaceholder.typicode.com/todos/5 TodoResource.get({ id: 5 }); // GET https://jsonplaceholder.typicode.com/todos TodoResource.getList(); // GET https://jsonplaceholder.typicode.com/todos?userId=1 TodoResource.getList({ userId: 1 }); // POST https://jsonplaceholder.typicode.com/todos TodoResource.getList.push({ title: 'my todo' }); // POST https://jsonplaceholder.typicode.com/todos?userId=1 TodoResource.getList.push({ userId: 1 }, { title: 'my todo' }); // GET https://jsonplaceholder.typicode.com/todos?userId=1&page=2 TodoResource.getList.getPage({ userId: 1, page: 2 }); // PUT https://jsonplaceholder.typicode.com/todos/5 TodoResource.update({ id: 5 }, { title: 'my todo' }); // PATCH https://jsonplaceholder.typicode.com/todos/5 TodoResource.partialUpdate({ id: 5 }, { title: 'my todo' }); // DELETE https://jsonplaceholder.typicode.com/todos/5 TodoResource.delete({ id: 5 }); 

GraphQL

npm install --save @data-client/graphql

GQLEndpoint helps quickly defined queries and mutations

TodoResource

import { GQLEndpoint, GQLEntity } from '@data-client/graphql';  const gql = new GQLEndpoint('/');  export class Todo extends GQLEntity {  title = '';  completed = false;   static key = 'Todo'; }  export const TodoResource = {  getList: gql.query(  `  query GetTodos {  todo {  id  title  completed  }  } `,  { todos: new schema.Collection([Todo]) },  ),  update: gql.mutation(  `mutation UpdateTodo($todo: Todo!) {  updateTodo(todo: $todo) {  id  title  completed  }  }`,  { updateTodo: Todo },  ), }; 

Async/Promise

npm install --save @data-client/endpoint

Pre-existing TypeScript definitions can be used in Data Client with Endpoint and EntityMixin.

▶existing/Todo

▶TodoResource

import { schema, EntityMixin, Endpoint } from '@data-client/endpoint'; import {  Todo,  getTodo,  getTodoList,  updateTodo,  partialUpdateTodo,  createTodo,  deleteTodo, } from './existing/Todo';  export const TodoEntity = EntityMixin(Todo, { key: 'Todo' });  export const TodoResource = {  get: new Endpoint(getTodo, { schema: TodoEntity }),  getList: new Endpoint(getTodoList, {  schema: new schema.Collection([TodoEntity]),  }),  update: new Endpoint(updateTodo, {  schema: TodoEntity,  sideEffect: true,  }),  partialUpdate: new Endpoint(partialUpdateTodo, {  schema: TodoEntity,  sideEffect: true,  }),  create: new Endpoint(createTodo, {  schema: new schema.Collection([TodoEntity]).push,  sideEffect: true,  }),  delete: new Endpoint(deleteTodo, {  schema: new schema.Invalidate(TodoEntity),  sideEffect: true,  }), }; 

To aid in defining Resources, composable and extensible protocol specific helpers are provided for REST, GraphQL, Image/binary, Websockets+SSE.

To use existing API definitions, or define your own protocol specific helpers, use Endpoint and EntityMixin from @data-client/endpoint. [See Async/Promise tab above]