Skip to content
Kursen webtec

Kmom01: Kom igång med HTML, CSS och JavaScript ⚠️

Vi börjar med att bygga en enkel webbplats med grunderna i HTML, CSS och JavaScript. Vi skapar en god struktur och uppdelning av filer och kataloger som förbereder oss för större projekt. Vi lär oss grundeläggande begrepp som används när man bygger en webbplats.

Vi tar hjälp av validatorer för att kontrollera att vi skriver koden på ett korrekt sätt.

Samtidigt som vi bygger webbplatsen bekantar vi oss med en resurser som är bra för att lära sig mer om de tekniker vi använder.

Läs & Studera

(4 studietimmar)

Här kan du på egen hand studera och förbereda dig inför övningar och uppgifter.

Föreläsning

Titta på följande inspelade föreläsningar. Föreläsningarna kan innehålla tips om läsanvisningar.

  1. Introduktion till Webbteknologier
  2. Introduktion till HTML
  3. Introduktion till CSS
  4. JavaScript

Litteratur

Studera litteratur och resurser enligt följande.

  1. Kika snabbt igenom de resurser som finns om HTML HyperText Markup Language på webbplatsen MDN.

  2. Kika snabbt igenom de resurser som finns om CSS Cascading Style Sheets på webbplatsen MDN.

  3. Kika snabbt igenom de resurser som finns om JavaScript på webbplatsen MDN.

Ovan webbsidor är vår referensmanual när det gäller dessa tekniker. Försök gärna landa på någon av dessa webbplatser när du googlar efter information. Börja din googling med “mdn” eller inkludera tekniken “mdn html” och därefter lägger du til det du söker på.

Vill du ha enklare material att komma igång med så finns det tutorials på W3Schools.

Video för orientering

Titta på följande videor/filmer. Filmerna är tänkta att ge dig en allmän orientering i det område som behandlas i kursmomentet.

  • A brief history of the World Wide Web (3 min)

Videorna ovan finner du även i spellistan “Kursen webtec: Om webbteknologier HTML, CSS och JavaScript för att bygga webbplatser och webbtjänster”.

Instuderingsfrågor

Här finns ett antal instuderingsfrågor som hjälper dig att finna information på egen hand för att träna på de koncept som är relevanta för detta kmom.

Instuderingsfrågor om HTML
  1. Vad står HTML för?
Instuderingsfrågor om CSS
  1. Vad står CSS för?
Instuderingsfrågor om JavaScript
  1. Ge en kort historik över programmeringsspråket JavaScript.

Övningar & Uppgifter

(8-12 studietimmar)

Övningar är träning inför uppgifterna, det är ofta klokt att jobba igenom övningarna då de förbereder dig inför uppgifterna. Uppgifter skall utföras och redovisas.

Övningar

Jobba igenom övningarna, de förbereder dig inför uppgifterna.

  1. Jobba igenom övningen “Skapa en webbsida med HTML, CSS och JavaScript” som hjälper dig bygga en webbplats med HTML, CSS och JavaScript.

  2. Gå igenom artikeln om inbyggda typer i JavaScript.

Uppgifter

Följande uppgifter skall utföras och resultatet skall redovisas.

  1. Utför laborationen “Lab 1: Grunderna i JavaScript”.

  2. Gör uppgiften “Skapa en rapportsida till webtec-kursen (v2)”.

Resultat & Redovisning

(1-2 studietimmar)

Läs instruktionen om hur du skall redovisa.

Se till att följande frågor besvaras i din redovisningstext.

  • Vilken utvecklingsmiljö använder du (operativsystem, texteditor, terminal, mm)?
  • Gick det bra att installera labbmiljön eller var det något som krånglade?
  • Är du bekant med terminalen och Unix-kommandon sedan tidigare?
  • Är du bekant med HTML, CSS och JavaScript sedan tidigare eller har du jobbat med liknande tekniker?
  • Gick det bra att komma i gång med kursmomentet rent allmänt eller var det något som var lurigt, svårt eller utmanande?
  • Vilken är din TIL för detta kmom?

TIL är en akronym för “Today I Learned” vilket leksamt anspelar på att det finns alltid nya saker att lära sig, varje dag. Man brukar lyfta upp saker man lärt sig och där man kanske hajade till lite extra över dess nyttighet eller enkelhet, eller så var det bara en ny lärdom för dagen som man vill notera.