22 nyttige React-verktøy

ForrigeUke: React 16.9, Hooks i Apollo Client, vanlige Hooks-feil og nyttige React-verktøy.

📸: Jia Ye / Unsplash
📸: Jia Ye / Unsplash Vis mer

Dette var uka mennesker plantet liv på månen 👽, nye vasebaserte argumenter mot et bilfritt Oslo ble brukt 🏺, og create-react-app 3.1.0 ble sluppet 🎉.

Og 1368 ting skjedde i React-verdenen!

Ny minor-release av React

React-teamet annonserer utgivelsen av React 16.9 på deres offisielle blogg, hvor de også går gjennom features og bugfikser i den nye utgivelsen. Her er det hovedsaklig snakk om mindre endringer som f.eks. støtte for asynkron kode i act() og programmatisk ytelsesmåling med <React.Profiler>.

Ved siden av ny minor-release oppdaterer de samtidig veikartet for React i 2019. Etterarbeidet i sammenheng med utgivelsen av Hooks har vist seg å være mer tidkrevende enn React-teamet på forhånd antok det kom til å bli, og utgivelsen av Concurrent Mode og Suspense for henting av data har derfor blitt forskjøvet. Teamet ønsker ikke å komme med noen konkret slippdato i frykt for å ikke kunne møte en ny deadline, men sier de forventer å gi oss opt-in-støtte for disse funksjonene i en minor-release senere i år.

Apollo Client får offisiell støtte for Hooks

Teamet bak en av de mest populære open source GraphQL-klientene, Apollo Client, annonserer at de nå har offisiell støtte for Hooks. Støtten består til å begynne med av tre nye hooks: useQuery, useMutation, og useSubscription.

Samtidig introduserer teamet en modulær pakkestruktur som lar deg håndplukke kun de delene av Apollo Client du er interessert i for å kutte ned på bundle-størrelsen din. Om du bare er interessert i Hooks kan du installere @apollo/react-hooks som gir ca. 50% mindre bundlestørrelse sammenlignet med om du bruker paraplypakken react-apollo, som i tillegg til de nye hookene inneholder Query-, Mutation-, og Subscription-komponentene og graphql()-funksjonen som lar deg lage høyere ordens komponenter som kan utføre GraphQL-spørringer.

Ukas React-podcast

Mens vi er inne på GraphQL kan vi nevne at ukas React Podcast gjestes av Eve Porcello som snakker om GraphQL og hvordan man kan begynne å bruke det på egne prosjekter. Er du GraphQL-nybegynner kan du jo høre på podkasten og jobbe deg gjennom Apollos nybegynner-tutorial før du setter i gang med de ferske hookene som nettopp ble introdusert.

Unngå vanlige Hooks-feiltrinn

React-guru Kent C. Dodds skrev denne uka nytt blogginlegg hvor han prøver å hjelpe deg med å unngå noen vanlige feiltrinn man møter på når man skriver React-komponenter med Hooks. Disse tipsene er nyttige både om du er helt fersk når det kommer til Hooks eller om du allerede har mange custom hooks under beltet.

Det første tipset er kanskje det viktigste, for det går nemlig ut på at du bør jobbe med Hooks først etter at du har opparbeidet deg en solid forståelse for hvordan det hele henger sammen. Dodds anbefaler blant annet at du leser den offisielle dokumentasjonen (som forøvrig er veldig bra) og ser på talken til React-teamet der de introduserte Hooks (som også er helt nydelig):

22 nyttige React-verktøy

Sommerferien er over for de fleste i år, og for å gjøre overgangen tilbake til hverdagen lettere har Medium-bruker @jsmanifest samlet en liste med smarte verktøy du kan bruke i React-prosjektene dine.

Det er fint å se både nyttige kjenninger som CodeSandbox, react-testing-library og webpack-bundle-analyzer inkludert i listen, i tillegg til for meg ukjente innslag som Storybook, som er et smidig verktøy for å kunne utvikle komponenter i isolasjon, eller Bit, som er et open source komponentbibliotek med tusenvis av React-komponenter tilgjengelig for kommersiell og privat bruk.

Det var det vi hadde denne uka. Vi ses neste uke!