Web-Dev-For-Beginners/translations/no

Webutvikling for nybegynnere - En læreplan

Lær det grunnleggende innen webutvikling med vårt 12-ukers omfattende kurs levert av Microsoft Cloud Advocates. Hver av de 24 leksjonene går i dybden på JavaScript, CSS og HTML gjennom praktiske prosjekter som terrarier, nettleserutvidelser og romspill. Delta med quizer, diskusjoner og praktiske oppgaver. Forbedre ferdighetene dine og optimaliser kunnskapsbevaringen med vår effektive prosjektbaserte pedagogikk. Start kodingsreisen din i dag!

Bli med i Azure AI Foundry Discord og møt eksperter og andre utviklere.

Følg disse trinnene for å komme i gang med disse ressursene:

1. Lag en fork av depotet: Klikk
2. Klon depotet: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
3. Bli med i Azure AI Foundry Discord og møt eksperter og andre utviklere

🌐 Flerspråklig støtte

Støttes via GitHub Action (Automatisk og alltid oppdatert)

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 | Khmer | 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

Foretrekker du å klone lokalt?

Dette depotet inkluderer over 50 språkoversettelser som øker nedlastingsstørrelsen betydelig. For å klone uten oversettelser, bruk sparse checkout:

Bash / macOS / Linux:

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'

CMD (Windows):

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 gir deg alt du trenger for å fullføre kurset med en mye raskere nedlasting.

Hvis du ønsker flere oversettelser, er de støttede språkene listet opp her

🧑‍🎓 Er du student?

Besøk Student Hub-siden hvor du finner nybegynnerressurser, studentpakker og til og med måter å få et gratis sertifikatkupong på. Dette er siden du vil bokmerke og sjekke fra tid til annen, siden vi bytter ut innhold månedlig.

📣 Kunngjøring - Nye utfordringer i GitHub Copilot Agent-modus å fullføre!

Ny utfordring lagt til, se etter "GitHub Copilot Agent Challenge 🚀" i de fleste kapitlene. Det er en ny utfordring for deg å fullføre ved å bruke GitHub Copilot og Agent-modus. Hvis du ikke har brukt Agent-modus før, kan den ikke bare generere tekst, men også opprette og redigere filer, kjøre kommandoer og mer.

📣 Kunngjøring - Nytt prosjekt å bygge med Generativ AI

Nytt AI-assistentprosjekt nettopp lagt til, sjekk det ut prosjekt

📣 Kunngjøring - Ny læreplan om Generativ AI for JavaScript ble nettopp lansert

Ikke gå glipp av vår nye Generativ AI-læreplan!

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

• Leksjoner som dekker alt fra grunnleggende til RAG.
• Samhandle med historiske karakterer ved hjelp av GenAI og vår følgesvenn-app.
• Gøyalt og engasjerende narrativ, du vil tidsreise!

Hver leksjon inkluderer en oppgave som skal fullføres, en kunnskapskontroll og en utfordring for å veilede deg i temaer som:

• Prompting og promptengineering
• Tekst- og bildeappgenerering
• Søk-apper

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

🌱 Komme i gang

Lærere, vi har inkludert noen forslag til hvordan du kan bruke denne læreplanen. Vi setter pris på tilbakemeldinger i vårt diskusjonsforum!

Elever, for hver leksjon, start med en quiz før forelesningen og les deretter forelesningsmaterialet, fullfør de forskjellige aktivitetene og sjekk forståelsen din med quiz etter forelesningen.

For å forbedre læringsopplevelsen, knytt kontakt med medelever for å jobbe sammen på prosjektene! Diskusjoner oppmuntres i vårt diskusjonsforum hvor vårt team av moderatorer vil være tilgjengelig for å svare på spørsmål.

For å utdype utdanningen anbefaler vi sterkt å utforske Microsoft Learn for ytterligere studiemateriell.

📋 Sette opp miljøet ditt

Denne læreplanen har et utviklingsmiljø klart til bruk! Når du begynner kan du velge å kjøre læreplanen i en Codespace (et nettleserbasert miljø uten behov for installasjoner), eller lokalt på din egen datamaskin ved bruk av en teksteditor som Visual Studio Code.

Opprett ditt depot

For å enkelt kunne lagre arbeidet ditt anbefales det at du lager din egen kopi av dette depotet. Du kan gjøre dette ved å klikke på Bruk denne malen-knappen øverst på siden. Dette vil opprette et nytt depot i din GitHub-konto med en kopi av læreplanen.

Følg disse trinnene:

1. Lag en fork av depotet: Klikk på "Fork" knappen øverst til høyre på denne siden.
2. Klon depotet: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

Kjøre læreplanen i en Codespace

I din kopi av dette depotet som du opprettet, trykk på Code-knappen og velg Open with Codespaces. Dette vil lage en ny Codespace hvor du kan jobbe.

Kjøre læreplanen lokalt på din egen datamaskin

For å kjøre denne læreplanen lokalt trenger du en teksteditor, en nettleser og et kommandolinjeverktøy. Vår første leksjon, Introduksjon til programmeringsspråk og verktøy for faget, vil veilede deg gjennom forskjellige alternativer for hvert av disse verktøyene slik at du kan velge det som passer deg best.

