Må alle prosjekter lage sitt eget komponent-bibliotek?

ForrigeUke: Myk React-intro, CSS-animasjoner med property, komponentbiblioteker, Vuex 4 og auto-ESLint.

Dette var uken for store oppdagelser 🥚, hvor universell utforming slår an 👀, og det å være litt sløv lønner seg 🔃.

Og 40 ting skjedde i frontend-verdenen!

Myk intro til React 🎨

Noen ganger så stresser man veldig med å gå fremover, at man alltid må bli mer og mer ekspert på React.

Hva med å ta et par steg tilbake og rett og slett lese en intro til React?

Linton Ye har skrevet en finfin introduksjon til React, som ikke krever at man må være utvikler for å lese. Ta en titt på den fine visuelle artikkelen da vel!

CSS-animasjoner med @property 🏠

Dette er en ganske ny feature som er på vei til en browser nær deg! Okei, kanskje ikke helt den optimale nettleserstøtten helt ennå, men det kommer seg!

Property er en måte å “typesjekke” CSS-variabelen din, og det kan animere og tilføre transisjoner basert på de verdiene. Det virker veldig kult!

Et lite kodeeksempel fra artikkelen, i tilfelle du ikke trykka deg inn på den 🤓:

@property --spinAngle {
  initial-value: 0deg;
  inherits: false;
  syntax: '<angle>';
}

@keyframes spin {
  to {
    --spinAngle: 360deg;
  }
}

.

Laget eget eller bruke andres komponentbibliotek?

Må alle prosjekter lage sitt eget komponent-bibliotek? Eller kan man gjenbruke andre sine prosjekter? ♻️

Vår kjente og kjære Kent C. Dodds har skrevet en artikkel om nettopp dette! 🙌

Det er kanskje litt unødvendig at alle prosjekter må lage sine egne knapper, kan man heller fokusere på det som faktisk er bedrift-kritisk? Å lage et komponent-bibliotek krever en del ressurser, og det er ikke noe skam i å gjenbruke andres gode håndverk!

Men det er jo gøy å skrive komponenten akkurat som man vil ha den, da..! 😎

«Kan sikkert ikke bli forvirrende at state-håndteringsbiblioteket alltid er off-by-one i versjonsnummeret.»

Vuex versjon 4

Må ikke blandes med Vue! Eller, det kan nok blandes litt, siden det er et state-håndteringsbibliotek for nettopp Vue.js apper.

Det ble utgitt en versjon 4.0.0 forrige uke, som nå støtter Vue.js versjon 3:

Kan sikkert ikke bli forvirrende at state-håndteringsbiblioteket alltid er off-by-one i versjonsnummeret 😈

Automatisk konfigurering av ESLint

Hvis du er litt lei av å måtte sette opp og konfigurere ESLint for et prosjekt, kan du ta en titt på eslint-config-auto.

Dette biblioteket vil sette opp de airbnb reglene basert på avhengighetene du har i din package.json.

Det var alt for denne gangen! Vi skrives en annen gang! 👩💻