Web-Dev-For-Beginners/translations/da

Webudvikling for begyndere - Et undervisningsforløb

Lær grundprincipperne i webudvikling med vores 12-ugers omfattende kursus afholdt af Microsoft Cloud Advocates. Hver af de 24 lektioner dykker ned i JavaScript, CSS og HTML gennem hands-on projekter som terrarier, browser-udvidelser og rumspil. Gennemfør quizzer, diskussioner og praktiske opgaver. Forbedr dine færdigheder og optimer din viden med vores effektive projektbaserede pædagogik. Start din kodningsrejse i dag!

Deltag i Azure AI Foundry Discord-fællesskabet

Følg disse trin for at komme i gang med at bruge disse ressourcer:

1. Fork depotet: Klik på
2. Klon depotet: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
3. Deltag i Azure AI Foundry Discord og mød eksperter og andre udviklere

🌐 Multisprog-understøttelse

Understøttet via GitHub Action (Automatiseret & Altid Opdateret)

Arabic | Bengali | Bulgarian | Burmese (Myanmar) | Chinese (Simplified) | Chinese (Traditional, Hong Kong) | Chinese (Traditional, Macau) | Chinese (Traditional, Taiwan) | Croatian | Czech | Danish | Dutch | Estonian | Finnish | French | German | Greek | Hebrew | Hindi | Hungarian | Indonesian | Italian | Japanese | Kannada | Korean | Lithuanian | Malay | Malayalam | Marathi | Nepali | Nigerian Pidgin | Norwegian | Persian (Farsi) | Polish | Portuguese (Brazil) | Portuguese (Portugal) | Punjabi (Gurmukhi) | Romanian | Russian | Serbian (Cyrillic) | Slovak | Slovenian | Spanish | Swahili | Swedish | Tagalog (Filipino) | Tamil | Telugu | Thai | Turkish | Ukrainian | Urdu | Vietnamese

Foretrækker du at klone lokalt?

Dette depot inkluderer over 50 sprogoversættelser, hvilket øger downloadstørrelsen betydeligt. For at klone uden oversættelser, brug sparse checkout:

git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'

Dette giver dig alt, hvad du behøver for at gennemføre kurset med en meget hurtigere download.

Hvis du ønsker yderligere understøttede oversættelsessprog er listet her

🧑‍🎓 Er du studerende?

Besøg Student Hub siden hvor du finder begyndervenlige ressourcer, studentpakker og endda måder at få et gratis certifikatkupon. Dette er siden, du vil bogmærke og tjekke fra tid til anden, da indholdet udskiftes månedligt.

📣 Meddelelse - Nye GitHub Copilot Agent mode udfordringer at løse!

Ny udfordring tilføjet, find "GitHub Copilot Agent Challenge 🚀" i de fleste kapitler. Det er en ny udfordring for dig at løse ved hjælp af GitHub Copilot og Agent mode. Hvis du ikke har brugt Agent mode før, kan det ikke kun generere tekst, men også oprette og redigere filer, køre kommandoer og mere.

📣 Meddelelse - Nyt projekt at bygge med Generative AI

Nyt AI Assistant-projekt tilføjet, tjek det ud projekt

📣 Meddelelse - Nyt undervisningsforløb om Generative AI for JavaScript er netop udgivet

Gå ikke glip af vores nye Generative AI undervisningsforløb!

Besøg https://aka.ms/genai-js-course for at komme i gang!

• Lektioner der dækker alt fra det grundlæggende til RAG.
• Interagér med historiske karakterer ved hjælp af GenAI og vores følgesvend-app.
• Sjov og engagerende fortælling, du vil rejse i tiden!

Hver lektion inkluderer en opgave, en videnscheck og en udfordring, der guider dig i at lære emner som:

• Prompting og prompt engineering
• Tekst- og billedapp-generering
• Søgeapps

Besøg https://aka.ms/genai-js-course for at komme i gang!

🌱 Kom godt i gang

Lærere, vi har inkluderet nogle forslag til, hvordan I kan bruge dette undervisningsforløb. Vi vil meget gerne have jeres feedback i vores diskussionsforum!

