Indførelsen

  • 5 minutter

Det er imponerende, hvad du kan gøre på internettet i dag. Du kan bygge weboplevelser, der kører på alle enheder, inkludere alle mulige former for medieindhold og udføre kompliceret beregning. Du kan endda oprette apps, der ser ud og føles som oprindelige programmer.

Hvis du er interesseret i at starte webudvikling i dag, står du muligvis over for en svimlende række muligheder. I dette modul lærer du de grundlæggende komponenter på et websted og nogle værktøjer, du kan bruge til at starte webudvikling. Du skal bruge HTML, CSS og JavaScript sammen til at bygge et websted og derefter bruge udviklerværktøjer i browseren til at forstå, hvad der sker.

Med denne grundlæggende viden på plads har du en bedre kontekst til at træffe beslutninger i fremtiden, når du bygger websteder. Om du f.eks. skal vælge JavaScript-strukturer eller oprette dine egne JavaScript-funktioner for at bygge dit websted.

Lad os komme i gang ved at se på, hvor vi vil hen.

Scenario

Forestil dig, at du er webudvikler, og at du er blevet bedt om at få din virksomheds websted til at appellere til en bredere vifte af kunder. Hvis du vil give dine kunder mulighed for at tilpasse deres oplevelse på dit websted, beslutter du dig for at tilføje understøttelse af lyse og mørke temaer. Du opretter et lille websted med blåstempling for at demonstrere understøttelse af temaer ved hjælp af CSS, og du skriver en JavaScript-funktion for at skifte mellem disse temaer.

Når det er fuldført, ser dit websted ud som i dette eksempel, når det mørke tema er valgt:

Skærmbillede, der viser det færdige websted med dets mørke tema aktiveret.

Hvad er der på en webside?

Indholdet, typografien og den interaktive logik er opdelt i henholdsvis HTML-, CSS- og JavaScript-filer. Et designprincip i moderne programmering er adskillelse af bekymringer. Blandt de mange grunde til at adskille bekymringer er to enkelthed og genbrug. Ved f.eks. at formatere HTML-elementer ved hjælp af CSS kan du forenkle din HTML-kode. I stedet for at kode udseendet i hvert element skal du anvende CSS-typografier på alle elementerne på en side, uanset sidekompleksitet. Derudover kan du linke flere HTML-sider til en enkelt CSS-fil, hvilket kan hjælpe med at forenkle et ensartet udseende på tværs af hele dit websted.