Hoppa till huvudinnehållet
Version: 10.x

Next.js-integration

Inofficiell Beta-översättning

Denna sida har översatts av PageTurner AI (beta). Inte officiellt godkänd av projektet. Hittade du ett fel? Rapportera problem →

tRPC ❤️ Next.js

Next.js gör det enkelt att bygga klient och server tillsammans i en kodbas. tRPC gör det enkelt att dela typer mellan dem, vilket säkerställer typesäkerhet för din applikations datahämtning.

Vår Next.js-integration är byggd ovanpå vår React Query-integration med några Next.js-specifika API:er för att hantera både klientsidig och serversidig rendering.

När du använder Next.js-integrationen får du följande funktioner:

  • Server-side rendering - Du kan instruera tRPC att rendera dina sidor på servern och sedan hydrera dem på klienten. På så sätt undviker du ett initialt laddningstillstånd, även om tiden till första byte kommer att blockeras av servern. Läs mer om Server-side rendering.

  • Static site generation - Förhandshämta queries på servern och generera statiska HTML-filer som är redo att serveras. Läs mer om Static site generation.

  • Automatisk Provider-omslutning - @trpc/next tillhandahåller en högre ordningens komponent (HOC) som omsluter din app med nödvändiga providers så du slipper göra det manuellt.

tips

Om du använder tRPC i ett nytt projekt, överväg att använda något av exempelprojekten som referens: tRPC-exempelprojekt