You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Web-Dev-For-Beginners/translations/no
localizeflow[bot] 3b6a4ec479
chore(i18n): sync translations with latest source changes (chunk 11/20, 100 files)
1 month ago
..
1-getting-started-lessons chore(i18n): sync translations with latest source changes (chunk 10/20, 100 files) 1 month ago
2-js-basics chore(i18n): sync translations with latest source changes (chunk 10/20, 100 files) 1 month ago
3-terrarium chore(i18n): sync translations with latest source changes (chunk 10/20, 100 files) 1 month ago
4-typing-game chore(i18n): sync translations with latest source changes (chunk 10/20, 100 files) 1 month ago
5-browser-extension chore(i18n): sync translations with latest source changes (chunk 10/20, 100 files) 1 month ago
6-space-game chore(i18n): sync translations with latest source changes (chunk 11/20, 100 files) 1 month ago
7-bank-project chore(i18n): sync translations with latest source changes (chunk 11/20, 100 files) 1 month ago
8-code-editor/1-using-a-code-editor chore(i18n): sync translations with latest source changes (chunk 11/20, 100 files) 1 month ago
9-chat-project chore(i18n): sync translations with latest source changes (chunk 11/20, 100 files) 1 month ago
10-ai-framework-project chore(i18n): sync translations with latest source changes (chunk 10/20, 100 files) 1 month ago
Git-Basics 🌐 Update translations via Co-op Translator 4 months ago
docs 🌐 Update translations via Co-op Translator 5 months ago
lesson-template 🌐 Update translations via Co-op Translator 5 months ago
memory-game 🌐 Update translations via Co-op Translator 4 months ago
quiz-app 🌐 Update translations via Co-op Translator 5 months ago
AGENTS.md 🌐 Update translations via Co-op Translator 4 months ago
CODE_OF_CONDUCT.md 🌐 Update translations via Co-op Translator 5 months ago
CONTRIBUTING.md 🌐 Update translations via Co-op Translator 5 months ago
README.md chore(i18n): sync translations with latest source changes (chunk 11/20, 100 files) 1 month ago
SECURITY.md 🌐 Update translations via Co-op Translator 5 months ago
SUPPORT.md 🌐 Update translations via Co-op Translator 5 months ago
_404.md 🌐 Update translations via Co-op Translator 5 months ago
for-teachers.md chore(i18n): sync translations with latest source changes (chunk 11/20, 100 files) 1 month ago

README.md

GitHub license GitHub contributors GitHub issues GitHub pull-requests PRs Welcome

GitHub watchers GitHub forks GitHub stars

Microsoft Foundry Discord

Webutvikling for nybegynnere - En læreplan

Lær det grunnleggende innen webutvikling med vårt omfattende 12-ukers kurs fra Microsoft Cloud Advocates. Hver av de 24 leksjonene dykker inn i JavaScript, CSS og HTML gjennom praktiske prosjekter som terrarier, nettleserutvidelser og romspill. Engasjer deg med quizer, diskusjoner og praktiske oppgaver. Forbedre ferdighetene dine og optimaliser kunnskapsbeholdningen med vår effektive prosjektbaserte pedagogikk. Start din kodingreise i dag!

Bli med i Azure AI Foundry Discord-fellesskapet

Microsoft Foundry Discord

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

  1. Lag en fork av depotet: Klikk GitHub forks
  2. Klone 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

🌐 Støtte for flere språk

Støttet 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 | 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 å klone lokalt?

Dette depotet inkluderer 50+ språkoversettelser som betydelig øker nedlastingsstørrelsen. For å klone uten oversettelser, bruk sparsom utsjekking:

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 å få støtte for flere oversettelsesspråk, er de listet her

Open in Visual Studio Code

🧑‍🎓 Er du student?

Besøk Student Hub-siden hvor du vil finne nybegynnerressurser, studentpakker og til og med måter å få et gratis sertifikatkupong på. Dette er siden du vil bokmerke og sjekke jevnlig da 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. Dette er en ny utfordring for deg å fullføre ved hjelp av 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 Assistant-prosjekt nettopp lagt til, sjekk det ut prosjekt

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

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

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

Background

  • Leksjoner som dekker alt fra det grunnleggende til RAG.
  • Samhandle med historiske figurer ved hjelp av GenAI og vår ledsagerapp.
  • Moro og engasjerende fortelling, du vil tidsreise!

character

Hver leksjon inkluderer en oppgave å fullføre, en kunnskapssjekk og en utfordring for å veilede deg i læringstemaer som:

  • Prompting og prompt engineering
  • Tekst- og bildeapp-generering
  • 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 ønsker gjerne din tilbakemelding i vårt diskusjonsforum!

