Översikt

Du inleder detta treveckorsblock med kursens sista teori: hur applikationen pratar med en server i realtid, och vad webbläsaren mer kan göra. Sedan är det fullt fokus på examinationsuppgift B3 som gäller! Kursledningen önskar samtidigt dig en riktigt 🎅 God Jul och ett 🎆 Gott Nytt År! Information om veckornas upplägg annonseras löpande i kursens Zulip-kanal.

2023-12-18 33:10

Vill du ändå se en gammal "Stå-upp"-vlogg med Johan & Mats, inspelad under en tidigare kursomgång?

Veckornas artiklar

Teorin finns samlad i tre artiklar. Den första behöver du för Messages i B3 och bör läsas först.

1. Realtid med WebSocket – varför polling inte räcker, API:et, meddelanden i JSON, en socket i en webbkomponent och säkerheten kring det som kommer från andra.

2. Webbläsarens API:er – feature detection, secure context och behörigheter, en översikt över vad som finns och hur du väljer API till B3. För högre betyg på B3 krävs minst ett API du inte har använt i kursen.

3. TypeScript och WebAssembly – dynamisk och statisk typning, typkontroll med JSDoc, och hur annan kod körs i webbläsaren. En orientering utanför kursen, som inte är examinerad.

Läsanvisningar

Under läsanvisningar hittar du veckornas kapitel som ska läsas i kurslitteraturen. Planera upp och dela upp läsningen under veckorna.

Utmaningar

Under Utmaningar hittar du sex frågor om WebSocket och webbläsarens API:er, ett bra sätt att stämma av att du har förstått artiklarna.

Äldre inspelningar

Inspelningarna från 2021 går igenom samma stoff som artiklarna, men är delvis inaktuella. Bland annat nämns byggverktyget Snowpack i stället för Vite, och flera uppgifter om webbläsarstöd har ändrats. Artiklarna räcker, men vill du se genomgången i rörlig bild finns den kvar här. Sammanfattningar och presentationer till inspelningarna hittar du i samlingen av inspelningar för delkurs B.

2021-12-20 11:50

Web Sockets API: varför HTTP inte räcker och hur API:et används. Motsvarar den första artikeln.

2021-12-20 1:06:45

Kapabla PWA:er: en genomgång av webbläsarens API:er, TypeScript och WebAssembly. Motsvarar den andra och tredje artikeln.

Handledning

Några handledningspass finns insprängda under veckorna. I övrigt hänvisas du till Zulip! Första timmen på handledningen kommer ett Zoom-möte att öppnas där kursledningen kommer att svara på frågor generellt. Skicka gärna in frågor på förhand via formuläret som du når här:

• Frågor inför öppen handledning

Examinationsuppgift B3

Fortsätt arbetet med examinationsuppgiften. Läs mer om examinationsuppgift B3.

Studiefrågor

Här är ett antal frågor som du kan försöka besvara och diskutera tillsammans med din AI-assistent. Tveka inte att lyfta någon av frågorna till handledningen för att fortsätta diskussionen med lärare och studiekamrater.

1. Varför räcker inte HTTP för en chatt, och vad är polling?
2. Hur går det till när en WebSocket-anslutning öppnas?
3. När utlöses open, message, error och close, och vad händer om du anropar send() vid fel tillfälle?
4. Var i en webbkomponents livscykel hör en WebSocket hemma, och varför?
5. Varför får text från andra användare inte sättas med innerHTML?
6. Vad är feature detection och progressive enhancement?
7. Vad är ett secure context, användaraktivering och behörighet?
8. Vad skiljer Canvas från SVG?

Tips

Här följer tips till hur du kan prioritera bland kursmaterialet för att komma igång med veckorna.

1. Läs Realtid med WebSocket när du börjar på Messages. Testa gärna anslutningen med några rader kod innan du bygger komponenten, och följ trafiken i DevTools.
2. Lägg ett fönster överst med z-index, inte genom att flytta det i DOM:en. Annars startar allt i fönstret om, inklusive anslutningen i Messages.
3. Siktar du på högre betyg, välj API med hjälp av Webbläsarens API:er och kontrollera stödet innan du bygger vidare.
4. Läsanvisningarna innehåller mer än B3 kräver. Prioritera uppgiften.