typescript-rpc's Introduction

Typescript-RPC (FrontEnd JS <-> BackEnd nodeJS)

Basic concepts:

define API

export type EchoRequest = ToRequestType<{
  echoReq: string;
}>;

export type EchoResponse = ToResponseType<{
  echoResp: string;
}>;

export const echoAPI = createAPIDefinition<
  EchoRequest,
  EchoResponse
>()('echo');

(server - ONCE) create Server implementation instance

const apiServer = new SocketIOSimpleAPIServer(serverSocketIO);

(server) add API Handler

apiServer.addAPI(echoAPI, async req => {
  return {
    echoResp: req.echoReq,
  };
});

(client - ONCE) create Client implementation instance
```
const apiClient = new SocketIOSimpleAPIClient();
```
(client) get API stub function
```
const echo = apiClient.useAPI(echoAPI)
```

(client) use API stub function

const echoResponse = await echo({
  echoReq: 'test',
})

API types:

simple-API: Simple request/response (see above)

with-progress API: API with onProgress callback

file uploads, etc

export type UpdateProfileRequest = ToRequestWithProgressType<{
  username: string;
  description: string;
  profileImageFile: File;
}>;

export type UpdateProfileResponse = ToResponseType<{
  profileUrl: string;
}>;

export const updateProfileAPI = createAPIWithProgressDefinition<
  UpdateProfileRequest,
  UpdateProfileResponse
>()('updateProfile');

// client:
const updateProfile = withProgressAPIClient.useAPI(updateProfileAPI)
// ...later
await updateProfile({
  username: 'a',
  description: 'b',
  profileImageFile: someFile,
  onProgress(progressEvent) {
    console.log('upload progress', progressEvent)
  }
})