Elever, for hver leksjon, start med en forhånds-quiz og følg deretter med å lese forelesningsmaterialet, fullføre de ulike aktivitetene og sjekke din forståelse med etter-forelesnings-quizzen.

For å forbedre læringsopplevelsen din, koble deg til med jevnaldrende 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ålene dine.

For å utvide utdannelsen din, anbefaler vi sterkt å utforske Microsoft Learn for ekstra studiemateriell.

📋 Sette opp miljøet ditt

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

Opprett ditt eget depot

For at du enkelt skal kunne lagre arbeidet ditt, anbefales det å opprette 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. Klone 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, klikk på Kode-knappen og velg Åpne med Codespaces. Dette vil opprette en ny Codespace for deg å jobbe i.

Codespace

Kjøre læreplanen lokalt på datamaskinen din

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

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

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

    CodeSpace Så åpner du Terminal i Visual Studio Code og kjører følgende kommando, erstatte <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 på Fil > Åpne mappe 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 inkluderer:

  • valgfri skisse-notat
  • valgfri supplerende video
  • oppvarmingsquiz før leksjonen
  • skriftlig leksjon
  • for prosjektbaserte leksjoner, steg-for-steg guider 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 distribueres til Azure; følg instruksjonene i quiz-app-mappen.

🗃️ Leksjoner

Prosjektnavn Underviste konsepter Læringsmål Tilknyttet leksjon Forfatter
01 Komme i gang Introduksjon til programmering og verktøy Lær de grunnleggende prinsippene bak de fleste programmeringsspråk og om programvare som hjelper profesjonelle utviklere Intro til programmeringsspråk og verktøy Jasmine
02 Komme i gang Grunnleggende GitHub, inkluderer samarbeid i team Hvordan bruke GitHub i prosjektet ditt, hvordan samarbeide med andre på en kodebase Intro til GitHub Floor
03 Komme i gang Tilgjengelighet Lær det grunnleggende om webtilgjengelighet Tilgjengelighetsgrunnlag Christopher
04 JS Grunnleggende JavaScript Datatyper Grunnleggende kunnskap om JavaScript datatyper Datatyper Jasmine
05 JS Grunnleggende Funksjoner og metoder Lær om funksjoner og metoder for å håndtere logikken i en applikasjon Funksjoner og metoder Jasmine og Christopher
06 JS Grunnleggende Beslutningstaking med JS Lær å lage betingelser i koden din ved hjelp av beslutningstaking Beslutningstaking Jasmine
07 JS Grunnleggende Lister og løkker Arbeid med data ved hjelp av lister og løkker i JavaScript Lister og løkker Jasmine
08 Terrarium HTML i praksis Bygg HTML for å lage et online terrarium, med fokus på å bygge et oppsett Introduksjon til HTML Jen
09 Terrarium CSS i praksis Bygg CSS for å style det online terrariet, fokus på det grunnleggende i CSS inkludert responsivt design Introduksjon til CSS Jen
10 Terrarium JavaScript Closures, DOM-manipulasjon Bygg JavaScript som gjør terrariet funksjonelt som et dra/slipp-grensesnitt, med fokus på closures og DOM-manipulasjon JavaScript Closures, DOM-manipulasjon Jen
11 Typing Game Lag et skrivespill Lær hvordan bruke tastaturevents for å styre logikken i JavaScript-appen din Hendelsesdrevet programmering Christopher
12 Grønn Nettleserutvidelse Jobbe med nettlesere Lær hvordan nettlesere fungerer, deres historie, og hvordan du bygger de første elementene til en nettleserutvidelse Om nettlesere Jen
13 Grønn Nettleserutvidelse Bygge et skjema, kalle API og lagre variabler i lokal lagring Bygg JavaScript-elementene til nettleserutvidelsen din for å kalle et API ved bruk av lagrede variabler i lokal lagring API-er, skjemaer og lokal lagring Jen
14 Grønn Nettleserutvidelse Bakgrunnsprosesser i nettleseren, webytelse Bruk nettleserens bakgrunnsprosesser til å håndtere utvidelsens ikon; lær om webytelse og optimaliseringer Bakgrunnsoppgaver og ytelse Jen
15 Romspill Mer avansert spillutvikling med JavaScript Lær om arv ved bruk av både klasser og komposisjon og Pub/Sub-mønsteret, som forberedelse til å bygge et spill Introduksjon til avansert spillutvikling Chris
16 Romspill Tegning på canvas Lær om Canvas API, brukt for å tegne elementer på skjermen Tegning på canvas Chris
17 Romspill Flytting av elementer rundt på skjermen Oppdag hvordan elementer kan få bevegelse ved bruk av kartesiske koordinater og Canvas API Flytting av elementer Chris
18 Romspill Kollisjonsdeteksjon Få elementer til å kollidere og reagere på hverandre ved bruk av tastetrykk, og tilby en nedkjølingsfunksjon for å sikre Kollisjonsdeteksjon Chris
19 Romspill Holde poengsummer Utfør matematiske beregninger basert på spillets status og ytelse Holde score Chris
20 Romspill Avslutte og starte spillet på nytt Lær om avslutning og omstart av spillet, inkludert å rydde opp ressurser og tilbakestille variabler Avslutningsbetingelsen Chris
21 Bankapp HTML-maler og ruter i et nettapp Lær hvordan lage grunnstrukturen i en fler-sides nettside ved bruk av ruting og HTML-maler HTML-maler og ruter Yohan
22 Bankapp Lage et innloggings- og registreringsskjema Lær om å bygge skjemaer og håndtere valideringsrutiner Skjemaer Yohan
23 Bankapp Metoder for henting og bruk av data Hvordan data flyter inn og ut av appen din, hvordan hente, lagre og kvitte seg med data Data Yohan
24 Bankapp Konsepter innen tilstandshåndtering Lær hvordan appen din beholder tilstand og hvordan styre denne programmessig Tilstandshåndtering Yohan
25 Browser/VScode Code Jobbe med VScode Lær hvordan du bruker en kode-editor Bruke VScode Code Editor Chris
26 AI Assistenter Jobbe med AI Lær hvordan du bygger din egen AI-assistent AI Assistent prosjekt 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, samt de nyeste verktøyene og teknikkene som brukes av dagens webutviklere. Studentene vil få muligheten til å utvikle praktisk erfaring ved å bygge et skrivespill, virtuelt terrarium, miljøvennlig nettleserutvidelse, romskip-invasjonsspill og en bankapp for bedrifter. Ved slutten av serien vil studentene ha oppnådd en solid forståelse av webutvikling.

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

