Next.js GraphQL Prisma Base

Base repo with Next.js, GraphQL, and Prisma.

Development

Clone the repository.

Install Dependencies

Install dependencies with yarn.

yarn

Set Up Database

Fill out DATABASE_URL at .env (example: .env.example).

# You can set up a local development database with docker compose.
# The default DATABASE_URL in .env.example connects to this db.
docker compose up -d

Migrate the database.

yarn prisma migrate dev --skip-seed

Seed some dummy data.

yarn prisma db seed

You can view database tables using Prisma Studio.

yarn prisma studio

You can reset the database with:

yarn prisma migrate reset --skip-seed

Generated Files

Some files (named as **/*.generated.*) are automatically generated.

With the generation ordering:

Prisma & Nexus Types

Database types are generated from src/prisma/schema.prisma and stored in node_modules.
```
yarn generate:prisma
```
GraphQL Schema & Nexus Typings

After defining the GraphQL schema using nexus and next-nexus in src/graphql/schema.ts, we can generate the GraphQL schema file src/graphql/schema.generated.graphql and the nexus typings types/nexus-typegen.generated.d.ts by starting the server and initiating a query.
```
yarn dev
# and open browser http://localhost:3000/api/graphql
```
Urql GraphQL Types

From the back end generaged GraphQL schema src/graphql/schema.generated.graphql and the queries we wrote in src/{pages,components}/**/*.{graphql,js,ts,jsx,tsx}, we can generate the front end types src/graphql/codegen.generated.ts.

Read more in codegen.yml and GraphQL Code Generator.
```
yarn generate:codegen
```

The generated files will be generated again before making a commit. See .husky/pre-commit

You can run all generations with:

yarn generate

Start Next.js App

yarn dev

The main page endpoint is at http://localhost:3000.