Quantum ⚛️

A tech stack to build and scale full-stack applications on serverless environments.

---

The Quantum stack

The "Quantum stack" is a serverless web development stack made by Carlos focused on simplicity, modularity, and full-stack typesafety. It consists of:

• Next.js
• Apollo GraphQL
• GraphQL Nexus
• Tailwind CSS
• TypeScript
• Prisma
• NextAuth.js

Getting started

1. Provision a new database. We recommend using Railway for this, as you get a free PostgreSQL database under their free tier.

   If you plan on changing the database provider to something like MySQL remember to change it as well in the schema.prisma file:

   datasource db {
     provider = "mysql"
     url      = env("DATABASE_URL")
   }

2. Create a new project at Prisma Data Platform to get a free Prisma Data Proxy.

3. Create a .env file in the root of the project and provision the Prisma data proxy connection string to DATABASE_URL:

   DATABASE_URL=''

4. Create a .env.migrations file in the root of the project and provision the real database connection string to DATABASE_URL:

   DATABASE_URL=''

5. Use yarn prisma:migrate to run migrations. The Prisma Data Proxy cannot run migrations on your database yet, so you must use your database connection string to do that.

6. Use yarn prisma:generate to generate a Prisma Client compatible with the Prisma Data Proxy.

7. Use yarn prisma:studio to launch a Prisma Data Studio in your browser.

graphql-codegen

The graphql-codegen client-preset provides typed GraphQL operations (Query, Mutation and Subscription).

import { graphql } from "../graphql/types/client";

const GetBooksDocument = graphql(`
  query GetBooks { # Give your operation a name
    books {
      id
      name
    }
  }
`);

Deploying to Vercel

Import your project from GitHub and add these 2 environment variables:

# Use your Prisma Data Proxy connection string for the DATABASE_URL
DATABASE_URL=''
# This ensures the Prisma Client for the Data Proxy is generated during the build step.
PRISMA_GENERATE_DATAPROXY=true