Dette var uken for vannsklier 🌊, matte-hacks ✖️og innendørs skikjøring ⛷️— og 938 ting skjedde i frontend-verdenen.

Sjekkliste for tsconfig 📋

Mange av oss bruker TypeScript til daglig, men hvor trygg er du egentlig på innholdet i din tsconfig.json-fil? 🤔

Dr. Axel Rauschmayer ønsket å bli tryggere på sin tsconfig og gikk derfor gjennom den ofisielle tsconfig.json-dokumentasjonen, samlet alle mye brukte valg og beskrev dem i en bloggartikkel.

Artikkelen inneholder en grundig gjennomgang av de ulike valgene man kan gjøre i sin tsconfig-fil, som han selv hevder vil gjøre at man til slutt forstår hele sin tsconfig.

Etter å ha gjort research til blogg-posten, endte han opp med en “base” tsconfig:

{
  "include": ["src/**/*", "test/**/*"],
  "compilerOptions": {
    // Specify explicitly (don’t derive from source file paths):
    "rootDir": ".",
    "outDir": "dist",

    //===== Output: JavaScript =====
    "target": "ES2024",
    "module": "NodeNext", // sets up "moduleResolution"
    // Emptily imported modules must exist
    "noUncheckedSideEffectImports": true,
    //
    "sourceMap": true, // .js.map files

    //===== Interoperability: help external tools =====
    // Helps tools that compile .ts to .js by enforcing
    // `type` modifiers for type-only imports etc.
    "verbatimModuleSyntax": true,

    //===== Type checking =====
    "strict": true, // activates several useful options
    "exactOptionalPropertyTypes": true,
    "noFallthroughCasesInSwitch": true,
    "noImplicitOverride": true,
    "noImplicitReturns": true,
    "noPropertyAccessFromIndexSignature": true,
    "noUncheckedIndexedAccess": true,

    //===== Other options =====
    // Lets us import JSON files:
    "resolveJsonModule": true,
  }
}

Dersom du er interessert i å lære mer om tsconfig, de ulike valgene man kan ta og begrunnelse for hans egne valg, kan du lese hele artikkelen her 🤓.

UU-essentials man burde kunne 🚀

For mange utviklere kan UU (universell utforming) virke litt litt overveldende, da mange føler føler at det krever mye ekstra innsats og spesialisert kunnskap.

Det skriver hvertfall Martijn Hols i sitt blogginnlegg der han trekker frem noen grunnleggende praksiser som kan gjøre en stor forskjell.

Han går gjennom 7 nøkkel-prinsipper som han mener alle frontend-utviklere bør tenke på når de bygger nettsider, og disse er:

• Semantisk HTML — bruk riktige elementer for interaktiv og native funksjonalitet.
• Forms — forenkle labels og struktur for å forbedre brukervennlighet for alle.
• Tastaturnavigering — sørg for at brukere kan navigere rundt med kun tastaturet sitt.
• Modaler — modaler har mange UU-krav, sørg for å oppfylle disse.
• Bilde alt-tekster — skriv bedre bilde-beskrivelser for å gjøre bilder mer tilgjengelige.
• Styling —forbedre tilgjengeligheten på siden gjennom fokusindikatorer, responsivt design og redusert bevegelse.
• ARIA-attributter — lær deg når og hvordan å bruke ARIA-regler for å lage mest mulig tilgjengelige sider.

Dette er relativt grunnleggende ting som vi som frontend-utviklere kan forbedre uten at det krever mye ekstra tid eller innsats, og mest sannsynlig vil den overordnede brukeropplevelsen også dra nytte av fokus på disse tingene 🙌 .

Hvis du vil lese mer og se eksempler på bruk kan du lese hele artikkelen her.

React Scan v.0.1 🕵️

Forrige uke ble React Scan v.0.1 sluppet, et verktøy som skanner din React-app for å oppdage ytselsesproblemer.

I følge skaperen tar det rundt 60 sekunder å sette opp, og viser deg eksakt hva du trenger å fikse for å forbedre ytelsen i appen din.

Det er ikke alltid enkelt å ha full kontroll på alle renders i React-apper, spesielt ikke i større prosjekter, så kanskje dette kan være et nyttig verktøy 🛠️ Du kan lese mer om det i tråden under 👇

ArkType 2.0 er ute 🚀

Dette var ikke den eneste lanseringen forrige uke. ArkType 2.0 ble sluppet, og skal være et 100x (! 🤯) raskere alternativ til Zod.

Kanskje dette er verdt å sjekke ut dersom man trenger en TypeScript-validator? 😄

Det var alt for denne gang, vi sees neste uke 👋

– Viktig å investere i «soft skills» i disse AI-tider

onsdag 15. januar 2025