[UTBILDNINGSRECENSION] - HT2022-VT2024 TWEUG Webbutvecklings-programmet 120hp (distans hos MIUN) 1/4
OBS: Denna recension ÄR indelad i flera inlägg. Den innehåller först - i första inlägget - introduktion och sedan i kronologisk ordning upp till fyra kurser per inlägg!
P.S. Detta är inlägg 1/4. Tre återstår!
Introduktion
Detta är en recension av distansprogrammet jag läste vid Mittuniversitetet i Sundsvall - på distans - vars dagbok återfinns här. Den ägde rum mellan den 1:a september 2022 till och den 4:e juni 2024 med förutsättningen att det inte blir/blev något kompletteringskrav i den sista kursen.
Flera viktiga utgångspunkter om recensionen
Jag utgår endast utifrån mina erfarenheter och vissa anonyma klasskamraters upplevelser. Detta behöver dock inte nödvändigtvis betyda att du skulle få liknande upplevelser och/eller erfarenheter av utbildningen.
Jag utgår endast utifrån vad jag upplevde var lätt och/eller svårt. Något jag anger som svårt eller lätt kanske är det helt motsatta för dig.
Jag utgår endast utifrån vad jag upplevde som för- och nackdelar. Något jag upplevde som en nackdel eller fördel kanske skulle upplevas som det motsatta för dig eller kanske till och med helt neutralt/likgiltigt.
När jag växelvis säger "projektuppgiften" eller "slutuppgiften" i en kurs (med undantag för sista kursen - DT140G) så menar jag på den sista inlämningsuppgiften som är betygsättande i den kursen. Övriga uppgifter i en given kurs hänvisas växelvis till "deluppgifter" eller "(del)moment".
I slutet av varje recenserad kurs går jag igenom vad jag personligen i efterhand upplever kunde ha varit bra om det varit (eller inte varit) med i kursen. Detta är då i efterhand efter hela utbildningens förlopp då jag vet mer idag än vad jag visste då.
Tänk på att vissa saker kanske jag inte minns som kanske borde ha tagits upp i någon given kurs. Faktafel kan även förekomma. Jag reserverar rättigheterna att hela recensionen ska tolkas som en subjektiv upplevelse utifrån en individs perspektiv och representerar inte nödvändigtvis den genomsnittliga personens upplevelse av utbildningen.
Observera till sist att vissa kurser här läste jag inte men andra i den virtuella klassen läste dem. Observera även att vissa av dessa kurser inte finns med för de som läser i början på detta år och/eller nästa läsår.
Utbildningens kurser recenseras i den ordning de förekom enligt nedan. Det var alltid två kurser som löptes parallellt vilket sträckte sig över cirka två månader i och med 50 % studietid fördelad på vardera kurs. Undantaget är den allra sista kursen - DT140G - som gick på 100 % studietid enskilt.
HT2022 DT057G Datateknik GR (A), Webbutveckling I, 7,5 hp (distans)
De två första parallellkurserna introducerade HTML, CSS & JavaScript (JS) på grundläggande vis. Den ena kursen hade ett relativt katastrofalt upplägg (DT057G) medan den andra kursen varit fenomenalt upplagd (DT084G). Varför var den ena så dåligt upplagd? Jo, det så kallade "studiematerialet" var primärt webblänkar till Wikipedia-sidor om HTML, CSS, HTTP-protokollet, www, och övriga relevanta ämnen för en som nyss påbörjat HTML & CSS på nybörjarnivå.
Det fanns en lärobok rekommenderad (ISBN: 978-1-118-00818-8) men den är från 2011 för en utbildning som gick av stapeln 2022. Med tanke på hur snabbt tekniken utvecklas - eller åtminstone hur fort det föds nya JavaScript-ramverk varje månad - så var detta ytterst konstigt urval av föreslagen kurslitteratur tyckte jag (och vissa andra från klassen). Boken var mycket hjälpsam om än utdaterad i vissa slag. Och värre var det ju att vi som nybörjare inte kunde avgöra vad som var utdaterad och inte eftersom vi var ju just det: nybörjare på HTML & CSS!
Samtidigt fanns dock digitala föreläsningar - även de som spelades in lajv för de som deltog - men dessa var relativt "magra" jämförelsevis med motsvarande lajvföreläsningar i JavaScript-introduktionskursen. Detta kan delvis ha förklarat varför nästan 25 % försvann av hela klassens dryga 100+ Discord-medlemmar redan under det första halva läsåret. Troligen gav det en riktigt dålig försmak på vad skulle komma härnäst i utbildningen.
Utmaningen med denna introduktionskurs var att det inte riktigt förklarades på djupet - om än för nybörjare - om CSS selektorers specificitet, om faktumet att webbläsaren redan har standard CSS applicerade och att dessa kan appliceras olika av olika webbläsare (exempelvis standardutseendet för formulärelement såsom knappar, med mera).
Exempelvis ett mycket svårt moment i denna kurs - upplevde jag - var momentet där vi skulle skapa en responsiv sida utan att ha något bättre hum om media-direktivet i CSS eller hur ens flex och grid faktiskt fungerade. Det tog faktiskt troligen ett år för mig att inse att det finns något som heter inre och yttre värden (outer and inner values) inom CSS. När det kopplade för mig så blev flex & grid mycket lättare att greppa och applicera i praktiken.
En riktigt motsägelsefull sak i denna kurs var en del i projektuppgiften och vad som skulle kunna ge en toppbetyg: Du skulle implementera webbanvändbarhet (se kursen DT068G vilket är en av de två nästa parallellkurserna i utbildningen efter dessa två första) enligt Webbriktlinjers specifikationer. Hur skulle vi i en av de första parallellkurserna i en Webbutvecklingsutbildning kunna göra det när utbildningen till och med hade en separat kurs för enbart Webbanvändbarhet? 🤔
Dessvärre berodde en hel del på kursens delvis katastrofala upplägg på att de ansvariga lärarna inte verkar vara så engagerade när det väl kom till kritan inom kursen. Lärarna som personer - då jag träffat båda fysiskt - är mysiga och mycket tillmötesgående. Den digitala kommunikationen var dock bristfällig upplevde jag till och från med just dessa två ansvariga lärare. Dessa två återkommer senare i introduktionskursen för C# vilket var tyvärr också rätt så "katastrofal" i sitt upplägg.
Jag lyckades lära mig delvis de grundläggarna pelarna inom HTML & CSS även om det här med flex och grid var fortfarande relativt förvirrande för jag hade ännu inte lärt mig och förstått mig på "outer & inner values".
Vad borde ha funnits med i kursen som saknades?
Mycket mer ingående - om än på grundläggande nivå - hur nätverkspaket via TCP/IP och sedan med hjälp av de olika HTTP(s) protokollen (1.1, 2 & 3) skickar och tar emot i det så kallade klient-server-paradigmet.
Bättre val av kurslitteratur och inte någon bok som var/är 10 år gammal då.
Mer ingående om CSS selektorers specificitet, hur olika webbläsare kan rendera CSS på olika sätt, samt faktumet att vissa CSS-regler är en förkortning av andra separata CSS-regler som exempelvis "flex:" vilket är förkortning för "flex-grow", "flex-shrink" och "flex-basis" i den ordningen.
HT2022 DT084G Datateknik GR (A), Introduktion till programmering i JavaScript, 7,5 hp (distans)
Den andra första parallellkursen var introduktion till skriptspråket JavaScript och det var en mycket bra kurs - delvis mycket tack vare två helt andra mycket mer engagerade lärare vilket påvisades främst av skillnaden i kursmaterialet. I denna kurs fanns det mycket mer unikt läsbart material på svenska och flera förinspelade klipp om grundläggande JavaScript.
På så vis gav det ett helt annat första intryck av vad kurser med dessa två lärare skulle innebära i framtida parallellkurser. Tur - beroende på vem du frågar - så hade vi dessa två lärare i majoriteten av kurserna i denna utbildning. Slutuppgiften i kursen var att använda en färdig HTML-fil tillsammans med en färdig CSS-fil och sedan skapa egen JavaScript-kod som skulle fungera som en webbtjänst mot det öppna Sveriges Radios API.
Här upplevde jag att jag briljerade i mitt slutprojekt vilket också var den första kursen i utbildningen där jag fick toppbetyg och jag minns än idag att läraren som betygsatte projektet sa att "Du verkar ha en fallenhet för det här" vilket så klart är #humblebrag. Men här var det också många 8 timmars koddagar med skrik och slit för nu hade jag inte kommit över chatGPT eller liknande LLM:s.
En gång så hade jag glömt att rensa cache i webbläsaren så när jag provkörde min kod efter cirka 2-3 timmars kodande så framstod det som om ingenting fungerade och jag fick då mild existentiell ångest för jag kände "Jag fattar ingenting och jag har tagit CSN-lån. Hur i helvete ska jag klara detta då detta är bara en av de första kurserna?"
Sedan testade jag att köra CTRL+F5 och det fungerade och jag fick den första lärdomen: uppdatera alltid på riktigt när du väl ska uppdatera!
Något jag inte berättat ännu i betygsättningen i denna utbildning är att i varje slutuppgift ska du vanligtvis uppfylla ett par kravspecifikationer för godkänt. Sedan föreslås olika extra saker du kan lägga till för högre betyg. Mina extra funktioner i denna JavaScript-baserade webbtjänst var: förstora & förminska viss brödtext, växla mellan mörk- & ljustema, och växla till och från tabellformat.
Det var kanaltablåer för radiokanaler som hämtades och visades med hjälp av JavaScript. Ingen HTML- och/eller CSS-kod fick röras! Den extra funktionalitet jag var mest stolt över var just tabellomvandlingen då jag - riktigt utan att förstå exakt hur då - fick först hämta alla HTML-element från en given tablå och sedan konvertera om dem till en tabell och sedan infoga den på plats samtidigt som jag behöll en ren HTML-kopia av tablån för att kunna växla tillbaka genom att bara ersätta ett HTML-element med det lagrade HTML-datat.
Allt som allt så var det en mycket givande introduktionskurs till JavaScript och det gav mig förkärleken till procedurbaserad programmering eller funktionsbaserad programmering(?) Det skulle visa sig bli rätt lika med när jag väl blev bättre på PHP. Lärarna var/är fantastiska och läromaterialet följde en mycket bra logik:
Grundläggande delar inom JavaScript
Förenklad användning av webbtjänster
Kombinera de grundläggande delarna med användningen av en öppen webbtjänst (SR API)
Föreslagen - dessutom helt gratis online - kurslitteratur var/är Eloquent JavaScript av Marijn Haverbeke. I skrivande stund har denna bok fått en 4:e upplaga (2024) vilket jag nog ska plöja igenom igen bara för att. Den var/är mycket bra om än klurig samtidigt då det går väldigt fort från simpel JavaScript-kod till relativt komplex kod (dvs., i Project-kapitlen) som jag typ IDAG har _lättare_ att följa än då!
Så nu hade jag lärt mig grundläggande JavaScript samtidigt som Promise-objektet och även det här med att mer eller mindre allt i JavaScript är prototypbaserade objekt.
Vad borde ha funnits med i kursen som saknades?
Om jag minns rätt så var inte så mycket ingående om objekt i denna JavaScript-kurs och det var inte heller någon grundläggande utförlig genomgång av hur JavaScript är prototypbaserat och inte klassbaserat.
Mer ingående med fler exempel kring Promise-objektet och dess förenkling (async & await) för detta var något jag bråkade med och inte riktigt lyckades som jag hade hoppats på. Jag förstod inte alls det här med "race conditions" och/eller "Promise.all()".
Kanske - om än mycket grundläggande - genomgång av att använda generator-funktioner? Om jag inte misstar mig så är async & await baserade på generator-funktioner? Kanske överkurs i en introduktionskurs inom JavaScript dock?
HT2022 DT068G Datateknik GR (B), Webbanvändbarhet, 7,5 hp (distans)
Efter de två första grundkurserna inom HTML, CSS & JS så hoppade vi genast på lite mer av det grafiska och användarupplevelser, det vill säga UI och UX (i viss mån). Kurserna blev då först ut Webbanvändbarhet vilket handlade om att göra webbplatser mer tillgängliga och användbara. Denna kurs introducerade även mig till min största svaghet inom webbutveckling - Webbdesign - och därmed min "ärkefiende" Figma!
Kurslitteraturen i denna parallellkurs var "Don't Make Me Think" av Steve Krug, men den gav inte så himla mycket mer än något att hänvisa till vid alla dessa rapportskrivningar. Ja, just det. Vi har nu kommit till en av de sakerna jag avskytt mest under hela denna utbildning: allt jädrans rapportskrivande... Men det var bara att bita ihop och veta att det var något universitetet ville ha mer än jag och/eller framtida arbets-/uppdragsgivare.
Jag har mycket blandade känslor kring webbanvändbarhet i sin helhet. Å ena sidan finner jag det mycket praktiskt med saker som brödsmulor och andra indikatorer på var du är någonstans på en webbplats som har väldigt många och/eller komplicerad navigering. Å andra sidan så finner jag det samtidigt som att webbanvändbarhet i viss utsträckning kan hämma kreativiteten eftersom tanken är att en webbplats ska göras tillgänglig för så många som möjligt vilket kan betyda att den ska förenklas inte bara i innehåll utan också i visuell design.
Å tredje sidan i samband med det kommande Webbtillgänglighetsdirektivet för 2025 så var detta en mycket matnyttig kurs att ta sig igenom även om jag skrek väldigt mycket kring Figma. Jag och några andra klassen brukade skämta om hur kursen kändes mer som en kurs i Figma än i faktiskt webbanvändbarhet!
Däremot ett starkt värde i kursen var att vi hade en gästföreläsning där en fullständigt blind person - som dessutom är webbutvecklare(!) - visade exempel på bra webbplatser (exempelvis var/är @Inet en av dessa - tro det eller ej!) gällande användbarhet och tillgänglighet. Det var en - hm... - ögonöppnare(?) för oss seende individer. Och det gjorde det hela mer "konkret" i hur upplevelsen kan skilja sig extremt mellan seende och icke-seende individer.
Nu minns jag att slutuppgiften i denna kurs var att ta fram en färdtjänstwebbplats med starkt fokus på webbanvändbarhet för att uppfylla så många WCAG-krav som möjligt, i AA- och AAA-nivå. Det gick utan problem för mig men min design var/är fruktansvärt ful och delvis lite "trång" så här i efterhand. Det gick då att förenklat boka färdtjänst enbart med hjälp av tangentbordet tack vare alla de olika webbanvändbarhetsimplementeringar jag gjort för webbplatsen.
Det enda hemska med denna kurs var tvungna att ha statiska HTML-filer för alla undersidor och inget dynamiskt som i PHP. Jag hade väl säkert 10+ undersidor så när jag ändrade en sak i navigeringen i en HTML-fil blev jag tvungen att ändra samma sak i alla övriga HTML-filer. Snacka om mental smärta!
Vi hade tre lärare i denna kurs istället för två och samma tre lärare var också med i den andra parallellkursen (DT200G). De var/är mycket bra så där har jag inget att anmärka på. Vi hade alltså fortfarande de två "bättre" lärarna enligt mitt eget personliga tycke.
Oj! Det var en sak till som var riktigt hemskt i kursen - för mig åtminstone - vilket var att innan vi fick börja på HTML-filerna så blev vi tvungna att lämna in en Figma-prototyp av hela webbplatsen. Och ja, det inkluderade alla 10+ undersidor vilket var så klart riktigt smärtsamt för detta var också första gången vi fick lära oss Figma, varav känslan att det kändes i vissa fall mer som en Figma-kurs än Webbanvändbarhetskurs.
Vad borde ha funnits med i kursen som saknades?
Fler och egna exempel om hur olika aria-attribut kan användas för att uppfylla diverse WCAG AA(A) krav än att vi behövde söka detta online eftersom det blev lite som om kursen tappade exklusivt värde om det ändå hade gått lika bra att finna allt online utan att först komma in på utbildningen för att få läsa kursen.
Ironiskt nog upplevde jag inte alltid Webbriktlinjer - webbplatsen vi svensktalande individer kan nyttja för att maximera webbanvändbarheten i våra webbapplikationer - som så användbar för att göra webbplatsen min bättre inom användbarhet och tillgänglighet. Det som saknas/saknades där var praktiska kodexempel likt det jag nämnt i ovanstående punkt.
HT2022 DT200G Datateknik GR (A), Grafisk teknik för webb, 7,5 hp (distans)
Denna andra parallellkurs introducerade oss till grafisk teknik för webben vilket innebär skapandet och/eller redigeringen av bilder och video för webben. Bland annat fick vi skapa videoklipp som spelades upp via YouTube och videoklipp som spelades upp direkt som bakgrundsbild på webben, varav det sistnämnda jag sällan sett på webben men det är en rätt cool grej om än bandbreddshungrig om det ska vara någon vidare kvalité!
De olika momenten i kursen lät oss först få redigera och fixa till trasiga bilder i Photoshop eller GIMP eller annat valt bildredigeringsprogram. Slutuppgiften var en webbplats som sedan kombinerade de olika delmomenten: en webbplats för ett fiktivt företag som ville ha redigerade bilder och videoklipp för att locka till sig kunder. Jag tog då foton på några av mina legomodeller och klippte ur dessa i Photoshop och filmade även dem för introduktionsvideo på sajten.
Jag lyckades även få till simpelt automatiskt bildspel - vilket även gick att pausa - utan någon användning av något externt bibliotek. Däremot använde jag Lightbox2-biblioteket för manuellt bildspel av alla bilder. I denna slutuppgift gjorde jag även en kul grej: jag fotade först en fluffig mössa, ritade en SVG-version av den i Illustrator för att sedan sätta den på ett Legohuvud (bild) vilket då gjorde att det blev en "norrländsk Legofigur".
Kursen var delvis rolig förutom att nu började det bli krav på Figma och det var det som jag tyckte var jobbigast och tråkigast på grund av min "icke-fallenhet" för det.
En bra sak nu så här i läsandes är att jag skriver lite mindre om de tidigare kurserna på grund av sämre minne av dem (kanske förtryckt i vissa fall? ) och/eller på grund av mitt starka ointresse av dem vilket kanske bidrog till sämre minne av dem.
Vad borde ha funnits med i kursen som saknades?
Kanske lite mer uppdaterade videoklipp om redigeringstekniker inuti Photoshop? De som fanns tillgängliga var runt 5 år gamla och nuvarande fotoredigeringsverktyg kan ju se mycket annorlunda ut.
Kanske mer illustrativa webbdesignprinciper? Jag upplevde inte att jag lyckades plocka med mig några större webbdesignprinciper för tillämpning efter kursen trots att den för övrigt var rolig och delvis lärorik.
P.S. Detta är inlägg 1/4. Tre återstår!
"Den säkraste koden är den som aldrig skrivs"
"Visste du förresten att det är ett mångmiljardbolag?"
"Jag lever inte för att koda utan kodar för att sen kunna leva"