This project is a demo for feathers-request-response-pr and we can define different set of request and response interface, and it can auto infer when using CRUD service method
There are a couple of reasons but mainly is because not all request and response fields are the same. And having just one type, will work but loses the ability to control the typings. And also to provide better dev-experience.
With just one type, we define the interface like such
interface Post {
readonly _id: string; // client do not provide, server generated
title: string;
body: string;
comments?: string[]; // client provide but is not actually part of Post "schema"
createdAt: Date; // client do not provide, server generated
updatedAt: Date; // client do not provide, server generated
}And making the API call
const response = app.service('post').create({
title: 'title',
body: 'body',
// oops. force caller to put in those fields
_id: ???
createdAt: ???
});As a client, making the API call to server, it is not required to pass in certain fields like _id, createdAt, updatedAt. However, due to only having one type, we need to make those fields optional.
interface Post {
readonly _id?: string;
title: string;
body: string;
comments?: string[];
createdAt?: Date;
updatedAt?: Date;
}Now, when we call the API as such
const response = app.service('post').create({
title: 'title',
body: 'body',
});
// because createdAt is optional, typescript may complains if we want to access it
// createdAt may be null / undefined (something along the line)
// but we know that it will never be undefined
response.createdAtFor this demo, I am using Post and Comment as an example to illustrate the use case of a different Request / Response type.
Objective:
- We can have a one set of interface for client to make the request
- We could also have another set of request interface for server (if we want)
- Lastly, one set of response interface to return back to client
TLDR;
- Client make API call using
PostRequestinterface - Server takes that and convert to
ServerPostRequestinterface - Client receive
PostResponseinterface
Details;
Client is able to make a single API call to create a Post and Comments
interface Base {
readonly _id: string;
createdAt: Date;
updatedAt: Date;
}
/ Client facing interface
interface PostRequest {
title: string;
body: string;
comments?: string[];
}
// Base fields generated at server side
interface ServerPostRequest extends PostRequest, Omit<Base, '_id'> {}
interface PostResponse extends Omit<PostRequest, 'comments'>, Base {}From the interface above
- We can provide more strict typing for client to provide only what is required, and/or optional, and not more.
- When the request (
PostRequest) is received at server, we can mutate the data to what is defined asServerPostRequestinpost.before.create.hook. In this case, defining thecreatedAt, updatedAtfield. - Receiving an consistent
PostResponseback at client. Having a different set ofresponsealso allow us to drop fields unrelated to the ones from the request (droppingcomments)
Auto inferring Request and Response type
- Pay attention to
post.service.tsandcomment.service.tsinterface declaration - See
create-comment.ts,print-post.tsandappend-data.tshook - Lastly, see
post.test.tson all the type inference, and intellisense
- Run
npm i - Take
index.d.tson the root directory of this project and copy intonode_modules/@feathersjs/feathers/index.d.ts - Run
npm run mocha
This project uses Feathers. An open source web framework for building modern real-time applications.
Getting up and running is as easy as 1, 2, 3.
-
Install your dependencies
cd path/to/feathers-request-response npm install -
Start your app
npm start
Simply run npm test and all your tests in the test/ directory will be run.
Feathers has a powerful command line interface. Here are a few things it can do:
$ npm install -g @feathersjs/cli # Install Feathers CLI
$ feathers generate service # Generate a new Service
$ feathers generate hook # Generate a new Hook
$ feathers help # Show all commands
For more information on all the things you can do with Feathers visit docs.feathersjs.com.