Ved å sikre at innholdet samsvarer med prosjektene, blir prosessen mer engasjerende for studentene og opprettholdelsen av konsepter blir bedre. Vi skrev også flere startleksjoner i JavaScript-grunnleggende for å introdusere konsepter, kombinert med en video fra "Beginners Series to: JavaScript"-samling av videotutorialer, hvor noen av forfatterne bidro til dette pensum.

I tillegg setter en quiz med lav innsats før en klasse studentens intensjon mot å lære et tema, mens en annen quiz etter klassen sikrer ytterligere beholdelse. Dette pensumet er designet for å være fleksibelt og moro, og kan tas i sin helhet eller delvis. Prosjektene starter smått og blir gradvis mer komplekse ved slutten av 12-ukerssyklusen.

Selv om vi bevisst har unngått å introdusere JavaScript-rammeverk for å konsentrere oss om grunnleggende ferdigheter som trengs som webutvikler før man tar i bruk et rammeverk, vil et godt neste steg etter fullføring av pensumet være å lære om Node.js via en annen samling videoer: "Beginner Series to: Node.js".

Besøk våre retningslinjer for Adferdskodeks og Bidra. Vi ønsker dine konstruktive tilbakemeldinger velkommen!

🧭 Offline tilgang

Du kan kjøre denne dokumentasjonen offline ved å bruke Docsify. Klon dette repoet, installer Docsify på din lokale maskin, og deretter i rotmappen i dette repoet skriver du docsify serve. Nettstedet vil bli servert på port 3000 på din localhost: localhost:3000.

📘 PDF

En PDF av alle leksjonene kan finnes her.

🎒 Andre kurs

Teamet vårt produserer andre kurs! Sjekk ut:

LangChain

LangChain4j for Beginners LangChain.js for Beginners


Azure / Edge / MCP / Agenter

AZD for Beginners Edge AI for Beginners MCP for Beginners AI Agents for Beginners


Generativ AI-serie

Generative AI for Beginners Generative AI (.NET) Generative AI (Java) Generative AI (JavaScript)


Kjernelæring

ML for Beginners Data Science for Beginners AI for Beginners Cybersecurity for Beginners Web Dev for Beginners IoT for Beginners XR Development for Beginners


Copilot-serie

Copilot for AI Paired Programming Copilot for C#/.NET Copilot Adventure

Få hjelp

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

Microsoft Foundry Discord

Hvis du har produktfeedback eller opplever feil under utvikling, besøk:

Microsoft Foundry Developer Forum

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 misforståelser eller feiltolkninger som oppstår ved bruk av denne oversettelsen.