Vår anbefaling er å bruke Visual Studio Code som editor, som også har innebygd Terminal. Du kan laste ned Visual Studio Code her.

1. Klon depotet ditt til datamaskinen. Du kan gjøre dette ved å klikke på Code-knappen og kopiere URL-en:

   CodeSpace

   Deretter åpner du Terminal i Visual Studio Code og kjører følgende kommando, hvor du erstatter <your-repository-url> med URL-en du nettopp kopierte:

   git clone <your-repository-url>
   

2. Åpne mappen i Visual Studio Code. Du kan gjøre dette ved å klikke File > Open Folder og velge mappen du nettopp klonet.

Anbefalte Visual Studio Code-utvidelser:

• Live Server - for å forhåndsvise HTML-sider i Visual Studio Code
• Copilot - for å hjelpe deg å skrive kode raskere

📂 Hver leksjon inneholder:

• valgfri skisse-notat
• valgfri supplerende video
• quiz som oppvarming før leksjonen
• skrevet leksjon
• for prosjektbaserte leksjoner, trinnvise veiledninger for hvordan bygge prosjektet
• kunnskapssjekker
• en utfordring
• supplerende lesing
• oppgave
• quiz etter leksjonen

En merknad om quizer: Alle quizer er samlet i Quiz-app-mappen, totalt 48 quizer med tre spørsmål hver. De er tilgjengelige her. Quiz-appen kan kjøres lokalt eller publiseres til Azure; følg instruksjonene i quiz-app-mappen.

🗃️ Leksjoner

	Prosjektnavn	Lærte konsepter	Læringsmål	Lenket leksjon	Forfatter
01	Komme i gang	Introduksjon til programmering og verktøy	Lær det grunnleggende bak de fleste programmeringsspråk og om programvare som hjelper profesjonelle utviklere med jobben deres	Introduksjon til programmeringsspråk og verktøy	Jasmine
02	Komme i gang	Grunnleggende GitHub, inkludert arbeid i team	Hvordan bruke GitHub i prosjektet ditt, hvordan samarbeide med andre på kodebasis	Introduksjon til GitHub	Floor
03	Komme i gang	Tilgjengelighet	Lær det grunnleggende om webtilgjengelighet	Tilgjengelighetsgrunnlag	Christopher
04	JS Grunnleggende	JavaScript-datatyper	Det grunnleggende om JavaScript-datatyper	Datatyper	Jasmine
05	JS Grunnleggende	Funksjoner og metoder	Lær om funksjoner og metoder for å styre et applikasjons logikkflyt	Funksjoner og metoder	Jasmine og Christopher
06	JS Grunnleggende	Beslutninger med JS	Lær hvordan du lager betingelser i koden ved hjelp av beslutningsmetoder	Å gjøre beslutninger	Jasmine
07	JS Grunnleggende	Arrays og løkker	Arbeid med data ved bruk av arrays og løkker i JavaScript	Arrays og løkker	Jasmine
08	Terrarium	HTML i praksis	Bygg HTML for å lage et online terrarium med fokus på layout	Introduksjon til HTML	Jen
09	Terrarium	CSS i praksis	Bygg CSS for å style det online terrariet, med fokus på grunnleggende CSS inkludert responsivt design	Introduksjon til CSS	Jen
10	Terrarium	JavaScript closures, DOM-manipulering	Bygg JavaScript for å gjøre terrariet til en dra-og-slipp-grensesnitt, med fokus på closures og DOM-manipulering	JavaScript Closures, DOM-manipulering	Jen
11	Typing Game	Lag et skrive-spill	Lær å bruke tastaturhendelser til å drive logikken i JavaScript-appen din	Hendelsesdrevet programmering	Christopher
12	Green Browser Extension	Arbeid med nettlesere	Lær hvordan nettlesere fungerer, deres historie, og hvordan du lager grunnleggende elementer i en nettleserutvidelse	Om nettlesere	Jen
13	Green Browser Extension	Bygge skjema, kalle API og lagre variabler i lokal lagring	Bygg de JavaScript-elementene i nettleserutvidelsen din for å kalle et API med variabler lagret i lokal lagring	APIer, skjemaer og lokal lagring	Jen
14	Green Browser Extension	Bakgrunnsprosesser i nettleseren, webytelse	Bruk nettleserens bakgrunnsprosesser til å håndtere utvidelsens ikon; lær om webytelse og optimaliseringer	Bakgrunnsoppgaver og ytelse	Jen
15	Space Game	Mer avansert spillutvikling med JavaScript	Lær om arv ved både klasser og sammensetning samt Pub/Sub-mønsteret, som forberedelse til å lage et spill	Introduksjon til avansert spillutvikling	Chris
16	Space Game	Tegning på canvas	Lær om Canvas API, brukt til å tegne elementer på skjermen	Tegning på canvas	Chris
17	Space Game	Flytte elementer rundt på skjermen	Oppdag hvordan elementer kan få bevegelse ved bruk av kartesiske koordinater og Canvas API	Flytte elementer rundt	Chris
18	Space Game	Kollisjonsdeteksjon	Få elementer til å kollidere og reagere på hverandre med tastehendelser og tilby en nedkjølingsfunksjon for å sikre ytelse i spillet	Kollisjonsdeteksjon	Chris
19	Space Game	Poengtelling	Utfør matematiske beregninger basert på spillets status og ytelse	Poengtelling	Chris
20	Space Game	Avslutte og starte spillet på nytt	Lær om å avslutte og starte spillet på nytt, inkludert å rydde opp ressurser og tilbakestille variabelverdier	Avslutningsbetingelsen	Chris
21	Banking App	HTML-maler og ruter i et nettprogram	Lær hvordan lage skjelettet for en fler-sides nettsides arkitektur ved bruk av ruting og HTML-maler	HTML-maler og ruter	Yohan
22	Banking App	Lage innlogging og registreringsskjema	Lær om å bygge skjemaer og håndtere valideringsrutiner	Skjemaer	Yohan
23	Banking App	Metoder for henting og bruk av data	Hvordan data flyter inn og ut av appen din, hvordan hente, lagre og kvitte seg med den	Data	Yohan
24	Banking App	Konsepter for tilstandsadministrasjon	Lær hvordan appen din beholder tilstand og hvordan du kan styre den programmessig	Tilstandsadministrasjon	Yohan
25	Browser/VScode Code	Arbeide med VScode	Lær å bruke en kodeditor	Bruke VScode Code Editor	Chris
26	AI Assistants	Arbeide med AI	Lær å bygge din egen AI-assistent	AI Assistant project	Chris

