zgok-api is an API developed in TypeScript for both front-end and back-end, ensuring safe request and response code through schema definitions using zod.

Usage

npm install --save zgok-core zgok-axios

Creating Schemas

Define schemas using zod. The schemas should be shared between the front-end and back-end. You can use symlinks or submodules.

1import { z } from "zod";
2import { postFunction, getFunction, patchFunction } from "@zgok-api/zgok-core";
3
4export const SampleSchema = {
5  dir1: {
6    hoge1: postFunction({
7      req: z.object({ id: z.number() }),
8      res: z.object({ name1: z.string() }),
9    }),
10    hoge2: getFunction({
11      req: z.object({ id: z.number() }),
12      res: z.object({ name2: z.string() }),
13    }),
14  },
15  dir2: {
16    moge: patchFunction({
17      req: z.object({ key: z.string() }),
18      res: z.object({ kind: z.object({ name: z.string() }) }),
19    }),
20  },
21};

Frontend Setup

npm install --save zgok-axios yarn add zgok-axios

zgok-axios generates functions from zgokSchema to handle axios processes. Both requests and responses are validated by zod.

1import { ZgokAxios } from "@zgok-api/zgok-axios";
2
3export const zgokAxios = ZgokAxios(
4  Axios.create({ baseURL: "http://localhost:3000/base" }),
5  SampleSchema
6);
7
8const hoge1 = async () => {
9  const res = await zgokAxios.dir1.hoge1({ id: 1 });
10
11  // headers option.
12  // const res = await zgokAxios.dir1.hoge1({ id: 1 }, {headers:  { Authorization: "Bearer token123" }});
13
14  console.log("res", res);
15};