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] 791d3b81b4
chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes)
1 week ago
..
1-getting-started-lessons chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
2-js-basics chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
3-terrarium chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
4-typing-game chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
5-browser-extension chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
6-space-game chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
7-bank-project chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
8-code-editor/1-using-a-code-editor chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
9-chat-project chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
10-ai-framework-project chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
Git-Basics chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
docs chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
lesson-template chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
memory-game chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
quiz-app chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
.co-op-translator.json chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
AGENTS.md chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
CODE_OF_CONDUCT.md chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
CONTRIBUTING.md chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
README.md chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
SECURITY.md chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
SUPPORT.md chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
_404.md chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week ago
for-teachers.md chore(i18n): sync translations with latest source changes (chunk 1/1, 291 changes) 1 week 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 - Et læreplan

Lær det grunnleggende innen webutvikling med vårt 12-ukers omfattende kurs av Microsoft Cloud Advocates. Hver av de 24 leksjonene dykker ned 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 kunnskapsbevaringen med vår effektive prosjektbaserte pedagogikk. Start kodingsreisen din i dag!

Bli med i Azure AI Foundry Discord Community

Microsoft Foundry Discord

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

  1. Gaffel depotet: Klikk GitHub forks
  2. Klon depotet: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
  3. Bli med i Azure AI Foundry Discord og møte eksperter og andre utviklere

🌐 Flerspråklig støtte

Støttet via GitHub Action (Automatisert 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 du å klone lokalt?

Dette depotet inkluderer 50+ språkoversettelser som betydelig øker nedlastingsstørrelsen. For å klone uten oversettelser, bruk 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 gir deg alt du trenger for å fullføre kurset med en mye raskere nedlasting.

Hvis du ønsker at ytterligere oversettelsesspråk støttes, 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 fra tid til annen, da vi bytter ut innhold månedlig.

📣 Annonsering - Nye GitHub Copilot Agent-modus utfordringer å 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.

📣 Annonsering - Nytt prosjekt å bygge med Generativ AI

Nytt AI-assistentprosjekt nettopp lagt til, sjekk ut prosjektet

📣 Annonsering - Ny læreplan om Generativ AI for JavaScript ble nettopp utgitt

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

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

Background

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

character

Hver leksjon inkluderer en oppgave å fullføre, en kunnskapskontroll og en utfordring som guider deg i å lære emner som:

  • Prompting og prompt-engineering
  • Tekst- og bildeappgenerering
  • Søkeapper

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 vil gjerne ha tilbakemeldingen din i vårt diskusjonsforum!

Elever, for hver leksjon, start med en pre-forelesningsquiz og følg opp med å lese forelesningsmaterialet, fullføre de forskjellige aktivitetene og sjekk forståelsen din med post-forelesningsquizzen.

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

For å styrke utdannelsen din, anbefaler vi sterkt å utforske Microsoft Learn for flere studiematerialer.

📋 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 nødvendig), eller lokalt på datamaskinen din ved å bruke en tekstredigerer som Visual Studio Code.

Opprett depotet ditt

For at det skal være enkelt for deg å lagre arbeidet ditt, anbefales det at du oppretter din egen kopi av dette depotet. Du kan gjøre dette ved å klikke på knappen Use this template øverst på siden. Dette vil opprette et nytt depot i GitHub-kontoen din med en kopi av læreplanen.

Følg disse trinnene:

  1. Gaffel 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, klikk på Code knappen og velg Open with 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 tekstredigerer, en nettleser og et kommandolinjeverktøy. Vår første leksjon, Introduksjon til programmeringsspråk og verktøy, vil lede deg gjennom ulike alternativer for hvert av disse verktøyene slik at du kan velge det som passer best for deg.

Vår anbefaling er å bruke Visual Studio Code som redigeringsprogram, som også har en 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 Åpne deretter Terminal i Visual Studio Code og kjør følgende kommando, og erstatt <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 inkluderer:

  • valgfri skissetegning
  • valgfri supplerende video
  • forprøve før leksjonen
  • skriftlig leksjon
  • for prosjektbaserte leksjoner, steg-for-steg-veiledninger om hvordan bygge prosjektet
  • kunnskapstester
  • en utfordring
  • supplerende lesing
  • oppgave
  • etterprøve

