Dette var uken hvor noen hadde en dårlig dag på byen 🕺, hvor forskjellen på utvikler og manager ble bevist 🔥, og hvor en president ikke alltid trenger kontekst 👴🏻.
Og 1.112 andre ting skjedde i frontend-verdenen!
React Router docs
React Router er et ganske vanlig routing-bibliotek som kan brukes i alle React-applikasjoner (også React Native 🤘).
Derfor er det så fint når utviklere bruker tid på å skrive og vedlikeholde dokumentasjonen! Nettsiden til React Router har fått seg et fint løft, og gjør det enkelt å finne dokumentasjon til versjonen av React Router du bruker.
Launched the new React Router docs recently
— Ryan Florence (@ryanflorence) September 1, 2022
Docs/versions are fresh within 5 minutes of what's in the GitHub repo. No rebuilds, no redeploys
- 14M requests/month
- 94% CDN Cache Hits
- 280ms Cache Miss Latency
- 💯 PageSpeed with Slow 4G, Moto G4
Cache-Control, still great 😁 pic.twitter.com/RVXC7ei7PD
Sjekk ut siden her.
Conditional Rendering
Conditional rendering er noe man ikke kommer utenom i typiske React-applikasjoner.
Jeg syns ofte conditional rendering kan gjøre at koden ser ganske rotete ut, og har egentlig ikke funnet en praksis jeg er veldig fornøyd med. På prosjektet jeg jobber i bruker vi jsx-control-statements i et forsøk på å få det til, men det kan også bli mye rot med When og If overalt.
David K. på Twitter kom med et ganske interessant tips jeg har lyst til å prøve ut: Det er å mappe en komponent basert på enum-verdier, i stedet for å ha store og stygge switch-er i koden.
Sjekk det ut her da vel. 👇
⚛️ React tip: when conditionally rendering component based on some string enum (like a role), use an object to map enum values to components.
— David K. 🎹 (@DavidKPiano) August 31, 2022
This can be cleaner than using conditional operators, and it keeps the logic organized & clear. pic.twitter.com/hWX7WSNbmc
Ber utviklere være bevisst på dark patterns: - Lag et mindre manipulerende internett!
Litt TypeScript
TypeScript er et must-have i enhver frontend-applikasjon (jepp, jeg sa det!🔥), og dette biblioteket er veldig kraftfullt.
På Twitter kommer Brandon med litt erfaring hvor man kan se på typesystemet som et programmeringsspråk, som jeg syns var en fin vinkling:
The pivotal moment of transitioning from intermediate to advanced @typescript was realizing the type system is a programming language in itself, w/ variables, functions, conditionals, & loops.
— Brandon 🚀 Flightcontrol (@flybayer) August 31, 2022
Utility types like Required, Record, Pick, Omit are all built with these primitives. pic.twitter.com/twSwSv79Fh
Josh Branchaud har også delt sin erfaring på Twitter, og viser en snedig case hvor typeof gir deg ulikt svar avhengig om du bruker let eller const som kan være ganske forvirrende (selv om man aldri skal bruke let 🔥).
Kan anbefale å sjekke ut denne Twitter-tråden:
TypeScript thing that surprised me today.
— ✨ Josh Branchaud 🕺🏼 (@jbrancha) September 2, 2022
Defining a type with `typeof` has different results for a variable defined with `const` versus a variable defined with `let`.
Where do I find documentation that explains this? Initial searches aren't turning up anything. pic.twitter.com/WOOvTPbOb4
Vue Telescope + Vue 3
Vue Telescope er et bibliotek som lar deg finne ut av hva slags teknologi og plugins som blir brukt på en side.
Denne nettsiden har fått litt kjærlighet med Vue3 og diverse andre fine oppgraderinger:
Vue Telescope is now powered by:
— Vue Telescope (@VueTelescope) August 31, 2022
- Vue 3 with Composition API ✨
- Nuxt 3 🚀
- Nuxt Content 2 ✍️
- Tailwind 3 🎨
- Typescript 🤖
- Motion One 🪩https://t.co/KGMt8KESW8
Jeg syns det ser ut som en veldig kul extension, sjekk ut kildekoden her.
Utfordringer i React 🧠
På React sin nye dokumentasjonsside (som er i beta) har Dan Abramov laget noen oppgaver, og forrige uke la han ut enda en ny utfordring du kan kose deg med!
Sjekk ut utfordringen her:
added challenges! https://t.co/0w8w8vYNqi
— дэн (@dan_abramov) September 2, 2022
Det var alt for denne uken, vi sees! 👩💻