Kmom02: Bygg ut din mobila webapp

Vi har en me-app, från föregående kursmoment, som är utvecklad mot mobila enheter. Men med mobila terminaler finns det en del som är specifikt och skiljer sig från desktop miljöer. Låt oss bygga vidare på me-appen och testa runt för att se vilka möjligheter och begränsningar som kan finnas. Det blir en blandning av olika tekniker men fokus är att lära oss mer om den mobila utvecklingsmiljön.

Det kan se ut så här när vi är klara.

(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 5: SVG, Canvas, Audio, and Video
   • Ch 6: Other HTML5 APIs

#Artiklar

Läs följande artiklar för att få bakgrunden till övningarna.

1. Läs om “Use Cases and Requirements for Installable Web Apps”.

2. Läs översiktligt introduktionen om webappar i Safari Developer library - Getting started with webapps.

3. Läs översiktligt om introduktionen till Android Web Apps.

#Video

Titta på följande video.

1. Se videon om jQuery Mobile “Alex Schmitz - jQuery Mobile - What’s New in 1.5 and the Road to 2.0”.

#Lästips

Det finns inga extra lästips.

#Övningar & Uppgifter

(ca: 6-10 studietimmar)

#Övningar

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

1. Läs igenom artikeln och gör övningarna i “Att göra en mobilapp av en mobil-anpassad webbplats”.

2. Installera utvecklingsverktygen för Installera en emulator för Android.

#Uppgifter

Dessa uppgifter skall utföras och redovisas.

1. Gör uppgiften “Bygg ut me-appen med ett potpurri av tester”.

#Extra

Följande kan du göra om du har tid och ambition.

1. Studera koden bakom JavaScript-funktionen detectSwipeEvent() som du finner i GitHub repot mosbth/detect-swipe-event. Du kan dels se hur koden är uppbyggd för att hantera och upptäcka olika swipe-event, och du kan se hur Travis används för automatiserade tester och Makefile för att köra testerna och skapa den minifierade varianten.

#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 känns det att jobba i jQuery Mobile, fördelar och nackdelar?
• Så här långt, känner du att du har koll på koden? Är det något särskilt du funderar på?
• Hur gick det att installera simulatorn för Android?
• Var det något som krånglade eller tog extra mycket tid?

#Revision history