JavaScript som lagkage (intro til JavaScript)

JavaScript bruger man til at lave hjemmesider. Det er den allermest enkle forklaring på, hvad JavaScript er. Og den er ikke helt præcis, for JavaScript kan også bruges til at lave noget af alt dét, der er bag ved hjemmesiderne: Adgang til og kommunikation med databasen, også kaldet backenden. JavaScript kaldes for et client-side scripting language.

Nej, det har ikke noget med Java at gøre

JavaScript bliver nogle gange forvekslet med programmeringssproget Java. Selvfølgelig. Men de to programmer har ikke noget med hinanden at gøre. Ikke andet end at JavaScript et navn, der lå tæt på det allerede populære Java, så det nye JavaScript kunne ride med på Javas popularitet.

Her kan du læse mere om historien bag JavaScript

Lagkagen: HTML, CSS og JavaScript

I JavaScript arbejder man direkte i browseren, samme sted som HTML og CSS.

JavaScript bruges til at lave dynamiske hjemmesider, det vil sige, at JavaScript-koden kan få ting til at ske. For eksempel kan den få en stump tekst til blive blå, når du kører musen henover den, få noget usynlig tekst til at blive synlig, når du trykker på en knap eller gemme dit navn, som du har tastet ind i en tekstboks. Alle de ting kan ske, uden at siden “refresher”, det vil sige blinker.

Det er godt at have en grundlæggende forståelse for HTML og CSS, før man begynder på at lære JavaScript. For de arbejder sammen – de tre sprog.

Helt kort fortalt, så kan man forestille sig en lagkage i tre lag, der består af HTML, CSS og JavaScript.

Lagkagen er en lækker hjemmeside, som man kan gøre alt muligt på – for eksempel se en video eller klikke på en knap, der får det til at vælte ud med digital konfetti. Og de tre sprog HTML, CSS og JavaScript skal alle bruges til at bygge den fine hjemmeside.

HTML: Fundament og struktur

HTML er det nederste lag i lagkagen og selve fundamentet. Uden dét ville de øvrige lag i kagen svæve hjælpeløst og formålsløst rundt i luften.

På samme måde bruger man HTML til at skabe strukturen på en hjemmeside. Det er al teksten og måden, som teksten står på. For eksempel med overskrifter, underoverskrifter og brødtekst.

Når man bygger en hjemmeside, så begynder man altid med HTML.

CSS: Bokse og farver og former

Det næste lag i kagen er CSS. Det er dét sprog, som man fortsætter på, når man er færdig med at bygge strukturen i HTML.

CSS er hjemmesidens farver, kolonner og bokse; alt det, der kun har med udseendet at gøre. Noget af det ville man godt kunne skabe med HTML. Men det bliver hurtigt en rodet kode, og mulighederne er langt større i CSS.

Så når man skaber sin hjemmeside, så vil CSS være det næste trin efter HTML.

JavaScript: Digital konfetti

Det øverste lag i kagen er JavaScript. Med JavaScript kan man skabe liv på hjemmesiden ved for eksempel at lave en velkomsthilsen til besøgende med konfetti, der drysser ned over skærmen.

JavaScript er et interaktivt programmeringssprog, og det betyder, at den person, der besøger hjemmesiden for eksempel kan trykke på en knap eller udfylde en kontaktformular, og når personen gør det, så sker der noget. Måske tilmelder personen sig et nyhedsbrev ved at udfylde formularen. Måske afmelder personen et nyhedsbrev ved at trykke på knappen.

JavaScript er altså toppen af lagkagen. Med JavaScript bliver der skabt liv på hjemmesiden og mulighed for at kommunikere med den.

JavaScript er et programmeringssprog

I modsætning til HTML og CSS, så er JavaScript altså et rigtigt programmeringssprog.

HTML og CSS er henholdsvis et markup- og et style-sprog, som kun kan bruges til at lave fuldstændig statiske hjemmesider.

Med JavaScript får besøgspersonen mulighed for at bruge hjemmesiden til noget. For eksempel at tilmelde sig et nyhedsbrev.

Et programmeringssprog er altså helt firkantet sagt et kunstigt sprog, som kan give computeren noget input, som den kan behandle og derefter generere noget output på baggrund af:

Hvis besøgspersonen klikker på en knap på hjemmesiden, så vil pc’en opfange de data og behandle dem og derefter sende et resultat til besøgspersonen. Det kan være ”Tillykke. Du er den 1000. person, der har trykket på knappen”.

Hvad kan JavaScript bruges til?

JavaScript kan altså bruges til at lave interaktive hjemmesider. Blandt andet kan man lave: En velkomsthilsen til besøgende, en slider med billeder, en kontaktboks, en knap til en test eller spørgeskemaundersøgelse, et computerspil, en kagemand, der danser henover hjemmesiden og så videre.

På W3Schools kan du se mange flere eksempler på, hvad JavaScript kan bruges til.

Kom i gang med JavaScript

JavaScript er meget let at komme i gang med. Alt, hvad du har brug for, er en pc/mac, en internetforbindelse og en browser. Det vil sige, at det er præcis de samme værktøjer, som når du skal skrive din HTML og din CSS.

Download en editor

Både JavaScript, HTML og CSS skriver du i en editor. En editor kan være en ganske almindelig notepad. Men det vil være en fordel at vælge en lidt mere avanceret editor. Jeg bruger selv notepad++. Det kunne også være for eksempel DreamWeaver.

Fordelen ved at bruge en mere avanceret editor er

  1. at din kode bliver farvekodet
  2. at editoren kan genkende dit sprog og se, hvis du skriver noget forkert, og
  3. at den kan fuldføre dine kommandoer (lige som når du har intelligent ordbog på din mobiltelefon)

Hvis det er en lille hjemmeside, som du er ved at bygge, med bare en enkelt eller to sider, så kan du skrive al koden i præcis den samme editor-fil.

Hvis du arbejder på en lidt større hjemmeside, så vil det være en god idé at skrive koden i mindst tre separate filer: En eller flere HTML-sider og en eller flere filer til din CSS og JavaScript. Så undgår du nemlig at skrive for mange gentagelser, og du slipper for at ændre en masse filer, hvis du for eksempel vil have en ny farve på din hjemmeside.