Forberedelse

• Læs resten af kapitel 15. Dvs. afsnit 15.5 Arrays og Loops til og med afsnit 15.7 Funktioner og Events plus afsnit 15.9 Sådan arbejder frontend og backend sammen
• Hvis du har brug for et overblik, så genlæs det første afsnit i kapitel 15

Formål

• Få mere rutine i at arbejde med AppLab
• Kunne genkende forskellige kodemønstre

Fælles gennemgang

Fra sidst

• Hvad er fronend, backend og database for noget
• Forklar figuren her

Lektien til denne gang

• Gennemgå en BMI beregner: https://studio.code.org/projects/applab/3-YSD0MHzP5RYoZagWx9iahyiYnMg5Nm7jSJq7CGuMA
• Forklar begreberne:
  • Variabel
  • Sekvens
  • Forgrening-betingelse
  • Loops og arrays
  • Funktioner og events
  • Kommentar

Øvelser

22.1 Arrays og loops

Det eneste, du ikke har prøvet endnu, er at se på arrays og loops. Lav en kopi af appen Arrays og loops: Klik først på linket nedenfor, så på “Vis kode” og til sidst på “Bland igen”/”Remix”. Så har du en kopi https://studio.code.org/projects/applab/jgzg-pvNC9B0q-CWdUiL9qKshtSgwkRa9if1sYg0BLE

• Prøv app’en af:
  • Klik først på knappen “Vis array/liste”
  • Skriv så et navn, f.eks. “Julius” i det nederste felt
  • Klik så på knappen “Indsæt element” og så knappen “Vis array/liste”
• Prøv at forstå koden:
  • Hvordan er variablen i linje 2 forskellig fra andre variable
  • Hvad tror du, at den blå kode, der starter med “For” laver. Tip: Den gentager det antal gange, som arrayet er langt. “Langt” er “length” på engelsk, og koden forstår kun engelsk
• Prøv at lave listen om, så der i stedet for “Arne” står “Anders” og i stedet for “Bodil” står “Bolette”. Du er nødt til at redigere i koden i linje 2
• Prøv at tilføje “Åge” til den liste, der vises fra start. Dvs. du skal modificere linje 2 arrayet “Klasseliste” inde i selve koden

Hvis du vil prøve at kode arrays og loops selv, så kan du se videoen her:

22.2 Teori

• Udfyld skemaet her og prøv at forklare det med dine egne ord, ikke de ord, jeg har brugt i videoerne
• Forklar, hvad de enkelte elementer kunne bruges til
• Gå på jagt i dine apps. Find eksempler inden for hvert enkelt kategori og sæt et skærmklip ind. Jeg har hjulpet dig lidt med “Kommentar”
• PS: Gør noget ud af det, du får brug for det til din eksamen :-).

UDTRYK	FORKLARING
Variabel
Sekvens
Forgrening og betingelse
Arrays og loops
Events og funktioner
Kommentarer	Kommentarer er mennesketekst, som du fx kan bruge til fortælle hvad du gør i kodningen. Kommentarer står med gråt. Kommentarer påvirker ikke resten af koden

22.3 Postnummer-app

Du skal lave en postnummer-app.

• Brugeren skal kunne indtaste et postnummer, fx 6000
• Programmet skal så kunne skrive på skærmen, hvilken landsdel, du er fra
  • Hvis postnummeret er under 5000, skal programmet skrive “Du bor øst for Storebælt”
  • Hvis postnummeret er 5000 eller derover, skal programmet skrive “Du bor vest for Storebælt”
  • Vi ser høfligst bort fra postnumre på Færøerne og Grønland
• Tegn rutediagrammet og kod app’en. Tip: Hvilken kode er det, der kan træffe en beslutning?
• Når det er i orden, skal du lave en lille forbedring. Hvis man har et postnummer, der er over 4999 men under 6000, så bor man på Fyn.
  • Tegn rutediagrammet
  • Tag en kopi af dit program, så du ikke ødelægger det, der fungerer
    • Hvis koden er under 5000, skal programmet skrive “Du bor øst for Storebælt”
    • Hvis koden er over 4999 men under 6000, skal programmet skrive “Du bor på Fyn”
    • Hvis koden er 6000 eller derover, skal programmet skrive “Du bor i Jylland”

22.4 Flere kodeeksempler

• Lav en kopi af Pizza-appen her https://studio.code.org/projects/applab/n5bTHQX7i2JkHxWE6Cg2k3tRlTxxYSEuWhol9smjO0o
• Kør Pizza App’en og se, hvad den kan. Prøv f.eks. at bestille en Pizza og se, hvad der sker.

Når du har navigeret rundt i Pizza Appen, så skal du svare på følgende spørgsmål. For hvert spørgsmål skal du

• tage et skærmdump af den relevante kode
• forklare hvad der sker i koden, gerne ved hjælp af kommentarer inde i koden. Du skal bruge fagudtryk for kodning i din forklaring (f.eks. variabel, loop osv.)

Her er spørgsmålene

Gå dybere ned i appen:

• Hvordan navigerer man fra side til side i appen
• Hvordan bærer appen sig ad med at vise en Pizzas navn og pris
• Hvordan bladrer man i appen (se skærmdump herunder, det er pilene til venstre og højre)

Bestil et par tilfældige pizzaer

• Hvordan virker knappen “Bestil pizza”
• Hvordan tæller appen antal og pris sammen
• Hvordan virker knappen “Vis bestilling”

Når du klikker på knappen “Vis bestilling”, kommer du over på en anden side

• Hvordan bærer appen sig ad med at vise listen over din bestilling og prisen
• Hvordan virker knappen “Tøm kurven”
• Hvordan virker knappen “Tilbage”