Dette var uken for en liten tidsreise 📺, hvor det var litt uenigheter på jobben 💼, og hvor bordet endelig snudde 🪑.
Og 237 ting skjedde i frontend-verdenen!
JavaScript og uforanderlige verdier
En av hovedelementene i React er at man ikke skal mutere objekter eller andre typer data, for man bør heller lage en kopi slik at React får med seg at noe er endret og oppdaterer komponentene riktig.
Uavhengig av React og kravet om uforanderlige verdier har Josh W. Comeau hatt fokus på hva som skjer når man prøver å mutere verdier opprettet i JavaScript med const:
The `const` keyword in JavaScript is used to create a constant. Many of us learn that a constant is a variable that can't change.
— Josh W. Comeau (@JoshWComeau) April 24, 2023
And yet, when applied to an object or array, we *can* make changes to it!
Let's dig into this. 🧵 pic.twitter.com/DOnBD3ZaHd
Videre har han skrevet en fin artikkel som forklarer forskjellen mellom mutation og assigment, les mer om det her.
Scoped CSS
Keith J. Grant er en stor tilhenger av Scoped CSS, og det har han vært i flere år.
Scoped CSS lar deg begrense stilingen din innenfor en komponent i applikasjonen din uten å bekymre deg for navnekræsj eller at ting skal blø nedover til komponenter som ikke skal ha den stilinga.
W3C sin kravspesifikasjon av Scoped CSS er nå ganske stabil og Chrome har til og med en prototype på dette. Hvordan kommer dette til å se ut spør du? Se på eksempelet under:
@scope (.container) {
:scope {
color: hotpink;
}
}
Jeg syns dette ser veldig lovende ut! Les mer om det her.
Ny Chakra versjon rundt hjørnet
Neste versjon av Chakra kommer med spesielt to fine ting!
Det ene er en flunkende ny Stepper komponent med et ganske brukbart API. Det andre er som kommer er støtte for nøstete semantiske tokens, som gjør at du kan slette mye unødvendig duplikat kode:
Here's what the nested semantic token support looks like: pic.twitter.com/FI9hvGoFLX
— Sage ⚡️ (@thesegunadebayo) April 25, 2023
Oversette React docs
Visste du at det finnes en side med oversikt over hvilke språk som dokumentasjonen til React er oversatt til?
På translations.react.dev ser du hvor mange prosent av react.dev som er oversatt til ulike språk, og dette er arbeid som er gjort at folk i React-samfunnet! Foreløpig er det påbegynt oversettelse til 27 forskjellige språk.
Er det kanskje du som har lyst til å oversette dokumentasjonen til norsk? 🤩
Litt inspirasjon til slutt
Helt til slutt legger jeg ved en lenke til en kodesnutt for en nettside med ganske kul animasjon! Ved å bruke komponenter fra lamina, har han implementert en ganske kul forvrengning på en enkel nettside. Nettsiden ser rett og slett levende ut!
Sjekk ut koden da vel, kanskje du kan bli inspirert til å lage noe annet kult basert på dette?
Det var alt for denne gang! 👩💻