Next.js 15 -fullstack-kehitys (App Router + Server Actions) · Oppitunti

Prisma ORM:n määrittäminen

Määritä ja integroi Prisma ORM Next.js-projektiisi yhteyksien muodostamiseksi eri tietokantoihin

Oppitunti 1/412 vaihetta

Prisma ORM:n määrittäminen on ilmainen Next.js 15 -fullstack-kehitys (App Router + Server Actions)-oppitunti CoddyKitissä. Tämä on oppitunti 1/4. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu Next.js 15 -fullstack-kehitys (App Router + Server Actions)-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Next.js 15 -fullstack-kehitys (App Router + Server Actions)-kurssilla on yhteensä 4 oppituntia.

Mikä ORM on?

Tervetuloa! Tässä oppitunnissa määritämme Prisma ORM:n Next.js-projektiin. Mutta ensin: mikä ORM on?

ORM tulee sanoista Object-Relational Mapping.
Se on tekniikka, jonka avulla tietokannan kanssa voi käyttää ohjelmointikielen olioita suoraan sen sijaan, että kirjoitettaisiin raakaa SQL:ää.
Ajattele sitä koodin (esimerkiksi JavaScript-olioiden) ja tietokannan (esimerkiksi SQL-taulukoiden) välisenä kääntäjänä.

Miksi valita Prisma?

Prisma on moderni ORM, joka on suosittu Next.js:n kanssa hyvistä syistä:

Tyypiturvallisuus: Se luo tyypiturvallisen clientin, joka ehkäisee monia ajonaikaisia virheitä.
Kehittäjäkokemus: Intuitiivinen API, tehokkaat migraatiot ja automaattinen koodin täydennys.
Moderni teknologiapino: Suunniteltu TypeScriptille ja modernille JavaScriptille, joten se sopii täydellisesti Next.js:n kanssa.
Tietokantatuki: Toimii PostgreSQL:n, MySQL:n, SQLiten, SQL Serverin ja MongoDB:n kanssa.

Prisman asentaminen

Aloitetaan lisäämällä Prisma Next.js-projektiinne. Tarvitsette kaksi pääpakettia:

prisma: Prisman CLI (Command Line Interface) kehitystehtäviä varten.
@prisma/client: Prisma Client -kirjasto, jonka avulla tietokantaa käytetään koodissa.

Suorittakaa tämä komento projektinne juurikansiossa:

npm install prisma @prisma/client

Prisman alustaminen

Asennuksen jälkeen Prisma on alustettava projektissanne. Tämä komento määrittää Prisman perusrakenteen, mukaan lukien tiedoston prisma/schema.prisma.

Se luo myös .env-tiedoston tietokantayhteysmerkkijonon tallentamista varten.

npx prisma init

Tietokannan yhdistäminen

prisma init -komennon luoma .env-tiedosto sisältää muuttujan DATABASE_URL. Siinä määritätte, miten Prisma yhdistää tietokantaanne.

Paikallisessa kehityksessä käytetään usein SQLitea sen yksinkertaisuuden vuoksi. Tuotannossa voitte käyttää esimerkiksi PostgreSQL:ää tai MySQL:ää.

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

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

Prisman skeematiedosto

Tiedosto prisma/schema.prisma on Prisma-määrityksenne ydin. Se määrittää kolme keskeistä lohkoa:

datasource: Määrittää tietokantapalveluntarjoajanne (esimerkiksi postgresql tai sqlite).
generator: Määrittää Prisma Clientin asetukset (yleensä prisma-client-js).
model: Määrittää tietokantataulunne eli mallit ja niiden kentät.

Ensimmäisen mallin määrittäminen

Määritetään yksinkertainen User-malli tiedostossa prisma/schema.prisma. Tämä malli edustaa tietokantanne taulua.

id: Yksilöllinen tunniste, jonka arvo kasvaa automaattisesti.
email: Käyttäjän sähköpostiosoite, jonka on oltava yksilöllinen.
name: Käyttäjän nimi, joka on valinnainen.

// prisma/schema.prisma

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

Prisma Clientin luominen

Kun olette määrittäneet tai muuttaneet malleja tiedostossa schema.prisma, Prisma Client on luotava uudelleen. Tämä komento lukee skeemanne ja luo tyypiturvallisen client-kirjaston.

Tämän clientin tuot ja käytätte Next.js-sovelluksessanne tietokannan käsittelyyn.

npx prisma generate

Migraatioiden käyttöönotto

Luodaksenne tai päivittääksenne tietokantataulut tiedoston schema.prisma perusteella käytätte migraatioita. Komento migrate dev:

Vertaa skeemaa tietokantaan.
Luo SQL-migraatiotiedostot.
Soveltaa migraatiot tietokantaan.

Se luo myös Prisma Clientin automaattisesti migraation jälkeen.

npx prisma migrate dev --name init

Prisma Clientin käyttäminen

Kun Prisma on määritetty ja Prisma Client luotu, voitte käyttää PrismaClient-luokkaa Next.js:n palvelinkomponenteissa tai API-reiteillä tietokantaoperaatioiden suorittamiseen. Tässä on yksinkertainen esimerkki:

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);

Pikatarkistus: Prisma-komennot

Olette tutustuneet useisiin tärkeisiin Prisman CLI-komentoihin. Millä komennolla luodaan tyypiturvallinen Prisma Client sen jälkeen, kun olette muokanneet tiedostoa schema.prisma?

Vastaa interaktiivisessa oppitunnissa

Kertaus: Prisman määrittäminen

Hienoa työtä! Olette oppineet tärkeimmät vaiheet Prisma ORM:n integroimiseksi Next.js-projektiinne:

Asensitte Prisman CLI:n ja clientin.
Alustitte Prisman ja määrititte tietokannan URL-osoitteen.
Määrititte tietomallit tiedostossa schema.prisma.
Loitte Prisma Clientin.
Sovelsitte migraatiot skeeman synkronoimiseksi tietokannan kanssa.
Opitte alustamaan ja käyttämään PrismaClient-luokkaa.

Seuraavaksi tutustumme CRUD-operaatioiden suorittamiseen Prisman avulla!

Aloita maksutta

Opi TypeScript tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit: 22
Oppitunnit: 88

Aloita opiskelu maksutta Näytä koko kurssi

Usein kysytyt kysymykset

Onko oppitunti ”Prisma ORM:n määrittäminen” ilmainen?

Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa Next.js 15 -fullstack-kehitys (App Router + Server Actions)-oppimispolun 3 oppituntia, myös oppitunnin “Prisma ORM:n määrittäminen”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Next.js 15 -fullstack-kehitys (App Router + Server Actions)-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Prisma ORM:n määrittäminen”?

Määritä ja integroi Prisma ORM Next.js-projektiisi yhteyksien muodostamiseksi eri tietokantoihin Harjoittelet Next.js 15 -fullstack-kehitys (App Router + Server Actions)-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Next.js 15 -fullstack-kehitys (App Router + Server Actions)-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Next.js 15 -fullstack-kehitys (App Router + Server Actions)-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 1/4.

Kuinka kauan ”Prisma ORM:n määrittäminen”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Next.js 15 -fullstack-kehitys (App Router + Server Actions)-oppitunnilla?

Kyllä. Jokainen Next.js 15 -fullstack-kehitys (App Router + Server Actions)-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

Prisma ORM:n määrittäminen
CRUD Server Actions -toiminnoilla
Tietokannan skeeman migraatiot
Tietokannan alustaminen ja yhteyksien poolaus

← Takaisin: Next.js 15 -fullstack-kehitys (App Router + Server Actions)