Elever, for hver lektion, start med en quiz før forelæsningen og fortsæt med at læse forelæsningsmaterialet, gennemføre de forskellige aktiviteter og tjek din forståelse med quizzen efter forelæsningen.

For at forbedre din læring, forbind med dine medstuderende for at arbejde sammen på projekterne! Diskussioner opfordres i vores diskussionsforum, hvor vores team af moderatorer vil være tilgængelige for at besvare dine spørgsmål.

For at udbygge din uddannelse anbefaler vi varmt at udforske Microsoft Learn for yderligere studie-materialer.

📋 Opsæt dit miljø

Dette undervisningsforløb har et udviklingsmiljø klar til brug! Når du starter, kan du vælge at køre undervisningsforløbet i en Codespace (et browser-baseret, ingen installation nødvendig miljø), eller lokalt på din computer ved brug af en teksteditor som Visual Studio Code.

Opret dit eget depot

For at du nemt kan gemme dit arbejde, anbefales det, at du opretter din egen kopi af dette depot. Det kan du gøre ved at klikke på knappen Use this template øverst på siden. Dette opretter et nyt depot i din GitHub-konto med en kopi af undervisningsforløbet.

Følg disse trin:

1. Fork depotet: Klik på "Fork" knappen øverst til højre på denne side.
2. Klon depotet: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

Kør undervisningsforløbet i en Codespace

I din kopi af dette depot, som du har oprettet, klik på Code knappen og vælg Open with Codespaces. Dette opretter en ny Codespace, hvor du kan arbejde.

Kør undervisningsforløbet lokalt på din computer

For at køre dette undervisningsforløb lokalt på din computer, skal du bruge en teksteditor, en browser og et kommandolinjeværktøj. Vores første lektion, Introduction to Programming Languages and Tools of the Trade, vil guide dig gennem forskellige muligheder for hvert af disse værktøjer, så du kan vælge, hvad der passer dig bedst.

Vores anbefaling er at bruge Visual Studio Code som din editor, som også har en indbygget Terminal. Du kan downloade Visual Studio Code her.

1. Klon dit depot til din computer. Det kan du gøre ved at klikke på Code knappen og kopiere URL'en:

   CodeSpace Åbn derefter Terminal i Visual Studio Code og kør følgende kommando, hvor du erstatter <your-repository-url> med den URL, du lige har kopieret:

   git clone <your-repository-url>
   

2. Åbn mappen i Visual Studio Code. Du kan gøre dette ved at klikke på File > Open Folder og vælge den mappe, du lige har klonet.

Anbefalede Visual Studio Code-udvidelser:

• Live Server - til at forhåndsvise HTML-sider i Visual Studio Code
• Copilot - til at hjælpe dig med at skrive kode hurtigere

📂 Hver lektion indeholder:

• valgfri sketchnote
• valgfri supplerende video
• for-lesson opvarmningsquiz
• skreven lektion
• for projektbaserede lektioner, trin-for-trin vejledninger i, hvordan man bygger projektet
• vidensprøver
• en udfordring
• supplerende læsning
• opgave
• quiz efter lektionen

En bemærkning om quizzer: Alle quizzer findes i Quiz-app mappen, i alt 48 quizzer med tre spørgsmål hver. De er tilgængelige her, quiz-appen kan køres lokalt eller deployeres til Azure; følg instruktionen i quiz-app mappen.

🗃️ Lektioner

	Projekt Navn	Koncepter undervist	Læringsmål	Linket Lektion	Forfatter
