Dette var uken for runde av 💅 og å plukke opp ballen etter ferien 🐠 — Og 4 612 ting skjedde i frontend-verdenen!
Snikktitt på TypeScript 5.6 👀
Forrige uke kom beta-versjonen av TypeScript 5.6, og med den også en titt på hvilke ting som kan forventes av neste versjon.
Og denne versjonen var ikke mindre en fullpakka av godsaker, både for den avansert og ganske enkel bruk av språket.
#1: Forbedrede nullish og truthy-sjekker
Dette gir typescript muligheten til å si ifra hvis du har conditional statements som alltid vil resultere i true eller false fordi verdien du putter inn er konstant.
I essens vil det fange opp typiske utviklerfeil og typos som fortsatt er gyldig TypeScript
if (x => 0) {
// Oops! This block always runs.
}
Eller ved bruk av nullish-operatoren som her:
TypeScript 5.6 beta brings a sweet new feature - the ability to spot faulty logic in your if statements.
— Matt Pocock (@mattpocockuk) July 26, 2024
SO many subtle will be prevented by this. Really nice stuff. pic.twitter.com/5LO2twrudv
#2: Flere hjelpemetoder for iterators
Det finnes flere innebygde klasser i TypeScript som lener seg på Iterable og Iterator — klassen, for eksempel Map og Set.
Her har man ønsket å adoptere noen av metodene som finnes på Array for å gjøre disse enklere å bruke. Metodene keys, values, og entries kan nå brukes sammen med reduce , map og filter ✨.
#3: Hjelp til imports!
Det er også kommet bedre støtte for å sjekke om du har fått filnavnene riktige når du bruke side-effect imports, som typisk er i bruk i de fleste web-prosjekter!
import "oops-this-module-does-not-exist";
// error: Cannot find module 'oops-this-module-does-not-exist' or its corresponding type declarations.
import "./button-component.css";
export function Button() {
// ...
}
Og hvis du vil få med deg alt sammen kan du ta en titt her!
Hvordan skrive en Chrome-extension? 🎓
Har du hatt lyst å prøve å skrive din helt egne extension til Chrome, men litt usikker på hvordan man kommer i gang?
I denne guiden går de gjennom hvordan du kommer i gang med utviklingen, og går gjennom hvordan de lager flere nyttige features som login, lagring av bilder, bruk av context-menyen og til slutt feilrapportering og publisering til Chrome Web Store ⛑.
Hvordan fungerer egentlig SVGer?
Å kode SVG-er for hånd har alltid sett ut som en superkraft, og noe jeg alltid har endt opp med å designe og eksportere fra ymse apper 🎨.
Forrige uke lanserte Amelia Wattenberg et sideprosjekt som skal hjelpe med å forstå hvordan oppbyggingen av SVG-er.
På appen kan man tegne enkelt egne SVGer og prøve seg frem med å justere verdiene, og se hvordan det påvirker koden til SVG’ene. Ganske stilig.
Du kan prøve selv her 👉 svg.wtf 👈