Interaktiv applikasjon!

Du skal lage en interaktiv applikasjon som løser et konkret behov for en bestemt målgruppe. Du skal bruke Python og Flask, kjøre applikasjonen som en Docker-container på en server i Proxmox, og vise innhold som kommer fra data eller brukerinput.

Eksemplene under er bare ment som inspirasjon. Prøv helst å finne på et eget konsept. Tenk på hvem som skal bruke løsningen, hvilket problem den løser, og hva som gjør den nyttig:

• værmelding for Sandnes med “husk paraply!”
• dagens sitat med innsending og stemmegivning
• busstider eller annen lokal informasjon
• kantine-app med dagens meny og kalender
• digitalt klippekort for kantinen
• skritteller-ledertavle

Forkunnskaper og rammer

Du kan grunnleggende Python, Jinja og Linux-terminalen. Du trenger en Debian- eller Ubuntu-server i Proxmox med Docker, samt rettigheter til å sette opp applikasjonen i et godkjent testmiljø. Ved publisering trenger du et domenenavn, DNS-oppslag og en reverse proxy med avtalt tilgang. Bruk opplysningene fra den som administrerer miljøet; lokale adresser og tilgangsavtaler følger ikke denne fagressursen.

Før du lager brukerinteraksjonen, prøver du skjemaeksemplet i Flask 1. Der ser du forskjellen på et GET-søk med request.args og et POST-skjema med request.form, og hvordan du håndterer tom input.

Mål for prosjektet

Når prosjektet er ferdig, skal du ha øvd på å:

• planlegge en løsning ut fra et brukerbehov
• beskrive hva løsningen skal gjøre, og lage et enkelt brukergrensesnitt
• bruke Flask-routes, Jinja-templates og data fra Python eller en datakilde
• bygge og starte applikasjonen som Docker-container på serveren
• dokumentere løsningen og vise hvordan den kan driftes videre

Del 1 - Ide og planlegging

Start med å velge et problem eller en målgruppe. Skriv et kort planleggingsdokument med:

• konseptnavn og en kort pitch
• målgruppe og hvilket behov du løser
• minst tre funksjonelle krav
• hvilke data som skal være dynamiske, og hvor de kommer fra
• skisse eller wireframe av hovedsiden og eventuelle ekstra visninger
• rekkefølgen på arbeidet og et kontrollpunkt for hver hoveddel

Presenter ideen kort for en mulig bruker eller en annen som kan gi tilbakemelding før du går videre. Bruk tilbakemeldingene til å gjøre ideen tydeligere eller enklere.

Del 2 - Lag applikasjonen

Applikasjonen må:

• bruke Python og Flask
• ha en hovedroute og minst én annen route
• bruke minst én Jinja-template med variabler, for-loop og if-sjekk
• vise innhold som kommer fra Python, JSON, database eller et API
• ha minst én tydelig brukerhandling som påvirker resultatet, for eksempel at brukeren sender inn et skjema, søker etter noe, filtrerer en liste, stemmer på et alternativ eller registrerer en oppføring
• ha feilhåndtering eller en tydelig visning når data ikke finnes
• fungere på enhetene målgruppen skal bruke

Du kan bruke JavaScript til små forbedringer, men hovedinnholdet skal genereres av serveren (Flask).

Del 3 - Docker og publisering

Applikasjonen skal kjøres på serveren, ikke bare på din egen datamaskin.

1. Lag en Dockerfile som bygger applikasjonen.
2. Lag en requirements.txt eller tilsvarende oversikt over avhengigheter.
3. Bygg et image og start containeren på Debian- eller Ubuntu-serveren.
4. Test først applikasjonen lokalt på serveren, for eksempel med curl http://127.0.0.1:APP-PORT. Bytt APP-PORT med den publiserte containerporten.
5. Test deretter domenet gjennom reverse proxyen. Direkte tilgang fra andre maskiner og tilgang fra internett skal følge avtalene for testmiljøet. Ikke åpne flere porter enn løsningen trenger.
6. Dokumenter kommandoene som trengs for å bygge, starte, stoppe og oppdatere løsningen.

Se Docker - Kom i gang, Bygg et image med Dockerfile og Docker - Publisere applikasjon. Compose er valgfritt: Kjør og oppdater appen med Compose.

Levering

Lever ved å pushe prosjektet til GitHub. Repositoryet skal inneholde:

1. all kildekode, templates, CSS og eventuelt JavaScript
2. Dockerfile og avhengighetsfil
3. planleggingsdokument med ide, målgruppe, krav og skisser
4. README med installasjon, oppstart og oppdatering
5. lenke til den publiserte applikasjonen, eller navnet den har i et internt testmiljø, og en kort forklaring av hvordan den kjøres
6. test- og feilsøkingslogg som viser hva du testet, hva som feilet og hvordan du rettet det
7. kort refleksjon over hva som fungerte, hva som var vanskelig og hva du ville gjort videre

Når du står fast

Følg feilen fra ytterst til innerst: test først Flask lokalt, deretter containeren på serveren, og til slutt domenet gjennom reverse proxyen. Les feilmeldingen og noter hva du har prøvd før du søker etter en løsning. Ressursene i Docker - Kom i gang, Bygg et image med Dockerfile, Kjør og oppdater appen med Compose og Docker - Publisere applikasjon forklarer både begrepene og kommandoene steg for steg.

README-filen skal være skrevet slik at andre kan sette opp prosjektet uten muntlig forklaring. Ta med forutsetninger, installasjon, miljøvariabler, kommandoer, test-URL-er og vanlige feilmeldinger. Ikke legg passord, API-nøkler eller annen sensitiv informasjon i repositoryet.

Vurderingskriterier

• Ide og brukerbehov: Konseptet er forståelig, begrunnet og tilpasset en målgruppe.
• Funksjonalitet: Applikasjonen har fungerende routes, interaksjon og dynamiske data.
• Brukergrensesnitt: Løsningen er ryddig, lesbar og tilpasset målgruppen.
• Teknisk løsning: Flask, Jinja og Docker er brukt på en hensiktsmessig måte.
• Drift og dokumentasjon: Applikasjonen kan startes på serveren, og andre kan følge dokumentasjonen.
• Testing og refleksjon: Du har testet løsningen og kan forklare valg, feil og forbedringer.