Prisma + tRPC

Features

🧙‍♂️ E2E typesafety with tRPC
⚡ Full-stack React with Next.js
⚡ Database with Prisma
⚙️ VSCode extensions
🎨 ESLint + Prettier
💚 CI setup using GitHub Actions:
- ✅ E2E testing with Playwright
- ✅ Linting
🔐 Validates your env vars on build and start

Setup

yarn:

yarn create next-app --example https://github.com/trpc/trpc --example-path examples/next-prisma-starter trpc-prisma-starter
cd trpc-prisma-starter
yarn
yarn dx

npm:

npx create-next-app --example https://github.com/trpc/trpc --example-path examples/next-prisma-starter trpc-prisma-starter
cd trpc-prisma-starter
yarn
yarn dx

Requirements

Node >= 14
Postgres

Development

Start project

yarn create next-app --example https://github.com/trpc/trpc --example-path examples/next-prisma-starter trpc-prisma-starter
cd trpc-prisma-starter
yarn
yarn dx

Commands

yarn build      # runs `prisma generate` + `prisma migrate` + `next build`
yarn db-reset   # resets local db
yarn dev        # starts next.js
yarn dx         # starts postgres db + runs migrations + seeds + starts next.js 
yarn test-dev   # runs e2e tests on dev
yarn test-start # runs e2e tests on `next start` - build required before
yarn test:unit  # runs normal jest unit tests
yarn test:e2e   # runs e2e tests

Deployment

Using Render

The project contains a render.yaml "Blueprint" which makes the project easily deployable on Render.

Go to dashboard.render.com/blueprints and connect to this Blueprint and see how the app and database automatically gets deployed.

Files of note

Path	Description
`./prisma/schema.prisma`	Prisma schema
`./src/pages/api/trpc/[trpc].ts`	tRPC response handler
`./src/server/routers`	Your app's different tRPC-routers

Created by @alexdotjs.

shealan/examples-next-prisma-starter