<ForrigeUke uke=”50” år=”2024” />

Thank you, Next 🎵

Next.js har kommet med ny minor-versjon! Denne gangen kan de friste med støtte for React 19, bedre feilmeldinger, et nytt API, after, for å eksekvere kode etter response har blitt sendt, og ikke minst noen etterlengtede eksperimentelle funksjoner for autoriseringskontroll.

Særlig autoriseringskontrollen er et kjærkomment tilskudd for meg. Endelig blir det (snart) like enkelt å håndtere egne visninger for 401 Unauthorized og 403 Forbidden som det allerede er for 404 Not Found.

Next.js 15.1

Position absolute? Bruk heller CSS Grid-stabler!

Har du prøvd å lage en knapp som skal vise en alternativ tekst eller ikon når den går inn i “lastemodus”? Da har du sikkert oppdaget hvor vanskelig det kan være å få knappen til å beholde nøyaktig samme størrelse i overgangen mellom lasting og ikke lasting. Hvorfor skal dette være så vanskelig?

Wes Bos viser frem hvor enkelt det kan løses ved å bruke CSS Grids. Her viser han frem hvordan du bare kan sette spinneren og teksten til samme grid-area. Da stables de bare oppå hverandre. Og med litt visibility: hidden pepret inn så er du ferdig på et blunk. Dette var et snedig triks som jeg i hvert fall kommer til å ta i bruk fremover!

Ut med useEffect — Inn med Ref Callbacks

Dominik Dorfmeister, vedlikeholder av TanStack Query, skrev i 2022 om hvordan du kan unngå useEffect ved å bruke ref callbacks. Her viste han frem at du sannsynligvis kan slippe unna en del rotete useRef og useEffect ved å heller bare sende inn en funksjon til ref-feltet.

I lys av React 19 og den kommende React-kompilatoren har Dominik skrevet en oppfølgingsartikkel. Her viser han blant annet frem at vi ved å bruke den nye cleanup-funksjonen i ref callbacks greier å kvitte oss med enda flere useEffect-er!

Dette er definitivt noe jeg kommer til å bruke flittig fremover — kanskje det kan rydde opp i rotet ditt også?

Ref Callbacks, React 19 and the Compiler

Det var alt for denne gang. Ha en fin uke!