Giter VIP home page Giter VIP logo

remix-server-kit's Introduction

This project is NO longer maintained.

Remix Server Kit

Remix server kit provides useful utilities and simplifies validation for actions and loaders.

Installation

  npm install remix-server-kit zod

Documentation

Resolvers

Resolvers are functions that can be called in your actions and loaders where each time they are called the input is validated against a defined schema.

Creating a Resolver

To create a resolver we need to use the createResolver function. You will need to provided an object with a schema and a resolve function.

Example:

import { createResolver } from "remix-server-kit";
import * as z from "zod";

const createTask = createResolver({
  schema: z.object({ name: z.string(), deadline: z.date() }),
  resolve({ name, deadline }) {
    return { name, deadline, createdAt: new Date().toISOString() };
  },
});

// call the resolver as any other fuction
const { data: task } = createTask({
  name: "Wash the dishes",
  deadline: new Date(),
});

Shape of Resolver Result

{
  success: true | false,
  info: { name: string, deadline: Date, createdAt: string },
  resolverErr: { message: string, status:number, err: ResolverErr } | null,
  schemaErr: z.ZodErr
}
```

## Adding context to your resolvers

You can reuse logic across resolvers. Each resolver can accept a function that will populate the context variable of the resolver. This means that you can provide context directly form your actions and loaders to the resolver. The context variable will be **typed** automatically.

```typescript
import { createResolver, createContextResolver } from "remix-server-kit";
import { object, string, date } from "superstruct";
import { db } from "~/db.server";

const authContext = createContextResolver({
  resolve() {
    return { userId: number };
  },
});

const createTask = createResolver({
  schema: object({ name: string(), deadline: date() }),
  context: authContext,
  // typeof context = { userId: number }
  async resolve({ name, deadline }, context) {
    const data = {
      userId: context.userId,
      name,
      deadline,
      createdAt: new Date().toISOString(),
    };

    const task = await db.task.createTask(data);

    return task;
  },
});

// call the resolver as any other fuction
const { data: task } = createTask({
  name: "Wash the dishes",
  deadline: new Date(),
});

Error handling

Errors from resolvers are outputted as a ResolverError and thrown responses (json, redirects) remain as Response objects.

Each resolver accepts and optional errorFormatter function that you can use to modify the shape of ResolverError.data.

const minus = createResolver({
  // errors are thrown if safe mode is false, otherwise a call to minus will return {data?: number, error?: ResolverError<T> }
  schema: z.object({ numbers: { num1: z.number(), num2: z.number() } }),
  context: authContext,
  async resolve({ name, deadline }, context) {
    throw new ResolverError("Resolver failed!", "FORBIDDEN");
  },
});

const { info, resolverErr } = minus({ numbers: { num1: 200, num2: "200" } });

return json({info}, {status: minus?.resolverErr?.})

remix-server-kit's People

Contributors

gim3l avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.