NestJS-API-er for virksomhetsbackend · leksjon

Oppsett av NestJS GraphQL

Konfigurer NestJS til å tilby et GraphQL-API, og velg mellom code-first- og schema-first-tilnærminger.

Leksjon 2 av 312 trinn

Oppsett av NestJS GraphQL er en gratis leksjon i NestJS-API-er for virksomhetsbackend på CoddyKit. Dette er leksjon 2 av 3. Du kan lese hele leksjonen gratis nedenfor – og deretter øve praktisk i nettleseren med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i NestJS-API-er for virksomhetsbackend, og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i NestJS-API-er for virksomhetsbackend inneholder totalt 3 leksjoner.

Velkommen til oppsett av GraphQL

Hei! I denne leksjonen lærer du hvordan du integrerer GraphQL i NestJS-applikasjonen din. Vi går gjennom de viktigste oppsettstrinnene og utforsker to hovedtilnærminger:

  • Skjema først: Definer API-et ved hjelp av GraphQL Schema Definition Language (SDL).
  • Kode først: Bygg skjemaet direkte fra TypeScript-klasser og dekoratorer.

Ved slutten av leksjonen kan du velge den beste tilnærmingen for prosjektet ditt og ha en grunnleggende GraphQL-server kjørende!

Installer GraphQL-avhengigheter

Før vi skriver kode, må vi installere de nødvendige pakkene. NestJS bruker @nestjs/graphql sammen med et underliggende GraphQL-bibliotek som Apollo.

Åpne terminalen og kjør følgende kommando for å legge til de nødvendige pakkene:

npm install @nestjs/graphql @nestjs/apollo graphql

graphql er selve GraphQL-biblioteket, mens @nestjs/apollo tilbyr integrasjon med Apollo-serveren.

Konfigurer GraphQLModule

Kjernen i GraphQL i NestJS er GraphQLModule. Du må importere den i rotmodulen (vanligvis AppModule) og konfigurere den. Her er et grunnleggende oppsett:

import { Module } from '@nestjs/common';
import { GraphQLModule } from '@nestjs/graphql';
import { ApolloDriver, ApolloDriverConfig } from '@nestjs/apollo';

@Module({
  imports: [
    GraphQLModule.forRoot<ApolloDriverConfig>({
      driver: ApolloDriver, // Use Apollo for GraphQL server
    }),
  ],
  controllers: [],
  providers: [],
})
export class AppModule {}

// main.ts (entry point for NestJS)
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
  console.log('GraphQL server ready on http://localhost:3000/graphql');
}
bootstrap();

Skjema først: Utform med SDL

Tilnærmingen skjema først betyr at du først definerer GraphQL-skjemaet ved hjelp av Schema Definition Language (SDL). Dette tilsvarer å lage en planskisse for API-et.

  • Du skriver typer, spørringer og mutasjoner i en .graphql- eller .gql-fil.
  • NestJS bruker deretter denne filen til å forstå API-strukturen din.
  • Senere kobler du disse skjemadefinisjonene til selve logikken for håndtering av data (resolvere).

Skjema først: Grunnleggende typeeksempel

La oss definere en enkel Author-type i en SDL-fil. Denne filen beskriver datastrukturen uten implementasjonsdetaljer foreløpig.

// src/graphql.schema.gql

type Author {
  id: ID!
  firstName: String
  lastName: String
}

type Query {
  authors: [Author!]!
  author(id: ID!): Author
}

Skjema først: Koble skjemaet til modulen

For at NestJS skal kjenne til SDL-filen, konfigurerer du GraphQLModule slik at den peker på filen. Dette forteller NestJS hvor skjemadefinisjonen ligger.

import { Module } from '@nestjs/common';
import { GraphQLModule } from '@nestjs/graphql';
import { ApolloDriver, ApolloDriverConfig } from '@nestjs/apollo';

@Module({
  imports: [
    GraphQLModule.forRoot<ApolloDriverConfig>({
      driver: ApolloDriver,
      typePaths: ['./**/*.gql'], // Tells NestJS where to find .gql files
    }),
  ],
  controllers: [],
  providers: [],
})
export class AppModule {}

// main.ts (entry point for NestJS)
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
  console.log('GraphQL server ready on http://localhost:3000/graphql');
}
bootstrap();

Kode først: TypeScript-magi

Tilnærmingen kode først bruker TypeScript-dekoratorer til å definere GraphQL-skjemaet. I stedet for å skrive SDL definerer du klasser som NestJS automatisk konverterer til et GraphQL-skjema.

  • Du bruker dekoratorer som @ObjectType() og @Field() på TypeScript-klassene dine.
  • Denne tilnærmingen gir sterk typesikkerhet og svært god IDE-støtte.
  • Den reduserer duplisering, siden TypeScript-typene dine definerer GraphQL-skjemaet direkte.

