Kutter støtten for AngularJS: - Får håpe de har migrert seg vekk

Slutt for første versjon av Angular, triks for å leve med stilfossen i CSS og vanskelig overgang fra Styled Components til Emotion.

AngularJS blir ikke lenger støtta. 📸: Blake Connally / Unplash
AngularJS blir ikke lenger støtta. 📸: Blake Connally / Unplash Vis mer

Dette var uken for kreative broderier 🪡, irriterende underholdende spill 🕹, og tog som snakker sanninga 🚂. Og 022 022 ting skjedde i frontend-verdenen!

Takk for nå, AngularJS

Angular 1.0. Det var et av de første frontendrammeverkene jeg hørte om. Jeg brukte det ikke selv egentlig, men jeg hørte både lovord og banneord om det fra MOD-prosjektet til NAV (for de som husker det). Som regel hørte jeg noe á la:

"Wow dette var jo kjempefint! Dødslett å komme i gang jo! Og wow kult dependency injection, det kan jeg jo fra Java! Og $scope da, mmm…"

Ofte fulgt, et par måneder etter av:

"Angular er seriøst det mest bakvendte, bedritne tulleproduktet jeg har vært borti. Hvorfor vil vi ha noe fra Java-land i frontend-land? Og $scope? $scope kan seriøst dra til helv…"

Jeg overdriver litt. Litt. Men det var ofte en smule dårlig stemning, det var det.

Etter en stund kom Angular 2, som på mange måter var et helt nytt rammeverk. Og så Angular 3, 4, 5, 6… nå er vi på 13 tror jeg, og Angular har ordna opp i de aller fleste barnesykdommene sine. Det er haugevis av organisasjoner rundt om i verden, Norge inkludert, som sverger til dette Google-sponsa rammeverket for hele sin infrastruktur.

Vi får håpe de har migrert seg vekk fra Angular 1 (også kalt AngularJS, red. adm.), da, for 11. januar meldte Angular-teamet at de ikke lenger kommer til å komme med oppdateringer for den såkalte LTS (long term support)-branchen til Angular 1. Det betyr ingen flere bugfixes, ingen flere tilbakeførte features, og ikke noe mer nyutvikling. Og i all realitet — en god unnskyldning for alle eksisterende Angular 1-applikasjoner å ta investeringen det er å skrive seg vekk fra det nå usupporterte rammeverket.

Takk for nå, AngularJS! 👋

«Hvis dette var helt ukjent for deg — så trøst deg med at det var like ukjent for meg.»

Kontroller stilfossen!

CSS er jo basically en norsk oppfinnelse. Og selv om Håkon Wium Lie har falt litt i kurs sånn mediamessig, så er han jo fortsatt en nasjonalskatt. Litt som fossene våre. Så la oss droppe uttrykket cascading style sheets, og adoptere stilfosser! Jepp. Tidenes sidespor det der. Sorry.

CSS er, som mange lesere sikkert vet, basert på at stiler skal “cascade” på toppen av hverandre. Du kan spesifisere at alle elementer har svart tekst, bortsett fra inni “kontrast-bokser”, som har hvit tekst, bortsett fra når det er tekst inni tags, da skal det være rosa. En evig rekke av stiler som overskriver hverandre. Som regel skrevet i riktig rekkefølge, som eksemplet ovenfor.

I teorien, og i praksis på tidlige websider, så ga jo denne flommen av stiler ganske mye mening. Men etterhvert som vi begynte å lage apper, hente inn stilark litt etter litt, og flytte oss over til en mer bibliotek- og komponentbasert arkitektur, så støtte man på flere og flere kinkige problemer med denne modellen.

Dette har ført til at mange har prøvd å unngå hele stilfossen — gjennom konsepter om BEM eller CSS Modules, for eksempel.

Heldigvis finnes det nå bedre primitiver i CSS, som gjør at vi faktisk kan bruke denne stilfossen, på tross av dagens krav til dynamiske, komponentbaserte stiler. Nå kan du for eksempel bruke :where eller :is til å spesifisere hvor spesifikke eksterne stiler skal være i forhold til dine egne!

Hvis dette var helt ukjent for deg — så trøst deg med at det var like ukjent for meg, frem til jeg leste denne artikkelen!

I denne artikkelen får du en grundig innføring i hvordan du kan holde deg til de grunnleggende konseptene i CSS, mens du utvikler solide, skalerbare, moderne applikasjoner for webben!

Fra Styled Components til Emotion

Jeg jobber for tiden med et komponentbibliotek for Vy (dere kan følge fremgangen her, om det er interessant), og baserer det på mitt favoritt-bibliotek for tiden – Chakra UI. Chakra UI baserer seg på Emotion, som visstnok er hakket bedre enn utfordreren Styled Components — selv om både Styled Components og Emotion basically har samme API.

Grunnen til at jeg tar det opp er at Vy har endel apper som baserer seg på Styled Components, og å ha et komponentbibliotek som baserer seg på Emotion i grunn, hadde vært en smule smør på flesk, sånn avhengighetsmessig i alle fall.

Men siden SC og E (det de kalles blant venner) har samme offentlige API, regnet jeg med at migrering fra A til B (eller SC til E, om du vil) kom til å bli en search-replace lek. Derfor ble jeg veldig lei meg da jeg kom over denne artikkelen fra Storybook, som gjorde nettopp samme øvelsen. For å ikke ødelegge noe underveis, endte de opp med å leie inn Emotion-oppfinnern.

La oss håpe vi ikke trenger å gå så langt. Uansett — dette var en veldig fin artikkel om hvordan visuelle tester hjalp til med å verifisere endringen de gjorde underveis. Takk for at de delte!

Det var det jeg hadde for dere denne uken. Takk for at dere leste — og tusen takk til Caroline Odden som holder i denne fantastiske serien uke etter uke. Sleng henne en takk på Twitter, Slack eller hvor enn du treffer på henne!