next-13-beta-wire-up-db

docker-compose.yml

version: '3.8'
services:
  db:
    image: postgres:14.1-alpine
    restart: always
    environment:
      - POSTGRES_USER=postgres
      - POSTGRES_PASSWORD=postgres
    ports:
      - '5432:5432'
    volumes:
      - db:/var/lib/postgresql/data
volumes:
  db:
    driver: local

package.json

...
"scripts": {
  ...
    "db-start": "docker-compose up",
    "db-create": "prisma db push",
    "db-seed": "prisma db seed"
},

...

"prisma": {
  "seed": "ts-node --compiler-options {\"module\":\"CommonJS\"} prisma/seed.ts"
},

page.tsx

import Image from "next/image";
import styles from "./page.module.css";
import { prisma } from "@/lib/prisma";

async function getData() {
  const top3 = await prisma.top3.findFirst({
    where: {
      createdAt: {
        equals: new Date(),
      },
    },
    include: {
      todos: {
        orderBy: {
          id: "asc",
        },
      },
    },
  });

  return top3;
}

export default async function Home() {
  const top3 = await getData();

  return (
    <main className={styles.main}>
      <h1 className={styles.h1}>Daily Top 3</h1>
      <ol>
        {top3?.todos.map((todo) => (
          <li key={todo.id} className={styles.li}>
            {todo.title}
          </li>
        ))}
      </ol>
    </main>
  );
}

prisma.ts

import { PrismaClient } from "@prisma/client";

const globalForPrisma = global as unknown as { prisma: PrismaClient };

export const prisma =
  globalForPrisma.prisma ||
  new PrismaClient({
    log: ["query"],
  });

if (process.env.NODE_ENV !== "production") globalForPrisma.prisma = prisma;

schema.prisma

// This is your Prisma schema file,
// learn more about it in the docs: https://pris.ly/d/prisma-schema

generator client {
  provider = "prisma-client-js"
}

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

model Top3 {
  id        Int      @id @default(autoincrement())
  createdAt DateTime @default(now()) @db.Date
  todos     Todo[]
}

model Todo {
  id       Int     @id @default(autoincrement())
  title    String
  complete Boolean @default(false)
  Top3     Top3    @relation(fields: [top3Id], references: [id])
  top3Id   Int
}

seed.ts

import { PrismaClient } from "@prisma/client";
const prisma = new PrismaClient();
async function main() {
  const top3 = await prisma.top3.upsert({
    where: {
      id: 1,
    },
    update: {},
    create: {
      todos: {
        create: [
          { title: "Research Next.js beta changes", complete: false },
          { title: "Write Next.js article", complete: false },
          { title: "Publish Next.js article on LinkedIn", complete: false },
        ],
      },
    },
  });
  console.log({ top3 });
}
main()
  .then(async () => {
    await prisma.$disconnect();
  })
  .catch(async (e) => {
    console.error(e);
    await prisma.$disconnect();
    process.exit(1);
  });