tillbaka till startsidan

87. Konspirationsteorin mot CSS-in-JS

Lyssna på Spotify lyssna! Lyssna på iTunes

Vi behöver först börja med att be om ursäkt för Antons URUSLA ljud, det är helt hållet hans eget fel och han lovar bot och bättring till nästa avsnitt. Med det ur världen så snackar vi Tailwind, att C:et i CSS var ett misstag, om CSS-abstraktioner rör sig snabbare än JS-ramverk och Therése sur gammal tant-period. Dessutom en hel del om snackig kod, zeitgeist, att ta kontroll över ett trauma och mycket annat.

Om du gillar podden blir vi väldigt glada för en liten recension i iTunes eller en prenumeration på Spotify. Följ oss och säg hej på @asdfpodden på Instagram eller Twitter (Anton, Therése) <3

Länkar

Avsnittets skämt:

Vad heter den nya datingtjänsten för attraktiva utvecklare i ditt närområde?
Localhots3000
Inskickat av Johan
Skrapa här!!
Transkribering
Transkriberingen är gjord av nån "AI-grej". Du kan förbättra den genom att klicka precis här :)
00:00:00
Vad heter den nya versionen av datingtjänsten för attraktiva utvecklare i ditt närområde?
00:00:08
Ehh, jag har, det är något med local, men kör.
00:00:15
Localhots3000.
00:00:18
Ja, fan. Jag var ändå, jag var på G.
00:00:25
Det var du, det får jag säga. Jag vill också tacka Johan för det skämtet.
00:00:30
Ja, verkligen tack Johan. Alltså jag älskar att våra lyssnare fick en skämt.
00:00:34
Jag tycker det är mest av allt, ska jag säga, är det helt egoistiskt.
00:00:39
För jag kommer ju aldrig på ett skämt själv.
00:00:41
Då har jag också skämt som du inte har hört innan, som jag kan leverera.
00:00:45
Ja, men alltså grejen, anledningen till att jag jobbar för att komma på skämt
00:00:49
Det är för att jag är så korkad annars. Jag kan inte komma på... Jag fattar aldrig ordvitsar och grejer.
00:00:56
Så du vill vara den som levererar dem?
00:00:58
Ja, så det här är egentligen ett trauma som jag har vänt på.
00:01:02
[Skratt]
00:01:05
Ja, men det tycker jag är on brand.
00:01:08
Tagit kontroll över det, liksom. Alla barndomsminnen där jag kände mig som en idiot.
00:01:14
Exakt.
00:01:16
Välkomna hörni till ett nytt avsnitt av asdf.
00:01:19
Vi...
00:01:21
Vad sa vi? Det ska vara ett dramafritt avsnitt idag.
00:01:24
Ja men gud, inte med drama. Chilla lite.
00:01:27
Nej, vi skiter. Vi pausar dramaskrittet.
00:01:30
Vi återkommer. Det finns jättemycket drama att prata om.
00:01:32
Men vi tar det i framtida avsnitt.
00:01:34
Men du pratade om att du har faktiskt testat och kört Tailwind nu.
00:01:40
- Det har jag väldigt lite. Pitterpitterlite. - Tillräckligt mycket för att du ska bilda till själv en åsikt.
00:01:49
Ja. Ja. Jag har så mycket åsikter. Jag tänker att jag är en person som inte bryr mig så mycket.
00:02:01
Men när jag väl pratar om saker, fan vad jag låter. Fan vad bestämd jag låter. Jag vet inte vad det är som händer.
00:02:08
Jo, men man ska ha... Livet blir fan roligare med starka åsikter och kryddade historier.
00:02:13
Så man ska absolut, absolut, jag står helt bakom det.
00:02:16
Men jag tänker, vi har väl några lyssnare som inte hänger i webbsfären lika mycket som vi gör.
00:02:23
Så kan du bara, okej, om du skulle förklara Taylor Wynn, om du skulle pitcha Taylor Wynn för mig då?
00:02:27
Pitcha Taylor... Alltså, det är ett lite fräschare bootstrap.
00:02:33
[Skratt]
00:02:35
Absolut, bootstrap känner fan alla till ändå. Även om man skriver rust eller något annat skit.
00:02:42
Ja det är ju för fan webbhistoria eller?
00:02:44
Ja det tycker jag.
00:02:46
Nej men vad är Tailwind då? Det är ett ramverk för att styla din HTML.
00:02:53
Det kommer med färdig styling. Det är som ett lager ovanpå CSSen så du behöver aldrig peta på CSSen.
00:03:03
Det är väl det man brukar klassificera det som, om jag inte minns fel nu, är väl ""utility first"" eller något sånt där.
00:03:11
Utility based. Jag kommer inte ihåg vad termen är, men att det är ett utility ramverk.
00:03:17
Ja säkert.
00:03:19
Det det kommer med är väldigt väldigt små byggstenar.
00:03:24
För att bygga ihop sådana grejer.
00:03:26
Så att man typ istället för att skriva en style tagg eller ha ett CSS-dokument som man fyller i själv, så är det bara massa här klasser som man använder.
00:03:36
Ja.
00:03:38
A utility-first CSS framework.
00:03:42
Oj, oj, oj. Den där tog jag från minnet. Jag är lite stolt.
00:03:45
Bra minne.
00:03:47
Eller skäms lite, det beror på hur man ser på det.
00:03:49
Rapidly build modern websites without ever leaving your HTML.
00:03:55
Det är fortsättningen på att JSX kom för ett herrans massa år sedan.
00:04:02
Vi stoppade in HTML i JavaScripten och nu stoppar vi in CSS i HTML.
00:04:08
Men det har vi väl gjort förut?
00:04:13
Jo, fast inte riktigt. Det känns inte som att just de här gjorde till det förut.
00:04:18
Om man ska förklara vad det är, bara jättekort, ännu mer kortare.
00:04:22
Istället för att skriva ""style color blue"" finns det en klass som är ""text blue"" som sätter färgen blå.
00:04:36
Det finns någon typ av tokens där bakom att de har valt ut ett visst antal färger, eller vilken spacing man ska ha på de flesta grejerna.
00:04:46
Sätter man padding säger man ""p1"" och då blir det fyra pixlars padding åt alla håll.
00:04:51
Ja, och sen så kan du ju själv definiera, overridea eller extenda den stylingen som de redan har satt, för att få det mer till din egen personliga liknande.
00:05:03
Ja, jag tycker ju verkligen att din jämförelse med Bootstrap är ganska bra, för jag tycker att Tailwind har liksom...
00:05:11
Man kan nästan idag ändå se på en sajt om den är gjord med Tailwind.
00:05:17
Visst att det är lite fler färger, det är inte lika tydlig identitet som det var på Bootstrap.
00:05:26
Men just Tailwind gör ju att allting får samma spacing som i och för sig många andra använder ändå, som är väl 4 pixlar.
00:05:33
Jag vet inte, jag tycker att det finns någon känsla.
00:05:37
Sen är det väl kanske att Tailwind följer väl de trenderna som går just nu i hur man ska styla och designa saker.
00:05:45
Så det kan ju vara därför också.
00:05:47
Jo absolut, men bootstrap var ju verkligen så, du såg ju verkligen att personen hade använt bootstrap.
00:05:53
Så bootstraps färdiga knappar med färdiga färger och så här, även om du bytte färgen såg det exakt likadant ut.
00:06:00
Så ett tag så såg ju allt likadant ut.
00:06:02
Ja, verkligen.
00:06:05
Men ja, alltså jag vet inte, det känns konstigt för mig för att jag var aldrig riktigt så här,
00:06:12
Jag är inte 100% inne i Bootstrap, men så som jag förstått det så upplever jag det som ett förnyat, nerslimmat Bootstrap.
00:06:24
Jag vet inte om folk blir upprörda på att jag säger det, jag har ingen aning. Jag vet inte om folk har starka känslor för Tailwind.
00:06:30
Det känns verkligen som att folk har starka känslor för Tailwind.
00:06:34
I alla fall om man tittar på Twitter-X-crowden.
00:06:38
Det låter som att jag säger de som har varit på Twitter.
00:06:41
Fan vad jag hatar det här namnbytet.
00:06:43
Jag kommer fortsätta säga Twitter till folk som inte fattar längre.
00:06:46
På Twitter känns det som att folk har starka känslor om Tailwind i alla fall.
00:06:50
Är folk kvar på X?
00:06:53
Sluta säga X!
00:06:55
Nej, du vet det som när man tar filmtitlar och byter ut ett ord till typ...
00:07:00
Jag vet inte, bajskorv?
00:07:02
Jaha, absolut.
00:07:04
[skratt]
00:07:06
Nej men, folk är väl kvar. Jag hänger där extremt sällan.
00:07:11
Men det känns som att Tailwind har varit en av grejerna där folk verkligen står långt ifrån varandra.
00:07:20
Alltså att du antingen hatar det eller älskar det för att vara lite klischig.
00:07:24
Och det är ganska ofta starka känslor.
00:07:27
Jag kommer inte ihåg vilka det är som har gjort det här nu, men en heter Steve Sugar tror jag.
00:07:33
Och jag kommer ihåg det här för att han skrev någon bok som jag tyckte var väldigt bra som heter ""Restructuring AI"".
00:07:40
Som var typ såhär ""här är tips och tricks för hur du får ett GUI att se snyggt ut"".
00:07:45
Och jag vet att bland annat han och den här andra personen som ligger bakom Tailwind, som jag inte kommer ihåg vad han heter.
00:07:51
Deras kommentarsfält är ""hot garbage"" ganska ofta.
00:07:58
- Vad härligt.
00:08:00
Jag förstår sällan hur man kan ha så starka känslor kring det.
00:08:08
- Ja, men ändå sitter det här.
00:08:11
- Har jag starka känslor? Låter jag mycket?
00:08:16
Eller har jag starka känslor? De är ju inte nödvändigtvis korrelerade.
00:08:20
Nej, absolut. Så är det faktiskt.
00:08:22
Men okej, vad tycker du om Tailwind då? Nu när du har kört ett tag?
00:08:29
Jag har verkligen inte kört ett tag. Jag har inte sagt att jag skrapat på ytan.
00:08:32
Jag har typ fått det att funka i projektet och gjort en komponent.
00:08:36
Det är det jag har gjort. Varför?
00:08:38
Det är kört ett tag.
00:08:40
Jo, men varför? Jo, för att liksom evaluera om det är någonting som man vill dra in i ett komponentbibliotek.
00:08:47
Jag tycker så här, jag förstår poängen, tycker inte det är rätt för kanske en organisation där man har uppdelat att man har både frontend och backend.
00:09:11
Jag förstår inte tror jag varför en organisation som har frontändare som bygger klientwebben ska använda sig av Tailwind.
00:09:25
För att jag tycker bara att man lägger på något nytt som man måste lära sig.
00:09:30
Om alla redan kan CSS så lägger vi här på att man måste lära sig alla klasserna.
00:09:35
Man måste lära sig ramverket för att kunna använda det.
00:09:38
Det tycker jag är en onödig abstraktion i det här fallet.
00:09:41
För att jag tycker det var fruktansvärt jävla snackigt att lägga det i en React-komponent.
00:09:48
Och här kan ju jag ha gjort fel.
00:09:50
Men jag fick det inte att funka utan att explicit lista alla klasser som jag eventuellt ville använda.
00:09:58
Och sen använda logik för att bestämma om de skulle läggas till eller inte.
00:10:03
Jag fick inte dynamiskt skapa upp klassnamn. Det funkade inte.
00:10:07
så tycker du att det var otroligt jävla verbost.
00:10:09
Ja, det där är väl min erfarenhet också.
00:10:17
Jag har använt yttre flit och jag har testat det i ett hobbyprojekt eller sidoprojekt.
00:10:21
Vad tycker du?
00:10:23
Jag har varit väldigt anti-Tailwind.
00:10:29
Men jag har också varit väldigt för Style Components eller CSS i JS generellt.
00:10:36
Vilket verkligen är på väg ur tiden om man ska följa...
00:10:42
Vad är det man säger? Det är Kurskis sak? Nej det är något annat. Det är en jävla YouTube-kanal va?
00:10:47
Alltså, Zeitgeisten. Det är det det heter.
00:10:50
Men är det här foliehats-grejen?
00:10:55
Foliehats-grejen? Förklara det själv.
00:10:58
Det är konspirationsteorin att Vercel är super inne på Tailwind och vill att alla ska använda Tailwind.
00:11:08
Så att de lobbyar för att ingen ska använda CSS i JS så de löser inte problemen med att kunna använda det i Next.
00:11:18
Det här är en konspirationsteori jag ställer mig bakom.
00:11:23
(skratt)
00:11:26
Man kanske inte kallar det konspirationsteorin, man ställer sig bakom saker i och för sig.
00:11:31
Det är bara att ta fram aluminiumfålet och linnen hatt bara och ställ dig.
00:11:37
Exakt.
00:11:38
Det man skulle säga att Sitegeisten pratar om,
00:11:45
Jag tror att just nu är det väldigt inne...
00:11:49
Det är så jävla mycket saker som är inne. Det är inne att hata på React, det är inne att hata på allt möjligt.
00:11:53
Men just nu är det väldigt inne att React Server Components stödjer inte Style Components eller Emotion, eller vilket nu man vill köra.
00:12:02
Och därför helt plötsligt så är CSS i JS. Man ska släppa det, det är över.
00:12:06
Jag tycker fortfarande att det är det sättet som gjort mig mest produktiv med CSS någonsin.
00:12:13
För att det löser vissa problem som jag tycker CSS har.
00:12:18
Det var inte allt för länge sedan.
00:12:20
Kanske lite av ett hot take när jag sa att C i CSS, alltså Cascading, var ett misstag.
00:12:26
Men vi kanske inte behöver gå in på just den poängen just nu.
00:12:33
Det var också en extrem överdrift.
00:12:35
Men det jag vill komma till val är att just Style Components löser problemet med att skapa CSS väldigt enkelt
00:12:43
till en komponent, till exempel, vilket man oftast vill göra.
00:12:46
Eller att man vill göra något annat.
00:12:48
Och det är samma problem som Tailwind löser.
00:12:51
Till viss del eller delvis då.
00:12:53
Att en klass som du sätter på ett objekt, den kommer ju
00:12:57
den kommer ju kaskada, men det är väldigt tydligt vart
00:13:02
Den kaskader liksom, istället för att man har det någonstans.
00:13:05
Så på så sätt tycker jag att tv är ganska trevligt nu.
00:13:08
Och så fort man kommer in i att skriva det, och kommer ihåg vad klasserna heter.
00:13:13
Så är det ju väldigt trevligt.
00:13:15
Men, sen kommer man ju tillbaka till att ""Ah, nu har jag glömt bort, vad fan heter det här klassnamnet?""
00:13:19
""Jag har ingen aning."" Och så sitter man och försöker liksom chansa sig fram till det.
00:13:22
Jag tycker att typ deras, det finns väl något VS Code extension som ger en liksom auto-complete när man skriver klasserna.
00:13:28
Det funkar uruselt.
00:13:29
Vilket gör mig bara ännu mer irriterad.
00:13:31
Det är svårt att få en översikt.
00:13:34
Och som du säger, det blir väldigt snackigt i komponenterna man skriver.
00:13:40
-Fruktansvärt!
00:13:42
Alltså, fruktansvärt jävla snackigt!
00:13:44
-Ja, sen det finns väl... Jag har inte heller gått in så djupt i tailwind-träsket,
00:13:49
vilket det fan är ändå,
00:13:51
i att det finns en massa sätt som folk argumenterar för.
00:13:54
""Ja, men då kanske du skriver för stora komponenter.""
00:13:56
""Ja, men då kanske du ska använda en jävla apply-direktiv för att applicera flera klasser samtidigt som du...""
00:14:03
""Jag vet inte fan...""
00:14:04
Och det är så jävla mycket sådär, och då blir jag ju mindre sugen på Tailwind när folk pratar om det där.
00:14:09
För att det är liksom...
00:14:11
Jag vet inte, man blir så jävla bara...
00:14:13
Jag orkar liksom inte med att lägga på ett tillager på CSS också.
00:14:18
Det som jag tyckte var nice med Just Style Components eller CSS i JS
00:14:22
Där skrev du ju vanlig CSS, i alla fall i de fall jag gillar.
00:14:26
Det fanns ju objektnotationen också.
00:14:29
Men jag gillar ju att du använder template-strängar och sen så
00:14:32
transformeras det till vanlig CSS som är scopad.
00:14:36
Och jag tycker det var så...
00:14:37
Gud, jag kan sörja att det där inte funkar på nya sätt.
00:14:39
Sen kör jag det fortfarande, men...
00:14:41
Ja, alltså...
00:14:43
Så här, grejen är att jag förstår absolut varför det här vore bra att använda.
00:14:47
Kanske någonstans där du behöver få upp någonting snabbt
00:14:50
eller där du har personer som inte är så bevandrade i CSS.
00:14:55
För att det är ju ganska nice.
00:14:57
Det jag verkligen känner är ju att till exempel för mig,
00:15:01
jag ska inte säga att jag kan, jag är ju inte expert på CSS.
00:15:05
Men jag har jobbat mycket med CSS, jag kan CSS, jag kan grunderna som vi pratar om till viss del
00:15:10
som också tailwindar det som de försöker lösa.
00:15:13
Jag menar, de har ju inte de värsta specialhacken, det är inte det vi pratar om.
00:15:18
Det är en bra grund att jobba med CSS.
00:15:20
Så då blir det som för mig att istället för att bara använda mig av den kunskapen jag har kring det här
00:15:27
så måste jag lära mig hela det här nya ramverket som har jättemycket dokumentation och svåra namn.
00:15:34
Och sen vill jag då aligna det här med designsystemet, vilket jag också gjorde ett jobb för att sätta upp i tema,
00:15:42
Dra in konfiguren, definiera färger, definiera fontfamilj och fontstorlek och sådana grejer.
00:15:49
Då blir det också såhär, och det irriterade mig något enormt, för att jag ville ha en definierad färg på ett heading-element.
00:16:00
Och då är den alltid prefixad med text.
00:16:04
Så då blir det min såhär, text-heading-excel-color.
00:16:10
Och jag bara ""ÅÅÅÅH, vad störigt! Gud vad det störde mig!""
00:16:14
Jättelitet!
00:16:16
Det är väl nice att man kan dra upp de här grejerna, och
00:16:20
Style Components var också nice, men jag känner ju instinktivt att
00:16:23
""Okej, men här skulle jag ju föredra att använda en kombination av CSS-variabler, SAS-variabler och CSS-modules.""
00:16:33
Ja, man kommer ju väldigt långt på
00:16:39
Just CSS-variabler är ju extremt underutnyttjat.
00:16:42
Jag är väldigt inne på, för nu kör vi Material UI, vilket är en helt annan historia som alla borde undvika som pesten.
00:16:52
Men de använder ju Emotion under huvudet, som är ett CSS-slib.
00:16:58
Och det i sin tur har ju något temafil där man kan skicka in anonyma funktioner och få ut temat och allting sånt.
00:17:08
Där är jag väldigt inne på att vi inte bara ska byta allt det här till CSS-variabler istället.
00:17:14
För då behöver vi inte overheaden från att ha en massa JavaScript för att hämta ut temat.
00:17:22
Det kan ju lika gärna ligga som CSS-variabler.
00:17:24
Men det där hela grejen att det finns ska flöda ut i Movie-komponenterna.
00:17:30
Ja, jag vet. Jag vill ju revolverera Movie.
00:17:33
Alltså jag blir... åh...
00:17:35
- Ja, jag vet. - Jag blir tokig på det.
00:17:38
Jag blir tokig! Det är den sämsta jävla skiten.
00:17:41
- Alltså... ja. - Det är så jävla komplext också.
00:17:44
Du kan göra 500 miljoner komplexa saker om du går ner så djupt i muihålet.
00:17:49
- Åh... - Nej, jag tycker det är...
00:17:53
- ...skurigvällt. - Men, alltså CSS-variabler
00:17:56
funkar inte i mediaqueries. Det är det största jävla problemet vi har.
00:18:01
Alltså att du inte kan skriva över variablerna baserat på en media query?
00:18:06
Du kan inte använda variabler i media queries.
00:18:09
Vadå? Kan man inte? Du kan inte få värdet från en variabel i en media query?
00:18:14
Nej.
00:18:15
Det här kan inte stämma.
00:18:17
Alltså det var så senast jag...
00:18:21
Ett år sen.
00:18:23
Ja, ett år sen. Mindre än ett år sen.
00:18:25
CSS variables media queries. Jag googlar nu.
00:18:28
""Using variables in media query""
00:18:34
""Try this""
00:18:35
Det låter inte lovande.
00:18:37
Jag gav det ett ganska ordentligt försök, vill jag minnas.
00:18:43
Okej.
00:18:46
Jag hittar faktiskt bara exempel på att man sätter värdet på variablerna.
00:18:53
Inte att man använder dem.
00:18:55
Nej, jag vill ändå minnas att jag la tid på det här och hittade i slutsatsen att
00:19:04
nej, det går inte att använda CSS-variabler i Media Query-logiken.
00:19:09
Jag ser det.
00:19:13
Det är en jättelång artikel här om varför det inte funkar.
00:19:17
""Hope on the horizon for CSS environment variables""
00:19:23
Och sen är det massa Workarounds. Ah, ok, Workarounds var använd SAS.
00:19:29
Ehh, aha, det här var ju nytt för mig.
00:19:35
- Blev du lite ledsen nu? - Ja, nu tror jag inte lika mycket på...
00:19:39
Nu kör vi temat i JavaScript. Jag står för det här.
00:19:44
- Nu är du Movie All The Way. - Jag ändrar mig väldigt snabbt.
00:19:48
Fan, Movie är så jävla bra alltså.
00:19:50
Jag har inte sagt vad Mui är. Material UI, Googles React-komponentbibliotek.
00:19:56
De har färdiga React-komponenter.
00:19:59
Men även om man säger så är det förvidrande för folk som försöker sätta sig in.
00:20:03
För det finns Material UI, som är typ Mui X, eller Material UI Headless.
00:20:08
Alltså det är liksom en jävla röra.
00:20:10
Gokart?
00:20:12
Åh Gud, alltså.
00:20:14
Ska jag liksom bara ta en kväll och bryta ut allt MUI från jobbappan?
00:20:20
Kanske.
00:20:22
Kanske är det jobbigt ändå att sitta en hel kväll.
00:20:24
Men, eh.
00:20:26
Jaha, okej.
00:20:28
Du kommer inte köra vidare på Tailwind nu alltså?
00:20:30
Nej, men så här.
00:20:32
Det här var ju bara för att jag skulle lära mig lite om vad det är.
00:20:36
Införfattat beslut om jag tycker det är en bra idé att använda det.
00:20:38
Sen är absolut inte jag en egen person i det här utan jag vill bilda mig lite av en egen uppfattning.
00:20:44
Är det så att en organisation skulle bestämma sig för att de vill använda det så kommer jag inte motsätta mig det så länge det kommer argument för det som inte är det nya.
00:20:56
Det måste finnas bra use case för varför det är bättre att använda Tailwind.
00:21:06
För personligen i egna projekt tror jag inte att jag skulle använda det.
00:21:13
En anledning till att jag skulle använda det själv nu tror jag, det skulle vara för att jag skulle lära mig det för att det är det nya.
00:21:22
För att jag inte vill vara ""outside the loop"" liksom.
00:21:25
Men jag föredrar att skriva CSS framför det här.
00:21:31
Vill du använda det? Vad tänker du?
00:21:36
Nej, jag vet inte. Jag tycker så här, om jag inte ska köra Style Components
00:21:43
då kanske jag hamnar i Tailwind.
00:21:47
För att det är väldigt lätt att sätta upp.
00:21:51
Men jag förstår inte, CSS-modules är ju jättelätt.
00:21:56
Jo, men jag gillar ändå fortfarande att ha CSS väldigt, väldigt nära mina komponenter.
00:22:05
Alltså i samma fil.
00:22:06
CSS-modules, då måste jag ändå ha en CSS-fil som ligger där bredvid och stör.
00:22:10
Men Tailwind har ju ingen styling nära dig överhuvudtaget.
00:22:14
Och vad gör du om du behöver lägga till extra styling?
00:22:17
Extra styling? Som i?
00:22:19
Som i något specialhack och choose first child, varannat barn och vad det nu kan vara när man gör det.
00:22:26
Det finns ju lite sånt i Tailwind också, de har massa jätteobskura syntax.
00:22:32
Åh nej, alltså nej, nej, alltså varför, men varför?
00:22:38
Det finns ju, det är typ en klass, du prefixar den med liksom, vad fan är det typ, stjärna, krokodilmun, stjärna, eller jag vet inte.
00:22:45
Det går. Alla så här hoover-effekter, skriven på hoover framför och sen klassnamnet.
00:22:52
Det måste vara en jävla massa klassnamn totalt faktiskt när man tänker efter i Tailwind.
00:22:57
Med tanke på alla jävla kombinationer som finns och allt.
00:22:59
Ja, men jag förstår inte grejen. Du öppnar din IDE, du öppnar din komponent och så öppnar du stylingfilen och så lägger du den bredvid.
00:23:07
Jag ser noll...
00:23:10
Det är så skönt att vara alltid i samma fil.
00:23:13
Det är typ lättare än att du måste scrolla upp och ner i en fil. Du ser bara att det är samtidigt.
00:23:19
Jag upptäckte ju att man kan skriva i Tailwind typ så här...
00:23:25
...custom klasser. Alltså egna färger. Det kan bli overrides i.
00:23:31
Alltså som en klass. Jag fattar inte riktigt hur det går till. Jag antar att de kör nån post-processing på det.
00:23:36
Men om man skriver typ... Jag vet inte vad de heter.
00:23:39
""Color"", nej, kanske ""Text Black"" heter den i vanliga fall.
00:23:42
Då kan man byta ut ""Black"" mot typ så här
00:23:44
kantiga brackets och så skriver man en hex-kod för
00:23:50
en färg inuti och så bara funkar det.
00:23:52
Ja, just det. De stoppar in värdet istället.
00:23:54
Du kan göra likadant med pixelstorlekar och så, eller med liksom
00:23:58
storlekar, units och sånt också.
00:24:00
Exakt, och då kände jag att fan, det här, nu blir det lite bättre,
00:24:03
för nu behöver jag inte följa det jävla mallet.
00:24:05
- Ja, men fy fan! - Nu kan jag stoppa in vad jag vill överallt.
00:24:11
- Vad är klassnamn? - Men det är ju inte läsbart.
00:24:14
- Det är liksom inte läsbart. - Nej, det håller jag verkligen med om.
00:24:18
- Jag håller med dig, Kina. - Du skriver inte inline-style längre,
00:24:23
men du har typ 15 klasser där allt innehåller brackets.
00:24:26
Något special. Tryck till in hex-koder.
00:24:31
Ja, det var jättebra!
00:24:33
Ja, det är toppen!
00:24:35
Man kan inte hålla på hela tiden med att det ska vara så fint.
00:24:41
Jag vet inte, det var flexibelt. Det gillar jag.
00:24:46
Ja, det är ju hundra gånger lättare att läsa tre rader klassnamn i en sträng än det är att ha en CSS-fil bredvid den här filen.
00:24:55
Gud!
00:24:56
""Men då måste du sitta och hålla på och matcha, vad är det som hänger ihop med vad?""
00:25:00
""Vilket klassnamn har jag skrivit för det här?""
00:25:02
""Äh, det är inte...""
00:25:04
""C3 Modules, inte sålt, det är där vi landar på.""
00:25:07
""Tailwind, ganska bra, eller?""
00:25:09
[Skratt]
00:25:10
Alltså, den här vändningen som skedde i det här avsnittet, alltså...
00:25:14
Nej, men jag tror att...
00:25:17
Jag tror kanske att jag i vissa fall kommer att skriva ""Tailwind"".
00:25:20
Säkert på projekt som är kortlivade.
00:25:24
Alltså saker jag inte behöver underhålla så länge, då kommer jag kunna stoppa in Tailwind.
00:25:28
Typ för att slippa ha någon typ av CSS/JS-lösning.
00:25:32
Sen är det ju på G lite sådana lösningar också.
00:25:35
Jag tror att de som har gjort Chakra-UVI finns det ju någon som heter, va?
00:25:40
Som är typ som MUI, fast jag hade testat det.
00:25:45
Men det är garanterat bättre för att MUI suger.
00:25:48
Men de släppte ju någon...
00:25:52
Vad fan heter det? Någon...
00:25:54
Panda tror jag heter det.
00:25:58
Om jag inte minns fel.
00:26:01
Ganska säkert. Jag tror att det heter Panda.
00:26:04
Som är CSS i JS, fast det är liksom...
00:26:10
Vad ska man säga?
00:26:13
Det kompileras i byggsteget.
00:26:16
Så att den spottar ur sig. Det är liksom ingen runtime på det.
00:26:20
som det är på många andra CSS/JS-libbar.
00:26:27
Jag orkar inte ens tänka på vad allt det här betyder.
00:26:32
Det är som typer och styling, det är det värsta jag vet.
00:26:35
Är det runtime eller compile time?
00:26:39
Exakt. Jag hittade Panda CSS heter det i alla fall.
00:26:44
Ser att de använder väldigt modern CSS också.
00:26:47
Jag vet inte hur browsers ser ut.
00:26:49
De använder Cascade Layers.
00:26:52
Jag har ingen aning om det är ute ens i Chrome.
00:26:55
Men de andra browsersna.
00:26:57
- Men vadå? Compilerar de ner det till nån typ av gamm CSS?
00:27:03
- Nej, de kompilerar det till supermodern CSS.
00:27:06
- Jaha.
00:27:08
- Det som är grejen.
00:27:10
- Grejen är att jag verkligen förstår ljuscaset för det.
00:27:15
Men bygga små saker snabbt.
00:27:19
Bygga saker där du inte vill tänka så mycket på att sätta upp ett grid och aligna med ett designsystem.
00:27:27
Eller du hatar CSS och vill inte röra det men du vill ändå ha lite styling.
00:27:32
Eller du är en organisation där du inte har tid eller kapacitet att fokusera på det.
00:27:40
så att jag ser ljuscasen, men jag tycker kanske inte att det är rätt bara för att det är nytt och kul
00:27:47
eller populärt som med så mycket andra saker.
00:27:50
Nej, absolut.
00:27:54
Det kan jag verkligen hålla med om.
00:27:59
Jag tror att det är väldigt lätt när man är oerfaren att hamna i den strömmen av att man följer lite folk på Twitter och ser att de använder bara det här.
00:28:14
Fast i verkligheten så gör de inte det.
00:28:16
Eller då man följer bara en massa influencers vars jobb är att påverka folk att använda någon ny grej.
00:28:22
De jobbar på något coolt bolag som har släppt någon ny produkt.
00:28:25
På Twitter är ju sanningen ofta att 95% skriver aldrig applikationskod.
00:28:33
Folk sitter bara och tycker saker och gör saker.
00:28:36
Men i verkligheten så sitter majoriteten på gammal kod och underhåller den och gör inte nånting nytt.
00:28:45
Ja.
00:28:46
Men alltså jag tycker också det här, jag tycker det är lite spännande med sådär stylingbibliotek och grejer för det känns för mig nästan som att det rör sig hetsigare än vad JavaScript gör.
00:28:54
För jag tycker det har liksom ploppat upp och ploppat ner stylinggrejer som har dött innan de ens har levt.
00:29:01
Liksom.
00:29:02
Jag kommer ihåg att det var någon gång på en konferens som någon gick igenom sitt nya coola stylingbibliotek han höll på att bygga och sen hörde jag aldrig någonsin talas om det igen.
00:29:12
Och det var inte färdigt när han höll föreläsningen.
00:29:16
Ja, just det.
00:29:18
Som det här panda, om det är för fräscht, hur skulle vi kunna använda det nu?
00:29:23
Nej, det är väldigt sant. Jag skulle inte dra in det första jag gör på jobbet och säga ""här hörni, här har vi något som vi ska köra på"".
00:29:34
Är det ännu sugen?
00:29:36
Lite sugen, ja absolut. Men det beror ju inte så mycket på panda utan mer på muren, att det är så dåligt.
00:29:42
Ja.
00:29:43
Nej men jag vet inte vart jag ville komma med det här avsnittet eller nånting.
00:29:47
Men jag känner mig utanför tror jag.
00:29:49
Alla snackar om ""Tailwind"" och jag har inte orkat.
00:29:51
Jag var på väg en gång och så gjorde jag en träning och kollade lite på det.
00:29:55
Och så nu känner jag att jag har lite belägg för att vara en sur gammal tant.
00:30:00
Liksom.
00:30:01
Mer än vad jag hade förut.
00:30:03
Ja men vafan, det är väl härligt.
00:30:08
[Skratt]
00:30:11
Det är liksom en period i ditt liv jag har sett fram emot.
00:30:17
Att jag ska vara en sur gammal tant?
00:30:19
Ja, exakt. Jag tror att sur gammal tant Therese verkligen har något charmigt över sig.
00:30:27
Hahaha, det är också kul för att...
00:30:33
Nej, säg då.
00:30:35
Lyssna bara på det här avsnittet.
00:30:37
Nej, det är för fan.
00:30:39
Jo, Gud ja.
00:30:41
Nej, men alltså så här, grejen är att jag låter mycket och jag låter verkligen så säker på det.
00:30:47
Men om någon skulle komma med så här bra argument, då skulle jag ju vända kappen efter vinnaren.
00:30:51
Alltså jag är ju en följare, jag gör ju inte, jag har ingen egen åsikt, jag bara följer.
00:30:56
Och är rädd för att göra fel.
00:30:58
Så det är bara att övertala mig.
00:31:00
Jag bara har en högljudd stämma.
00:31:04
[Skratt]
00:31:06
Och den högljudda stämman får fan alltid tröttning.
00:31:09
För jävlar vad vi har gått över tiden.
00:31:11
Men vi säger så, så hörs vi om två veckor igen.
00:31:16
Just det, skicka in frågor om ni har några.
00:31:18
Finns på vår hemsida eller till vår Instagram.
00:31:20
Alltså det kommer komma svar på dem.
00:31:22
Jag vet att det inte känns som det.
00:31:24
- Det kommer komma svar på dem. - Ja, det finns en tanke bakom den här jävla chaten.
00:31:29
Men nu måste vi lägga ner, annars blir ni trötta på oss.
00:31:32
- Vi hörs om två veckor hörni. - Det gör vi. Ha det bra, hejdå!
00:31:35
- Bye bye!
00:31:36
[Musik spelas]
Tillbaka upp