trpc-qwik-city
TypeScript icon, indicating that this package has built-in type declarations

0.0.1 • Public • Published

tRPC qwik-city

tRPC 🤝 Qwik City

End-to-end typesafe APIs made easy with
tRPC.io in Qwik City applications.
Build & consume fully typesafe APIs, without schemas or code generation.


Working example: tRPC Qwik City


Getting started


Install trpc-qwik-city package


npm install trpc-qwik-city

or

yarn add trpc-qwik-city

Create tRPC routes

e.g.

// src/server/trpc/index.ts

import type { inferAsyncReturnType } from '@trpc/server';
import * as trpc from '@trpc/server';
import trpcTransformer from 'trpc-transformer';
import authors from './authors';

export const createContext = async () => ({});

export const router = trpc
  .router<inferAsyncReturnType<typeof createContext>>()
  .transformer(trpcTransformer)
  .merge('authors:', authors);

export type Router = typeof router;

Expose tRPC Api


// src/routes/api/trpc/[whatever]/index.ts

import type { EndpointHandler } from '@builder.io/qwik-city';
import { resolveTRPCResponse } from 'trpc-qwik-city';
import { createContext, router } from '../../../../server/trpc';

// GET manage queries
export const onGet: EndpointHandler = async ({ request, params }) => {
  const response = await resolveTRPCResponse({
    request,
    params,
    router,
    createContext,
  });
  const json = await response.json();
  return json;
};

// POST manage mutations
export const onPost: EndpointHandler = async ({ request, params }) => {
  const response = await resolveTRPCResponse({
    request,
    params,
    router,
    createContext,
  });
  const json = await response.json();
  return json;
};

Use tRPC inside component


e.g.

import trpc from '~/client/trpc';
...
...
const authors = await trpc(fetch.bind(window)).query('authors:list');

License

The ISC License.

Package Sidebar

Install

npm i trpc-qwik-city

Weekly Downloads

1

Version

0.0.1

License

ISC

Unpacked Size

7.23 kB

Total Files

8

Last publish

Collaborators

  • gioboa