🏫 Pedagogikk

Vårt pensum er utformet med to viktige pedagogiske prinsipper i tankene:

• prosjektbasert læring
• hyppige quizer

Programmet lærer grunnleggende JavaScript, HTML og CSS, i tillegg til de nyeste verktøyene og teknikkene som dagens webutviklere bruker. Studenter får muligheten til å utvikle praktisk erfaring ved å lage et skrive-spill, virtuelt terrarium, miljøvennlig nettleserutvidelse, rom-invasjonsspill og en bankapp for bedrifter. Når serien er fullført har studentene fått en solid forståelse av webutvikling.

🎓 Du kan ta de første leksjonene i dette pensumet som en Learn Path på Microsoft Learn!

Ved å sikre at innholdet samsvarer med prosjekter, blir prosessen mer engasjerende for studentene og konseptene sitter bedre. Vi skrev også flere introduksjonsleksjoner i JavaScript-grunnleggende for å introdusere konsepter, sammen med en video fra "Beginners Series to: JavaScript" samlingen av videotutorials, hvor noen av forfatterne bidro til dette pensumet.

I tillegg setter en lavterskel-quiz før timen studentens intensjon mot å lære et tema, mens en andre quiz etter timen sikrer bedre læringsutbytte. Dette pensumet er designet for å være fleksibelt og morsomt og kan tas i sin helhet eller i deler. Prosjektene starter smått og blir mer komplekse mot slutten av 12-ukers syklusen.

Selv om vi bevisst unngikk å introdusere JavaScript-rammeverk for å fokusere på grunnleggende ferdigheter som webutvikler før man tar i bruk rammeverk, er et godt neste steg etter å ha fullført dette pensumet å lære om Node.js via en annen samling videoer: "Beginner Series to: Node.js".

Besøk våre retningslinjer for Oppførselskodeks og Bidrag. Vi tar imot konstruktive tilbakemeldinger!

🧭 Offline-tilgang

Du kan kjøre denne dokumentasjonen offline ved å bruke Docsify. Fork dette repoet, installer Docsify på din lokale maskin, og så i rotmappen for dette repoet, skriv docsify serve. Nettstedet vil da serveres på port 3000 på din lokale maskin: localhost:3000.

📘 PDF

En PDF av alle leksjonene kan finnes her.

🎒 Andre Kurs

Vårt team produserer andre kurs! Sjekk ut:

LangChain

Azure / Edge / MCP / Agenter

---

Generativ AI-serie

---

Kjerne-læring

---

Copilot-serie

Få hjelp

Hvis du sitter fast eller har spørsmål om å bygge AI-apper. Bli med andre elever og erfarne utviklere i diskusjoner om MCP. Det er et støttende fellesskap hvor spørsmål er velkomne og kunnskap deles fritt.

Hvis du har produktfeedback eller feil mens du bygger, besøk:

Lisens

Dette depotet er lisensiert under MIT-lisensen. Se LICENSE-filen for mer informasjon.

---

Ansvarsfraskrivelse: Dette dokumentet er oversatt ved hjelp av AI-oversettelsestjenesten Co-op Translator. Selv om vi streber etter nøyaktighet, vennligst vær oppmerksom på at automatiske oversettelser kan inneholde feil eller unøyaktigheter. Det opprinnelige dokumentet på originalspråket skal anses som den autoritative kilden. For kritisk informasjon anbefales profesjonell menneskelig oversettelse. Vi er ikke ansvarlige for eventuelle misforståelser eller feiltolkninger som følge av bruk av denne oversettelsen.