01	Kom i Gang	Introduktion til Programmering og Værktøjer	Lær de grundlæggende principper bag de fleste programmeringssprog og om software, der hjælper professionelle udviklere med deres arbejde	Intro til Programmeringssprog og Værktøjer	Jasmine
02	Kom i Gang	Grundlæggende GitHub, inklusiv arbejde i et team	Hvordan man bruger GitHub i dit projekt, hvordan man samarbejder med andre om en kodebase	Intro til GitHub	Floor
03	Kom i Gang	Tilgængelighed	Lær det grundlæggende om webtilgængelighed	Grundlæggende Tilgængelighed	Christopher
04	JS Grundlæggende	JavaScript Datatyper	Grundlæggende om JavaScript datatyper	Datatyper	Jasmine
05	JS Grundlæggende	Funktioner og Metoder	Lær om funktioner og metoder til at styre en applikations logik	Funktioner og Metoder	Jasmine og Christopher
06	JS Grundlæggende	Træffe beslutninger med JS	Lær hvordan man skaber betingelser i din kode ved hjælp af beslutningstagning	Tag beslutninger	Jasmine
07	JS Grundlæggende	Arrays og Loops	Arbejd med data ved hjælp af arrays og loops i JavaScript	Arrays og Loops	Jasmine
08	Terrarium	HTML i Praksis	Byg HTML'en til at skabe et online terrarium, med fokus på at bygge et layout	Introduktion til HTML	Jen
09	Terrarium	CSS i Praksis	Byg CSS'en til at style det online terrarium, med fokus på det grundlæggende i CSS inklusiv at gøre siden responsiv	Introduktion til CSS	Jen
10	Terrarium	JavaScript Closures, DOM-manipulation	Byg JavaScripten for at få terrariet til at fungere som en drag/drop interface, med fokus på closures og DOM-manipulation	JavaScript Closures, DOM-manipulation	Jen
11	Typing Game	Byg et Skrivespil	Lær hvordan man bruger tastaturhændelser til at styre logikken i din JavaScript-app	Hændelsesdrevet Programmering	Christopher
12	Grøn Browser Udvidelse	Arbejde med Browsere	Lær hvordan browsere fungerer, deres historie, og hvordan man opbygger de første elementer i en browserudvidelse	Om Browsere	Jen
13	Grøn Browser Udvidelse	Byg et formular, kald et API og gem variabler i lokal lagring	Byg JavaScript-elementerne i din browserudvidelse for at kalde et API ved brug af variabler lagret i lokal lagring	API'er, Formularer og Lokal Lagring	Jen
14	Grøn Browser Udvidelse	Baggrundsprocesser i browseren, webperformance	Brug browserens baggrundsprocesser til at styre udvidelsens ikon; lær om webperformance og nogle optimeringer for at forbedre ydeevnen	Baggrundsopgaver og Performance	Jen
15	Rumspil	Mere avanceret spiludvikling med JavaScript	Lær om arv ved brug af både klasser og sammensætning samt Pub/Sub-mønsteret som forberedelse til at bygge et spil	Introduktion til avanceret spiludvikling	Chris
16	Rumspil	Tegning på canvas	Lær om Canvas API'et, der bruges til at tegne elementer på en skærm	Tegning på Canvas	Chris
17	Rumspil	Flytte elementer rundt på skærmen	Opdag hvordan elementer kan få bevægelse ved brug af kartesiske koordinater og Canvas API'en	Flytte elementer rundt	Chris
18	Rumspil	Kollision detektion	Få elementer til at kollidere og reagere på hinanden ved hjælp af tastetryk og lever en cooldown-funktion for at sikre spillets ydeevne	Kollisiondetektion	Chris
19	Rumspil	Holde styr på point	Udfør matematiske beregninger baseret på spillets status og præstation	Holde styr på point	Chris
20	Rumspil	Afslutte og genstarte spillet	Lær om at afslutte og genstarte spillet, inklusive oprydning af ressourcer og nulstilling af variabelværdier	Afslutningsbetingelsen	Chris
21	Bank App	HTML-skabeloner og ruter i et Web App	Lær hvordan man opretter scaffoldet til en multipage hjemmesidestruktur ved brug af routing og HTML-skabeloner	HTML-skabeloner og ruter	Yohan
22	Bank App	Byg en Login- og Registreringsformular	Lær om at bygge formularer og håndtere valideringsrutiner	Formularer	Yohan
23	Bank App	Metoder til at hente og bruge data	Hvordan data flyder ind og ud af din app, hvordan man henter det, gemmer det, og bortskaffer det	Data	Yohan
24	Bank App	Koncepter for State Management	Lær hvordan din app bevarer tilstand og hvordan man styrer det programmæssigt	State Management	Yohan
25	Browser/VScode Code	Arbejde med VScode	Lær hvordan man bruger en kodeeditor	Brug VScode Code Editor	Chris
26	AI Assistants	Arbejde med AI	Lær hvordan man bygger sin egen AI-assistent	AI Assistant projekt	Chris

