React

Context

Reacts inbyggda mekanism för att dela data genom ett komponentträd utan att skicka props i varje led.

Props kan bara skickas till direkta barnkomponenter — för att nå ett djupt nästlat barn måste du kedja props genom alla mellanliggande komponenter, kallat prop drilling. Context löser det: du skapar en context med createContext, omsluter trädet med en Provider som anger ett värde, och alla barnkomponenter kan läsa värdet direkt via useContext.

Context passar för global data som tema, inloggad användare eller språkinställning. Det är inte ett universalverktyg för all state — lokal state med useState är bättre för data som bara ett fåtal komponenter bryr sig om.

För komplex state-logik kombineras Context ofta med useReducer, eller ersätts av ett externt state-bibliotek som Zustand eller Jotai. I Next.js App Router kan server components läsa data direkt utan Context — Context behövs bara för klientstate.