Kmom03: Dashboard

By . Latest revision .

Kursutveckling pågår.

I detta kursmoment fortsätter vi med att utveckla våra GUI komponenter från tidigare kursmoment. Vi skapar lättanvända formulärfält med hjälp av HTML5 och kopplar ihop fälten i formulär som är lätta att använda på små skärmar där kontext och möjligheten att skriva snabbt och enkelt saknas.

I vår applikation lägger vi till möjligheten att skapa, uppdatera och ta bort data via formulär. Vi har i tidigare kursmoment arbetat enbart med vanilla JavaScript, men ska i detta kursmoment titta på hur vi kan använda oss av JavaScript ramverket mithril för att underlätta hämtning av data, rendering av HTML-element och de olika vyer.

Så här kan det se ut när vi är klara.

Dashboard i kursmoment 3.

(Detta är instruktionen för kursmomentet och omfattar det som skall göras inom ramen för kursmomentet. Momentet omfattar cirka 20 studietimmar inklusive läsning, arbete med övningar och uppgifter, felsökning, problemlösning, redovisning och eftertanke. Läs igenom hela kursmomentet innan du börjar jobba. Om möjligt – planera och prioritera var du vill lägga tiden.)

#Läsanvisningar

(ca: 6-10 studietimmar)

#Kurslitteratur

Läs följande:

  1. Mobile HTML5.
    • Ch 11: CSS3 features in Responsive Web Design
    • Ch 12: Designing Mobile Applications

#Artiklar

  1. Läs “What the heck is shadow DOM”.

  2. Läs om vilka “use case som finns för shadow DOM”.

  3. Skumma igenom “Googles artikel shadow DOM-v1”.

  4. Bekanta dig med dokumentationen för javascript ramverket mithril och genomgången av en enkel app i deras tutorial.

#Video

  1. Det finns en videoserie kopplat till kursen, titta på videos som börjar på 3.

#Lästips

#Övningar & Uppgifter

(ca: 6-10 studietimmar)

#Övningar

Gör följande övningar för att träna inför uppgifterna.

  1. Gör övningen “Kom igång med ramverket Mithril”.

  2. Läs igenom artikeln “Virtuella noder”.

  3. Läs igenom artikeln och gör övningarna i “Modeller och request i mithril”.

#Uppgifter

Dessa uppgifter skall utföras och redovisas.

  1. Gör uppgiften “Dashboard”.

#Extra

Det finns ingen extrauppgift.

#Resultat & Redovisning

(ca: 1-2 studietimmar)

Läs instruktionen om hur du skall redovisa.

Se till att följande frågor besvaras i redovisningstexten.

  • Hur är din generella uppfattning om mithril nu efter tre kursmoment?
  • Hur känns det att utveckla för enheter med olika stora skärmar?
  • Valde du flex eller float grid? Varför?
  • Vilket API valde du förutom Github? Varför?
  • Var det något som krånglade eller tog extra mycket tid?
  • Vilken är din TIL för detta kmom?

#Revision history

  • 2017-03-13: (B, efo) Första utgåvan för webapp-v2.
  • 2015-11-23: (A, mos) Första utgåvan för kursen.

Document source.