JavaScript Real Life

Proces:

I dette projekt skulle vi prøve kræfter af i at lave en “kopi” af en eksisterende hjemmeside med brug af Javascript som vi havde fået undervisning i ugen før.

Første punkt var at finde hjemmeside vi ville arbejde med, vi snakkede først om store kendte virksomheder, men valgte i sidste ende en lidt mere simpelthen hjemmeside Årslev bibliotek, det virkede mere let og overskueligt. 

Vi valgte dernæst kun at fokusere på forsiden, hvor vi dernæst delte ud i mellem os hvilken sektion vi ville arbejde med. Mads foreslog at jeg skulle kigge på åbningstiderne så det gik jeg i kast med. 

Hen ad vejen da åbningstiderne var blevet lavet med html og css, slog det mig at det ikke var så nemt at få Javascript med ind over, særligt ikke hvis det skulle indeholde hele pensum. Derfor snakkede jeg med de andre om at jeg ville lave menuen og derved lave en dropdowm med åbningstiderne inden i. 

Menuen i sig selv troede jeg var nem nok, og jeg tænkte at den da bare var bygget op i flex, men efter mine inspiceringer og konklusioner i forhold til at få elementerne til at lægge på nøjagtig samme måde – fandt jeg ud af at den var bygget op i en blanding af grid og flex, samt at det slåedes også var en grid inden i en grid !

– jeg prøvede ihærdigt på at regne ud hvordan den var bygget op, men måtte give fortabt for al frustration og tog et billede af hovedmenuen og spurgte chatgpt hvordan den var bygget op. Den gav mig dernæst en kode som på ingen måde lignede det originale men som havde den struktur som jeg ikke selv kunne regne ud. Jeg rettede dernæst selv efter med ikoner og tekst samt blev klogere på hvordan man kunne rette på størrelser på fraktioner i griden. 

Da det kom til javascripten havde jeg jo skabelonen på åbningstiderne, men som var bygget op af html og css, jeg jo havde længe arbejdet på at få bygget menuen så jeg tog en hurtig beslutning og spurgte chat gpt endnu en gang om den kunne omdanne mine åbningstider til et array samt lave det om til en dropdown menu med if or else. 

I første omgang lavede chatgpt en super kortfattet kode som var med ord som forEach eller $-tegn og det forstod jeg ikke noget af og kunne samtidig heller ikke genkende det fra undervisningen, derfor skrev jeg videre til chatgpt og jeg fandt således ud af at det vi lærer i skolen lige nu er “klassisk Javascript” – som jo så er en lidt dybdeforklaret kode med “i++” istedet for at skrive forEach som forkorter koden. 

Nu gav Javascriptkoden, ikke meget mere, men mere mening og jeg kunne se logikken i den, selvom jeg også synes det lidt omstændigt når det kommer til if og else.

Min menu nåede aldrig at ligne helt, men det var tæt nok på til at jeg kunne leve med det.

Vi nåede alle i mål og fik implementerede hele pensum i hver af vores sektioner. *klapsalver*  

(Nu må vi se hvad der bliver sagt til feedbacken) 

Refleksion:

Det var svært! – og følte mig som en kæmpe taber i forhold til at jeg spurgte mig til råds ved chatgpt så meget. Men jeg har prøvet at forklare mig selv at alt designet bag har jeg jo haft forstand på og at kunne læse mig frem til inde i koden hvordan de forskellige elementer skulle rettes, så helt tabt bag en vogn er jeg ikke når det kommer til kodningen. Nu er bare at jeg skal lære at elske logikken bag Javascript, selvom jeg jo synes det er en kende omstændigt og super forvirrende.

Angående gruppen, har det været helt upåklageligt ! – jeg har dog været dårlig til at bede om hjælp i  gruppen i forhold til Javascript og tog hellere sagen i egen hånd. – jeg ved nu at jeg skal finde en måde at bruge min gruppe til dette og at jeg skal stoppe med med at være bekymret over at jeg ikke er stærk til Javascript, det er jo derfor at jeg går i skole.