Kode først: Opprett en objekttype

Slik definerer du den samme Author-typen med tilnærmingen kode først. Legg merke til bruken av dekoratorene @ObjectType og @Field.

// src/authors/models/author.model.ts
import { Field, ID, ObjectType } from '@nestjs/graphql';

@ObjectType()
export class Author {
  @Field(type => ID) // Explicitly define GraphQL type
  id: number;

  @Field({ nullable: true }) // Field can be null
  firstName?: string;

  @Field({ nullable: true }) 
  lastName?: string;
}

Kode først: Generer skjemaet automatisk

Med tilnærmingen kode først genererer GraphQLModule automatisk skjemaet ved å søke gjennom prosjektet etter klasser som er dekorert med @ObjectType(), @InputType() og så videre.

Du trenger bare å angi hvor den genererte skjemafilen skal lagres (valgfritt, men nyttig for inspeksjon).

import { Module } from '@nestjs/common';
import { GraphQLModule } from '@nestjs/graphql';
import { ApolloDriver, ApolloDriverConfig } from '@nestjs/apollo';

@Module({
  imports: [
    GraphQLModule.forRoot<ApolloDriverConfig>({
      driver: ApolloDriver,
      autoSchemaFile: 'src/schema.gql', // Path to save the generated schema
      sortSchema: true, // Optional: keeps schema consistent
    }),
  ],
  controllers: [],
  providers: [],
})
export class AppModule {}

// main.ts (entry point for NestJS)
import { NestFactory } from '@nestjs/core';
import { AppModule } from './app.module';

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
  console.log('GraphQL server ready on http://localhost:3000/graphql');
}
bootstrap();

Skjema først kontra kode først

Begge tilnærmingene er gyldige, og valget avhenger ofte av teamets preferanser og prosjektets behov:

  • Skjema først: Egner seg godt til samarbeid om API-utforming. Skjemaet er den eneste sannhetskilden, noe som gjør det enkelt for frontend-team å begynne å bruke API-et tidlig.
  • Kode først: Foretrekkes av TypeScript-utviklere på grunn av sterk typesikkerhet, mindre kontekstbytte og mindre duplisering mellom skjema og kode. Det føles mer idiomatisk i NestJS.

NestJS støtter begge deler, slik at du kan velge det som fungerer best!

Test forståelsen din

La oss teste kunnskapene dine om å sette opp GraphQL i NestJS.

Oppsummering av leksjonen

Godt jobbet! Du har lært de grunnleggende trinnene for å sette opp et GraphQL-API i NestJS.

  • Vi installerte de nødvendige pakkene @nestjs/graphql og @nestjs/apollo.
  • Du så hvordan du integrerer og konfigurerer GraphQLModule i AppModule.
  • Vi utforsket både tilnærmingen skjema først (med SDL-filer) og tilnærmingen kode først (med TypeScript-dekoratorer).

Du har nå grunnlaget du trenger for å velge og implementere det GraphQL-oppsettet du foretrekker i NestJS!

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
20
Leksjoner
76

Ofte stilte spørsmål

Er leksjonen «Oppsett av NestJS GraphQL» gratis?

Ja – hele teksten i «Oppsett av NestJS GraphQL» er gratis å lese her på nettet. For å øve interaktivt med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt, og for å låse opp resten av NestJS-API-er for virksomhetsbackend-kurset, kan du oppgradere til CoddyKit PRO. Kurset i NestJS-API-er for virksomhetsbackend inneholder totalt 3 leksjoner.

Hva lærer jeg i «Oppsett av NestJS GraphQL»?

Konfigurer NestJS til å tilby et GraphQL-API, og velg mellom code-first- og schema-first-tilnærminger. Du øver på NestJS-API-er for virksomhetsbackend 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 NestJS-API-er for virksomhetsbackend?

Ingen tidligere erfaring er nødvendig. NestJS-API-er for virksomhetsbackend 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 2 av 3.

Hvor lang tid tar leksjonen «Oppsett av NestJS GraphQL»?

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 NestJS-API-er for virksomhetsbackend-leksjonen?

Ja. Alle NestJS-API-er for virksomhetsbackend-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. Grunnleggende GraphQL
  2. Oppsett av NestJS GraphQL
  3. Resolvere og abonnementer
← Tilbake til NestJS-API-er for virksomhetsbackend