Dette var uken jeg løste produktivitet for utviklere 📈, nye lekkasjer fra Next 14 🙈 og Dan Abramov kaster brannfakler 🔥.
Og 242 023 ting skjedde i frontend-verdenen!
Hils på Panda CSS 🐼
Jeg har alltid vært fan av Chakra UI. Det er enkelt å komme i gang med, har de fleste komponentene du trenger, og er enkelt å tilpasse via temaer og fargemoduser. Men det har noen nedsider. Det er stort og tungt, det avhenger av Emotion (som er litt gammeldags, er det ikke?) og ikke minst — fungerer skikkelig dårlig med React Server Components.
Så hvorfor liker jeg det fortsatt? Vel, mens vi har sittet her og klaget, har Chakra-sjef og gladfis Segun Adebayo brettet opp ermene for å lage noe som fungerer mye, mye bedre:
Panda CSS er et CSS-in-JS-rammeverk som genererer statiske stiler build-time – så det ikke trenger å sende en full CSS-in-JS-motor til klientene.
Denne gjør det enklere å rappe kode: - Utrolig nyttig!
Du kan fortsatt bruke såkalte style props (<Box marginTop={2} />, for eksempel), og skrive koden din som du gjør i Chakra UI. Du får riktignok ingen ferdige komponenter ut av boksen med Panda, men det gjør det enkelt nok å style dine egne.
Segun har også nevnt at det er på planen for Chakra UI å migrere over til Panda CSS, slik at du kan bruke Chakra i applikasjoner som bruker React Server Components.
Alt er åpenbart ganske nytt og ikke klart for å skrive om appen din i enda, men det virker som en veldig fin løsning for en vanskelig teknisk utfordring. Les mer på hjemmesiden deres!
Vercel slipper ny AI SDK og template 🤖
Okei, jeg vet vi holder oss unna AI-ting her i ForrigeUke, men denne var såpass interessant at jeg snikern inn allikevel.
Vår alles favoritt-trekantselskap Vercel har nemlig sluppet en snasen liten SDK, som gjør det helt fantastisk enkelt å lage chat-baserte AI-applikasjoner i nettleseren.
Google advarer egne utviklere mot Bard
Dette kan være grunnlaget for mang en morsom POC på landets mange kontorer, og som kan hjelpe med å løse faktiske brukerbehov på null komma niks.
Du kan tilogmed streame responsen, som gjør det å lage en ChatGPT klone til, om ikke en lek, et ikke like skummelt eksperiment som man skulle tro.
Sjekk ut eksempel-appen deres her.
Dybdebaserte blur-effekter med CSS
Shu på Next.js teamet er ikke bare en rakker på React-greier — han kan også en ting eller tretten om CSS.
Forrige uke så delte han nemlig en skikkelig kul demo der han viser frem hvordan man kan lage en dybdebasert blur-effekt med ren CSS, og hvor kult det kan se ut:
Depth-based blur in CSS.https://t.co/kB7gFdbh5k (Chrome preferred) pic.twitter.com/W3RPVgh799
— Shu (@shuding_) June 18, 2023
Jeg er litt usikker på hva man skulle brukt det til, men jeg tipper det trigger noen kreative idéer rundt om hos folk.
MDX ute i versjon 2.0
Hvis du har skrevet en React-basert blogg de siste par årene, har du kanskje vært borti MDX. MDX er en extension til Markdown-formatet, som lar deg skrive JSX for å rendre forskjellige komponenter mellom det vanlige innholdet.
MDX har vært utrolig nyttig for veldig mange, og i forrige uke kom det nemlig en helt ny major versjon, som inneholder en rekke nye features, raskere kompilering, mindre bundle size og full React Server Components-støtte. Også er alt TypeScript da!
Og det var det vi kom over denne uken! Ikke dårlig bare det, gitt at hele Reddit var nede denne uken! Tusen takk for at du tok turen innom, og velkommen tilbake neste uke ❤
