<ForrigeUke uke=“13” år=“2024” />
Dette var uken for teknologisk nedtur📉, domfellelse av en kryptogründer🧑⚖️ og en nyfødt programvareutvikler🤖 — og 1843 ting skjedde i frontend-verdenen!
<ForrigeUke /> er en artikkelserie som oppsummerer hva som skjedde i frontend-verden i uken som var.
🔮 Siste nytt fra Interop-prosjektet
2023 viste seg å være et fantastisk år for Interop-prosjektet og flere viktige features ble endelig kompatible på tvers av nettlesere. Deriblant :has(), container queries, subgrid og border image er noen av featursene som ble kompatible på tvers av nettleserne 🎉
Interop-prosjektet er et samarbeid mellom ulike nettleserleverandører og har som mål å sikre samme funksjonalitet og atferd for webfunksjoner på tvers av ulike nettlesere👨💻
Nå er prosjektet i gang igjen for 2024, og det jobbes med 17 features som man håper på vil bli stabile. Det blir spennende å følge med på utviklingen!
Har du lyst på en sniktitt av det som kommer i 2024?
Sjekk ut Interop 2024-dashboardet✨ Dette gir deg oversikt og status over arbeidet for 2024💥
🚀 React server components nå tilgjengelig i RedwoodJS
Denne uken kunne RedwoodJS annonsere at de har utviklet støtte for React Server Components (RSC)🤩 Tilbake i juli 2023 kunngjorde core-teamet at de hadde startet arbeidet med å tilby støtte for RSC, som en løsning for både server-side rendering (SSR) og mange av ulempene ved rene SPAer.
Med de nye endringene blir det det spennende å se om de klarer å ta opp kampen med Next.js💪 Rammeverket tilbyr mange av de samme funksjonene som Next.js, inkludert SSR, men skiller seg ut ved å legge til støtte for GraphQL. Vi som brukere er invitert til å teste og gi tilbakemeldinger på de nye endringene✨
👉Ta en titt og sjekk ut de nye endringene - kanskje RedwoodJS er et alternativ for ditt prosjekt?
💅CSS-triks for dynamisk skriftstørrelse
Er skriftstørrelsene dine justert med media queries? Vel, da bør du sjekke ut dette trikset💡
Som James Ficher viser, har man tidligere kunnet tilpasse skriftstørrelse basert på skjermstørrelse ved hjelp av media queries:
p { font-size: 1.125rem; }
@media (min-width: 740px) {
p { font-size: 1.25rem; }
}Istedenfor å definere skriftstørrelsen stykkevis ved hjelp av forskjellige breakpoints, er det mulig å bruke en lineær funksjon som tilnærmer seg ønsket størrelse jevnt over skjermens bredde.
:root {
font-size: calc(1rem + 0.25vw);
}Ved bruk av calc() kan vi definere en funksjon som øker skriftstørrelsen proporsjonalt med skjermens bredde ved å bruke viewport uniten vw, samtidig som den beholder et minimumsnivå definert av 1rem. Dermed blir størrelsen på skriften automatisk tilpasset skjermen og CSSen litt slankere. Vinn-vinn for både brukere og utviklere🎉
Det var alt for nå, ses igjen neste uke! 👋
