Next.js 15 fullstack (App Router + Server Actions) · leksjon

Sette opp Prisma ORM

Konfigurer og integrer Prisma ORM i Next.js-prosjektet ditt for å samhandle med ulike databaser.

Leksjon 1 av 412 trinn

Sette opp Prisma ORM er en gratis leksjon i Next.js 15 fullstack (App Router + Server Actions) på CoddyKit. Dette er leksjon 1 av 4. Du kan lese valgfritt 3 leksjoner fra denne læringsstien gratis i sin helhet – deretter låser CoddyKit PRO opp alle leksjoner, samt praktisk øving med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i Next.js 15 fullstack (App Router + Server Actions), og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i Next.js 15 fullstack (App Router + Server Actions) inneholder totalt 4 leksjoner.

Hva er en ORM?

Velkommen! I denne leksjonen skal vi sette opp Prisma ORM i et Next.js-prosjekt. Men først: Hva er en ORM?

  • ORM står for Object-Relational Mapping.
  • Det er en teknikk som lar deg samhandle med databasen ved hjelp av objekter fra programmeringsspråket ditt, i stedet for å skrive rå SQL.
  • Se på det som en oversetter mellom koden din (for eksempel JavaScript-objekter) og databasen (for eksempel SQL-tabeller).

Hvorfor velge Prisma?

Prisma er en moderne ORM som er populær sammen med Next.js, og det er gode grunner til det:

  • Typesikkerhet: Den genererer en typesikker klient som forhindrer mange feil under kjøring.
  • Utvikleropplevelse: Intuitivt API, kraftige migreringer og automatisk kodefullføring.
  • Moderne teknologistakk: Utviklet for TypeScript og moderne JavaScript, og passer perfekt sammen med Next.js.
  • Støtte for databaser: Fungerer med PostgreSQL, MySQL, SQLite, SQL Server og MongoDB.

Installere Prisma

La oss begynne med å legge til Prisma i Next.js-prosjektet ditt. Du trenger to hovedpakker:

  • prisma: Prisma CLI (Command Line Interface) for utviklingsoppgaver.
  • @prisma/client: Prisma Client-biblioteket for å samhandle med databasen i kode.

Kjør denne kommandoen i rotmappen til prosjektet:

npm install prisma @prisma/client

Initialisere Prisma

Etter installasjonen må du initialisere Prisma i prosjektet. Denne kommandoen setter opp den grunnleggende Prisma-strukturen, inkludert filen prisma/schema.prisma.

Den oppretter også en .env-fil som skal inneholde tilkoblingsstrengen til databasen.

npx prisma init

Koble til databasen

Filen .env som ble opprettet av prisma init, inneholder variabelen DATABASE_URL. Det er her du angir hvordan Prisma skal koble til databasen.

Til lokal utvikling brukes ofte SQLite fordi det er enkelt. I produksjon kan du bruke PostgreSQL eller MySQL.

# .env
DATABASE_URL="postgresql://user:password@host:port/database?schema=public"

# Example for SQLite (local file)
# DATABASE_URL="file:./dev.db"

Prisma-skjemafilen

Filen prisma/schema.prisma er kjernen i Prisma-oppsettet ditt. Den definerer tre viktige blokker:

  • datasource: Angir databaseleverandøren (for eksempel postgresql eller sqlite).
  • generator: Konfigurerer Prisma Client (vanligvis prisma-client-js).
  • model: Definerer databasetabellene (modellene) og feltene deres.

Definere den første modellen

La oss definere en enkel User-modell i filen prisma/schema.prisma. Denne modellen representerer en tabell i databasen.

  • id: Unik identifikator som økes automatisk.
  • email: Brukerens e-postadresse, må være unik.
  • name: Brukerens navn, valgfritt.
// prisma/schema.prisma

model User {
  id    Int     @id @default(autoincrement())
  email String  @unique
  name  String?
}

Generere Prisma Client

Etter at du har definert eller endret modellene i schema.prisma, må du generere Prisma Client. Denne kommandoen leser skjemaet ditt og oppretter klientbiblioteket med typesikkerhet.

Det er denne klienten du importerer og bruker i Next.js-applikasjonen for å samhandle med databasen.

npx prisma generate

Bruke migreringer

For å opprette eller oppdatere databasetabellene basert på schema.prisma bruker du migreringer. Kommandoen migrate dev:

  • sammenligner skjemaet ditt med databasen.
  • genererer SQL-migreringsfiler.
  • bruker disse migreringene på databasen.

Den genererer også Prisma Client automatisk etter migreringen.

npx prisma migrate dev --name init

Bruke Prisma Client

Når Prisma er satt opp og generert, kan du bruke PrismaClient i serverkomponentene eller API-rutene i Next.js til å utføre databaseoperasjoner. Her er et enkelt eksempel:

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

async function main() {
  const prisma = new PrismaClient();
  console.log("Prisma Client successfully initialized!");

  // In a real app, you'd perform database operations:
  // const users = await prisma.user.findMany();
  // console.log(users);

  await prisma.$disconnect();
  console.log("Prisma Client disconnected.");
}

main().catch(console.error);

Rask kontroll: Prisma-kommandoer

Du har lært om flere viktige Prisma CLI-kommandoer. Hvilken kommando brukes til å generere den typesikre Prisma Client etter at du har endret filen schema.prisma?

Oppsummering: Sette opp Prisma

Godt jobbet! Du har lært de viktigste trinnene for å integrere Prisma ORM i Next.js-prosjektet ditt:

  • Installerte Prisma CLI og klienten.
  • Initialiserte Prisma og konfigurerte database-URL-en.
  • Definerte datamodeller i schema.prisma.
  • Genererte Prisma Client.
  • Brukte migreringer til å synkronisere skjemaet med databasen.
  • Forsto hvordan du oppretter og bruker PrismaClient.

Deretter skal vi se nærmere på CRUD-operasjoner med Prisma!

Gratis å komme i gang

Lær deg TypeScript med en AI-veileder – gratis

Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.

Kurs
22
Leksjoner
88

Ofte stilte spørsmål

Er leksjonen «Sette opp Prisma ORM» gratis?

Ja – du kan lese valgfritt 3 av leksjonene i læringsstien Next.js 15 fullstack (App Router + Server Actions), inkludert «Sette opp Prisma ORM», gratis i sin helhet her på nettet. Deretter låser CoddyKit PRO opp alle leksjoner, samt interaktiv øving med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Kurset i Next.js 15 fullstack (App Router + Server Actions) inneholder totalt 4 leksjoner.

Hva lærer jeg i «Sette opp Prisma ORM»?

Konfigurer og integrer Prisma ORM i Next.js-prosjektet ditt for å samhandle med ulike databaser. Du øver på Next.js 15 fullstack (App Router + Server Actions) med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.

Trenger jeg erfaring for å begynne med Next.js 15 fullstack (App Router + Server Actions)?

Ingen tidligere erfaring er nødvendig. Next.js 15 fullstack (App Router + Server Actions) på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 1 av 4.

Hvor lang tid tar leksjonen «Sette opp Prisma ORM»?

De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.

Kan jeg skrive og kjøre kode i denne Next.js 15 fullstack (App Router + Server Actions)-leksjonen?

Ja. Alle Next.js 15 fullstack (App Router + Server Actions)-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.

Alle leksjonene i dette kurset

  1. Sette opp Prisma ORM
  2. CRUD med Server Actions
  3. Migreringer av databaseskjema
  4. Fylling av database og tilkoblingspooling
← Tilbake til Next.js 15 fullstack (App Router + Server Actions)