En merknad om prøver: Alle prøver ligger i Quiz-app-mappen, totalt 48 prøver 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 Undervisningskonsepter Læringsmål Tilknyttet 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 å gjøre jobben sin Introduksjon til programmeringsspråk og verktøy Jasmine
02 Komme i gang Grunnleggende GitHub, inkludert samarbeid i team Hvordan bruke GitHub i prosjektet ditt, hvordan samarbeide med andre på en kodebase Introduksjon til GitHub Floor
03 Komme i gang Tilgjengelighet Lær det grunnleggende om tilgjengelighet på nettet Tilgjengelighetsgrunnlag Christopher
04 JS Grunnleggende JavaScript-datatyper Grunnleggende om JavaScript-datatyper Datatyper Jasmine
05 JS Grunnleggende Funksjoner og metoder Lær om funksjoner og metoder for å styre applogikken Funksjoner og metoder Jasmine og Christopher
06 JS Grunnleggende Beslutningstaking med JS Lær hvordan du lager betingelser i koden din ved bruk av beslutningsmetoder Beslutningstaking Jasmine
07 JS Grunnleggende Arrays og løkker Arbeid med data ved hjelp 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å å bygge layout Introduksjon til HTML Jen
09 Terrarium CSS i praksis Bygg CSS for å style det online terrariet med fokus på det grunnleggende i CSS inkludert å gjøre siden responsiv Introduksjon til CSS Jen
10 Terrarium JavaScript Closures, DOM-manipulasjon Bygg JavaScript for å gjøre terrariet til en dra/slipp-grensesnitt, med fokus på closures og DOM-manipulasjon JavaScript Closures, DOM-manipulasjon Jen
11 Typing Game Bygg et skrive-spill Lær hvordan du bruker tastaturhendelser til å styre logikken i JavaScript-appen Hendelsesdrevet programmering Christopher
12 Green Browser Extension Arbeide med nettlesere Lær hvordan nettlesere fungerer, deres historie, og hvordan skissere de første elementene i en nettleserutvidelse Om nettlesere Jen
13 Green Browser Extension Bygge et skjema, kalle et API og lagre variabler i lokal lagring Bygg JavaScript-elementene i nettleserutvidelsen din for å kalle et API ved bruk av variabler lagret lokalt API-er, skjemaer og lokal lagring Jen
14 Green Browser Extension Bakgrunnsprosesser i nettleseren, webytelse Bruk nettleserens bakgrunnsprosesser til å administrere utvidelsens ikon; lær om webytelse og noen optimaliseringer for å forbedre Bakgrunnsoppgaver og ytelse Jen
15 Space Game Mer avansert spillutvikling med JavaScript Lær om arv ved bruk av både klasser og komposisjon samt Pub/Sub-mønsteret, i forberedelse til å bygge et spill Introduksjon til avansert spillutvikling Chris
16 Space Game Tegning på canvas Lær om Canvas API, brukt til å tegne elementer på skjerm 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 ved hjelp av tastetrykk og tilby en avkjølingsfunksjon for å sikre ytelsen Kollisjonsdeteksjon Chris
19 Space Game Holde poengsum Utfør matematiske beregninger basert på spillets status og ytelse Holde poengsum 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 Avslutningstilstand Chris
21 Banking App HTML-maler og ruter i en webapp Lær hvordan du lager strukturen til en fler-siders nettsides arkitektur ved bruk av ruting og HTML-maler HTML-maler og ruter Yohan
22 Banking App Bygge et påloggings- og registreringsskjema Lær om bygging av skjemaer og håndtering av valideringsrutiner Skjemaer Yohan
23 Banking App Metoder for innhenting 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 tilstandshåndtering Lær hvordan appen din beholder tilstand og hvordan styre det programmessig Tilstandshåndtering Yohan
25 Browser/VScode Code Arbeide med VScode Lær hvordan du bruker en kodeeditor Bruke VScode-kodeeditor Chris
26 AI Assistants Arbeide med AI Lær hvordan du bygger din egen AI-assistent AI-assistentprosjekt Chris

🏫 Pedagogikk

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

  • prosjektbasert læring
  • hyppige prøver

Programmet lærer ut det grunnleggende i JavaScript, HTML og CSS, samt de nyeste verktøyene og teknikkene som brukes av dagens webutviklere. Studentene vil få muligheten til å utvikle praktisk erfaring gjennom å bygge et skrive-spill, virtuelt terrarium, miljøvennlig nettleserutvidelse, space-invader-inspirert spill 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 er knyttet til prosjektene blir prosessen mer engasjerende for studentene og forståelsen av konsepter vil øke. Vi skrev også flere startleksjoner om JavaScript-grunnleggende for å introdusere konsepter, kombinert med en video fra "Beginners Series to: JavaScript"-samlingen av videotutorialer, hvor noen av forfatterne bidro til dette pensumet.

I tillegg setter en lavterskelprøve før en klasse studentens intensjon mot læring av et tema, mens en andre prøve etter timen sikrer ytterligere opprettholdelse. Dette pensumet er designet for å være fleksibelt og morsomt og kan følges helt eller delvis. Prosjektene starter smått og blir stadig mer komplekse mot slutten av 12-ukers syklusen.

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

Besøk våre retningslinjer for oppførselskode og bidrag. Vi ønsker din konstruktive tilbakemelding velkommen!

🧭 Offline tilgang

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

📘 PDF

En PDF med 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 / Agents

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


Generative AI Series

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


Core Learning

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 Series

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 medlærere 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 feil under bygging, 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 betraktes som den autoritative kilden. For kritisk informasjon anbefales profesjonell menneskelig oversettelse. Vi er ikke ansvarlige for noen misforståelser eller feiltolkninger som oppstår som følge av bruk av denne oversettelsen.