🏫 Pædagogik

Vores pensum er designet med to nøglepædagogiske principper i tankerne:

• projektbaseret læring
• hyppige quizzer

Programmet underviser i JavaScripts, HTML's og CSS' grundlæggende elementer samt de nyeste værktøjer og teknikker, der bruges af nutidens webudviklere. Studerende får mulighed for at opnå praktisk erfaring ved at bygge et skrive spil, virtuelt terrarium, en miljøvenlig browserudvidelse, et rum-invader-stil spil og en bankapp til virksomheder. Ved slutningen af serien vil studerende have opnået en solid forståelse af webudvikling.

🎓 Du kan tage de første par lektioner i dette pensum som en Læringsvej på Microsoft Learn!

Ved at sikre at indholdet er knyttet til projekter, bliver processen mere engagerende for eleverne og fastholdelsen af konceptet forbedres. Vi skrev også flere introduktionslektioner i JavaScript-grundlæggende for at introducere koncepter, parret med en video fra "Beginners Series to: JavaScript" samlingen af videotutorials, hvoraf nogle forfattere bidrog til dette pensum.

Derudover sætter en lavrisiko quiz før en klasse elevens intention mod at lære et emne, mens en anden quiz efter klassen sikrer yderligere fastholdelse. Dette pensum er designet til at være fleksibelt og sjovt og kan tages helt eller delvist. Projekterne starter småt og bliver mere komplekse mod slutningen af 12-ugers cyklussen.

Selvom vi bevidst har undgået at introducere JavaScript-rammer for at koncentrere os om de grundlæggende færdigheder, der er nødvendige som webudvikler før man adopterer et framework, vil et godt næste skridt til at fuldføre dette pensum være at lære om Node.js via en anden samling videoer: "Beginner Series to: Node.js".

Besøg vores Code of Conduct og Contributing retningslinjer. Vi værdsætter din konstruktive feedback!

🧭 Offline adgang

Du kan køre denne dokumentation offline ved at bruge Docsify. Fork dette repo, installer Docsify på din lokale maskine, og i rodmappen af dette repo, skriv docsify serve. Hjemmesiden vil blive serveret på port 3000 på din localhost: localhost:3000.

📘 PDF

En PDF med alle lektionerne kan findes her.

🎒 Andre Kurser

Vores team laver også andre kurser! Se:

LangChain

---

Azure / Edge / MCP / Agenter

---

Generativ AI Serie

---

Kerne Læring

---

Copilot Serie

Få Hjælp

Hvis du sidder fast eller har spørgsmål om at bygge AI-apps. Deltag sammen med andre elever og erfarne udviklere i diskussioner om MCP. Det er et støttende fællesskab, hvor spørgsmål er velkomne, og viden deles frit.

Hvis du har produktfeedback eller oplever fejl under udviklingen, besøg:

Licens

Dette repository er licenseret under MIT-licensen. Se LICENSE filen for flere oplysninger.

---

Ansvarsfraskrivelse: Dette dokument er blevet oversat ved hjælp af AI-oversættelsestjenesten Co-op Translator. Selvom vi stræber efter nøjagtighed, bedes du være opmærksom på, at automatiserede oversættelser kan indeholde fejl eller unøjagtigheder. Det oprindelige dokument på dets modersmål bør betragtes som den autoritative kilde. For kritisk information anbefales professionel menneskelig oversættelse. Vi påtager os intet ansvar for misforståelser eller fejltolkninger, der opstår som følge af brugen af denne oversættelse.