JavaScript opgave – Gudhjem is

Gruppe: Sine, Lucas, Mathias & Mie

Opgaven:

• Vælg et kommercielt website og implementér enkelte udvalgte sider.
• HTML og CSS skulle skabe struktur og layout.
• JavaScript skulle tilføje interaktivitet og demonstrere centrale færdigheder fra pensum.
• Aflevering bestod af:
  1. En online fungerende prototype
  2. Et GitHub-repository med kildekode
  3. En fælles video på YouTube, hvor teamet forklarede deres JS-løsninger

Valg af case

Vi tog udgangspunkt i Gudhjem Is’ hjemmeside, da vi mente, at den kunne optimeres både visuelt og funktionelt. I stedet for blot at gengive siden, valgte vi at arbejde med et opdateret design, så vi kunne skabe en løsning, der fremstår mere nutidig og lettere at navigere i.

Processen

Da casen var valgt, fordelte vi opgaverne ud fra vores egne interesser og læringsmål. Vi ønskede alle at arbejde med funktioner, som vi kunne tage med videre i kommende projekter. Derfor arbejdede jeg med at udvikle en burgermenu, Sine fokuserede på en slider til visning af billeder, Lucas lavede en fold-ud menu, og Mathias udviklede en kontaktformular. På den måde fik vi både en bred og individuel læring inden for JavaScript.

For at sikre en fælles retning startede vi med at udarbejde et design i Figma. Det gav os et visuelt overblik og gjorde det nemmere at holde designet konsistent gennem hele processen. Selve kodningen begyndte med opbygning af struktur og styling i HTML og CSS.

Undervejs brugte vi GitHub til at håndtere vores kode. Det gjorde det muligt at arbejde parallelt uden at forstyrre hinanden, og efterfølgende samle vores arbejde via branches og merges. Samtidig gav det os en bedre forståelse for, hvordan versionsstyring fungerer i praksis.

Refleksion

Dette projekt har været med til at styrke min forståelse for, hvordan JavaScript fungerer i praksis, og hvordan små funktioner kan være med til at forbedre brugeroplevelsen på en hjemmeside. Det gjorde især en forskel at arbejde hands-on, da det gav en bedre kobling mellem teori og det konkrete arbejde med kode.

En vigtig læring for mig har været, hvor stor betydning planlægning og struktur har i udviklingsprocessen. Ved at starte med et fælles design i Figma havde vi et klart udgangspunkt, hvilket gjorde det lettere at træffe beslutninger undervejs og sikre et sammenhængende resultat. Samtidig blev det tydeligt, at selv mindre ændringer i design eller funktionalitet kan påvirke resten af løsningen, hvilket kræver overblik og løbende tilpasning.

Gruppearbejdet fungerede generelt rigtig godt, og det havde stor værdi, at vi kunne sparre med hinanden undervejs. Det gjorde det nemmere at løse udfordringer og gav en bedre forståelse, når vi forklarede vores løsninger til hinanden. Jeg oplevede også, at det styrkede min egen læring at skulle sætte ord på, hvad jeg lavede.

Arbejdet med GitHub var en ny, men vigtig del af processen. Det gav indsigt i, hvordan man kan arbejde struktureret med kode i et fælles projekt, og hvordan man undgår konflikter ved at arbejde i branches. Samtidig blev det tydeligt, hvor vigtigt det er at holde sin kode organiseret og dokumenteret, så andre kan forstå og arbejde videre på den.

Samlet set har projektet givet mig en bedre forståelse for både den tekniske del af frontend-udvikling og de samarbejdsmæssige aspekter, der følger med at arbejde i en gruppe.

Link til hjemmesiden: http://gudhjem.talbo.dk/