Kursplan

Introduktion till Generativ AI för Front-End

  • Vad är generativ AI i programutveckling?
  • Översikt över verktyg: ChatGPT, GitHub Copilot, Codeium, etc.
  • Fördelar och begränsningar med AI i UI-utveckling

Promptbaserad UI-generering

  • Skapa promptar för HTML-struktur och komponenter
  • Generera och ändra CSS-stilar med AI
  • Använda AI för att skapa interaktiva element i JavaScript

Prototypning av layouter med generativa verktyg

  • Bygga landningsidor och flersektionslayouter
  • Responsiva designpromptar (Flexbox, Grid)
  • Förhandsvisa och testa i CodePen eller liknande verktyg

Komponentisering och återanvändning

  • Generera återanvändbara UI-komponenter (knappar, kort, formulär)
  • Skapa komponentbibliotek och designsystem med hjälp av AI
  • Använda AI i populära ramverk (React, Vue, Tailwind)

AI-stödd kodgranskning och felsökning

  • Fixa layoutfel och tillgänglighetsproblem med LLMs
  • Optimering av HTML/CSS/JS-kodens prestanda
  • Förklara fel och föreslå lösningar via AI-promptar

Samverkande design och innehållsgenerering

  • Använda AI för att generera exempelinnehåll, text och platsförhållanden
  • Arbeta med designer för att skapa layouter och stilar tillsammans
  • Exportera AI-genererade idéer till användbara HTML-mallar

Projekt: Bygg en AI-stödd webbapp

  • Designa UI baserat på företagspromptar
  • Bygga komponenter och interaktioner med hjälp av AI
  • Polera, testa och presentera prototypen

Sammanfattning och nästa steg

Krav

  • Grundläggande kunskap om HTML, CSS och JavaScript
  • Bekantskap med front-end ramverk eller designsystem
  • Intresse av att använda AI för att snabba upp UI/UX-arbetsflöden

Målgrupp

  • Front-end utvecklare
  • UX-ingenjörer
  • Webbdesigner och kreativa teknologer
 14 timmar

Antal deltagare


Pris per deltagare

Vittnesmål (1)

Kommande Kurser

Relaterade Kategorier