English web site
TDP013 Webbprogrammering och interaktivitet
En social webbplats
Lärandemål
Från kursplanen: Länk till kursplan
- Skapa avancerade webbsidor som inkluderar dynamisk information, interaktivitet och databasanslutning.
- Använda programmeringsspråk som JavaScript för att skapa interaktivt webbinnehåll.
- Använda tekniker som AJAX för att skapa interaktivt webbinnehåll.
- Tillämpa regler för god interaktionsdesign för webbsidor och webbplatser.
- Planera och genomföra skapandet av en webbplats.
Programmål - Innovativ Programmering
Från programplanen: Länk till programplanen
- 1. hantverk: den (ofta tysta) kunskap och individuell förmåga som studenten bygger upp genom att arbeta praktiskt med programmering, själv, i projekt och i community. Här betonas både att arbeta innovativt och mot beställare.
- 3. teknik: kunnande om den teknik som finns för programmering och datorer, med fokus på programmeringsspråk och plattformar.
Examensmål - Kandidatexamen
Från Högskoleförordningen (1993:100): Länk till förordningen
- visa kunskap och förståelse inom huvudområdet för utbildningen, inbegripet kunskap om områdets vetenskapliga grund, kunskap om tillämpliga metoder inom området, fördjupning inom någon del av området samt orientering om aktuella forskningsfrågor.
- visa förmåga att söka, samla, värdera och kritiskt tolka relevant information i en problemställning samt att kritiskt diskutera företeelser, frågeställningar och situationer
- visa förmåga att självständigt identifiera, formulera och lösa problem samt att genomföra uppgifter inom givna tidsramar
Syfte
Syftet med projektet är att självständigt använda och utöka den kunskap som förvärvats i de tidigare laborationerna.
Genomförande
Projektet är tänkt att genomföras i par enligt webreg och storleken på uppgiften är anpassad därefter. För betyget godkänt ska de grundläggande kraven vara uppfyllda. För högre betyg se Krav för högre betyg nedan.
Krav - Grundläggande
- Användare ska kunna registrera sig med användarnamn och lösenord.
- Användare ska kunna logga in och logga ut.
- Lösenord ska inte skickas eller sparas som läsbar text.
- Endast ny informationen ska uppdateras på hemsidan, dvs. hela webbplatsen ska endast laddas om i undantagsfall.
- Det ska finnas en sökfunktion för att hitta andra användare. Man ska kunna söka efter användare även om man bara vet en del av namnet.
- Användare ska kunna lägga skicka vänförfrågningar till andra användare.
- Vänförfrågningar måste accepteras innan man blir vänner.
- Vänförfrågningar ska inte kunna skickas till användare man redan är vän med.
- Användare ska kunna se en lista över sina vänner.
- Användare ska ha en personlig sida.
- Användare ska kunna se sina vänners sidor.
- Användare ska endast kunna posta meddelanden på sin egen och sina vänners sidor.
- Användare ska inte kunna agera som någon annan, dvs. konton är personliga.
- Nya meddelanden ska valideras på klientsidan. Meddelanden får inte vara tomma eller innehålla fler än 140 tecken.
- Nya meddelanden ska valideras på serversidan enligt samma regler som ovan.
- Inledande och efterföljande whitespace-tecken ska trimmas bort från meddelanden innan validering.
- Data ska sparas i en MongoDB-databas.
- Serversidan ska vara skyddad mot MongoDB-injections.
- Testning/kodtäckning av backend ska göras med Mocha/Istanbul.
- Alla element ska placeras på lämpligt sätt i förhållande till varande med lämplig justering av komponenter i höjd- och breddled samt väl valda avstånd mellan komponenter.
Webbplatsen kommer att använda sig av alla de tekniker som använts i laborationerna. Alla grundläggande funktioner ska testas och det är viktigt att ni kan beskriva och motivera både funktionalitet och visuell layout. Webbplatsen behöver inte vara grafiskt "snygg" men ska tydligt visa att den byggts upp baserat på medvetna val.
Krav för högre betyg
- Möjlighet för vänner att chatta med varandra i realtid med HTML5 WebSockets och socket.io-plugin till NodeJS
- Använda ett klientramverk för att bygga applikationen (React rekommenderas men andra ramverk går bra att använda efter samråd med labbassistent)
Krav för betyg 5: De grundläggande kraven + 1 och 2
Redovisning
Redovisning görs i två moment: redovisning av kod och redovisning vid seminarie.
Redovisning av kod
- Lägg upp er och kod andra relevanta filer för labben till ert tilldelade repo på gitlab.liu.se.
- Skapa en tag (använd formatet projekt-v.1.x) för er inlämning. Vid rättning är det alltid den senast taggade versionen för projektet som rättas.
- Inkludera i er
READMEen beskrivning av hur man kör ert projekt och testerna. Om man exempelvis behöver ändra några av default-inställningar för MongoDB eller om ni lagt upp hemsidan på egen server så ange även detta.
Muntlig redovisning vid seminarium
Alla studenter kommer att presentera sitt projekt enskilt i grupp även projektet gjorts i par. Ni kommer att tilldelas en grupp och tid för redovisning av projektet. Under redovisningen ska ni kort beskriva er app och teknikerna som ligger bakom. Ni ska även visa upp ett demo av appen som antingen kan göras live (vilket är att föredra) eller som inspelad screencast. Visa gärna upp och diskutera några väl valda delar av er kod. Presentationen bör ta ca 10 minuter följt av frågor från publiken (ca 5 minuter).
Redovisning vid missat seminarium
Vid missat seminarium ska en ca 15 minuters screencast föreberedas enligt samma instruktioner som ovan. Eftersom det inte finns möjlighet att ställa några frågor är det då viktigt att ni är extra tydliga kring hur er applikation är uppbyggd. Planera därför vad ni ska säga innan ni gör inspelningen. Dela videon som nedladdningsbar länk till robin.keskisarkka@liu.se.
Komplettering mot högre betyg
Vid komplettering mot högre betyg räcker det att endast diskutera utökningen/utökningarna (se Krav för högre betyg) av sin kod. Längden på screencasten kan då vara något kortare (ca 10 minuter).
Deadline: Fredag 13:e oktober 2023 - 23:59 CEST
Sidansvarig: Robin Keskisärkkä
Senast uppdaterad: 2023-08-15
