fate is a modern data client for React and tRPC inspired by Relay and GraphQL. It combines view composition, normalized caching, data masking, Async React features, and tRPC's type safety.

Check out fate.technology for documentation, examples, and guides.

fate Quick Start Template

Copy this repo quickly using giget:

# Using npm
npx giget@latest gh:nkzw-tech/fate-template fate-app

# Using pnpm
pnpx giget@latest gh:nkzw-tech/fate-template fate-app

Getting Started with fate

Read the Getting Started Guide to learn how to use fate in your React applications.

Technologies

This template combines the Nakazawa Tech's Web App Template and Server Template into a monorepo, with unified tooling, tRPC instead of GraphQL and fate as the data client.

This template lives on the edge. It's a turbocharged starting point on top of an already optimized stack. It uses TypeScript Go, Vite 8, Oxfmt and ships with sensible defaults to unlock an incredibly fast development experience. It follows the principles laid out in Building Scalable Applications.

Next to fate, it comes with the following technologies:

Client Technologies

• Vite 8
• React with React Compiler enabled
• Tailwind
• fbtee for i18n
• Better Auth for authentication
• React Router
• TypeScript
• pnpm

Server Technologies

• Prisma as the ORM, with the new ESM multi-file generated client.
• tRPC for typesafe APIs.
• Hono
• Better Auth for Authentication.

Folder Structure

• client/ - The React client application using fate.
• server/ - The tRPC server with Prisma.

Initial Setup

You'll need Node.js 24+ and pnpm 10+.

• Run pnpm install && pnpm dev:setup.
• Set up a Postgres database locally and add the connection string to server/.env as DATABASE_URL or run docker-compose up -d to start postgres in a docker container.
• Postgres setup:

CREATE ROLE fate WITH LOGIN PASSWORD 'echo';
CREATE DATABASE fate;
ALTER DATABASE fate OWNER TO fate;

Then, at the root of the project, run:

• pnpm prisma migrate dev to create the database and run the migrations.
• You might want to run pnpm prisma migrate reset and pnpm prisma db seed to seed the database with initial data.
• Run pnpm fate:generate to regenerate the fate client code.
• Run pnpm test to run all tests.
• Run pnpm dev to run the client and server.
• Visit http://localhost:5173 to see the app in action.