From 4d3d19aa326ea9b7b26388ac538a6221328e4662 Mon Sep 17 00:00:00 2001 From: "localizeflow[bot]" Date: Fri, 6 Feb 2026 17:38:13 +0000 Subject: [PATCH] chore(i18n): sync translations with latest source changes (chunk 1/1, 12 changes) --- translations/fi/.co-op-translator.json | 12 +- translations/fi/AGENTS.md | 314 ++++++++++---------- translations/fi/README.md | 198 ++++++------- translations/fi/Roadmap.md | 53 ++++ translations/nl/.co-op-translator.json | 12 +- translations/nl/AGENTS.md | 380 +++++++++++++------------ translations/nl/README.md | 239 ++++++++-------- translations/nl/Roadmap.md | 53 ++++ translations/no/.co-op-translator.json | 12 +- translations/no/AGENTS.md | 304 ++++++++++---------- translations/no/README.md | 185 ++++++------ translations/no/Roadmap.md | 53 ++++ 12 files changed, 1009 insertions(+), 806 deletions(-) create mode 100644 translations/fi/Roadmap.md create mode 100644 translations/nl/Roadmap.md create mode 100644 translations/no/Roadmap.md diff --git a/translations/fi/.co-op-translator.json b/translations/fi/.co-op-translator.json index d2ce72f3d..1d03ea269 100644 --- a/translations/fi/.co-op-translator.json +++ b/translations/fi/.co-op-translator.json @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2025-10-03T11:30:52+00:00", + "translation_date": "2026-02-06T17:37:08+00:00", "source_file": "AGENTS.md", "language_code": "fi" }, @@ -516,11 +516,17 @@ "language_code": "fi" }, "README.md": { - "original_hash": "490c83786552d7fab6390991517bef09", - "translation_date": "2026-01-29T18:36:15+00:00", + "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc", + "translation_date": "2026-02-06T17:32:01+00:00", "source_file": "README.md", "language_code": "fi" }, + "Roadmap.md": { + "original_hash": "28bf6185fd7f27b62ddc210514366192", + "translation_date": "2026-02-06T17:34:24+00:00", + "source_file": "Roadmap.md", + "language_code": "fi" + }, "SECURITY.md": { "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228", "translation_date": "2025-08-27T20:03:36+00:00", diff --git a/translations/fi/AGENTS.md b/translations/fi/AGENTS.md index 8a06ccddc..126016364 100644 --- a/translations/fi/AGENTS.md +++ b/translations/fi/AGENTS.md @@ -1,28 +1,28 @@ # AGENTS.md -## Projektin yleiskatsaus +## Projektin yleiskuvaus -Tämä on opetusohjelman arkisto, joka on suunniteltu opettamaan verkkokehityksen perusteita aloittelijoille. Opetusohjelma on kattava 12 viikon kurssi, jonka Microsoft Cloud Advocates on kehittänyt. Se sisältää 24 käytännön oppituntia, jotka käsittelevät JavaScriptiä, CSS:ää ja HTML:ää. +Tämä on opetuksellinen opetussuunnitelmarepositorio, joka on tarkoitettu web-kehityksen perusteiden opettamiseen aloittelijoille. Opetussuunnitelma on kattava 12 viikon kurssi, jonka ovat kehittäneet Microsoft Cloud Advocates, ja se sisältää 24 käytännön oppituntia, jotka kattavat JavaScriptin, CSS:n ja HTML:n. ### Keskeiset osat -- **Opetussisältö**: 24 jäsenneltyä oppituntia, jotka on järjestetty projektipohjaisiin moduuleihin -- **Käytännön projektit**: Terrarium, kirjoituspeli, selainlaajennus, avaruuspeli, pankkisovellus, koodieditori ja tekoäly-chat-avustaja -- **Interaktiiviset visailut**: 48 visailua, joissa on 3 kysymystä (ennen/jälkeen oppituntien arvioinnit) -- **Monikielinen tuki**: Automaattiset käännökset yli 50 kielelle GitHub Actionsin avulla -- **Teknologiat**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (tekoälyprojekteihin) +- **Opetussisältö**: 24 rakenteellista oppituntia projektipohjaisissa moduuleissa +- **Käytännön projektit**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor ja AI Chat Assistant +- **Interaktiiviset tietovisat**: 48 tietovisaa, joissa on 3 kysymystä (ennen ja jälkeen oppitunnin arvioinnit) +- **Monikielinen tuki**: Automaattiset käännökset yli 50 kielelle GitHub Actionsin kautta +- **Teknologiat**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (tekoälyprojekteissa) ### Arkkitehtuuri -- Opetusarkisto, jossa oppituntipohjainen rakenne +- Opetuksellinen arkisto oppituntipohjaisella rakenteella - Jokainen oppituntikansio sisältää README-tiedoston, koodiesimerkkejä ja ratkaisuja -- Erilliset projektit omissa hakemistoissaan (quiz-app, eri oppituntiprojektit) -- Käännösjärjestelmä GitHub Actionsin avulla (co-op-translator) -- Dokumentaatio Docsifyn kautta ja saatavilla PDF-muodossa +- Itsenäiset projektit omissa hakemistoissaan (quiz-app, eri oppituntiprojektit) +- Käännösjärjestelmä GitHub Actionsin (co-op-translator) avulla +- Dokumentaatio tarjotaan Docsifylla ja se on saatavilla myös PDF:nä ## Asennuskomennot -Tämä arkisto on ensisijaisesti tarkoitettu opetussisällön käyttöön. Yksittäisten projektien kanssa työskentelyyn: +Tämä arkisto on ensisijaisesti tarkoitettu opetussisällön kulutukseen. Työskennellessäsi tiettyjen projektien kanssa: ### Pääarkiston asennus @@ -31,14 +31,14 @@ git clone https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners ``` -### Visailusovelluksen asennus (Vue 3 + Vite) +### Quiz-sovelluksen asennus (Vue 3 + Vite) ```bash cd quiz-app npm install -npm run dev # Start development server -npm run build # Build for production -npm run lint # Run ESLint +npm run dev # Käynnistä kehityspalvelin +npm run build # Rakenna tuotantoon +npm run lint # Suorita ESLint ``` ### Pankkiprojektin API (Node.js + Express) @@ -46,237 +46,237 @@ npm run lint # Run ESLint ```bash cd 7-bank-project/api npm install -npm start # Start API server -npm run lint # Run ESLint -npm run format # Format with Prettier +npm start # Käynnistä API-palvelin +npm run lint # Suorita ESLint +npm run format # Muotoile Prettierilla ``` -### Selainlaajennusprojektit +### Selaimen laajennusprojektit ```bash cd 5-browser-extension/solution npm install -# Follow browser-specific extension loading instructions +# Noudata selaimen erityisiä laajennuksen latausohjeita ``` -### Avaruuspeli-projektit +### Space Game -projektit ```bash cd 6-space-game/solution npm install -# Open index.html in browser or use Live Server +# Avaa index.html selaimessa tai käytä Live Serveriä ``` -### Chat-projekti (Python-taustajärjestelmä) +### Chat-projekti (Python backend) ```bash cd 9-chat-project/solution/backend/python pip install openai -# Set GITHUB_TOKEN environment variable +# Aseta GITHUB_TOKEN-ympäristömuuttuja python api.py ``` -## Kehitystyönkulku +## Kehitysprosessi -### Sisällön tuottajille +### Sisällön tekijöille 1. **Forkkaa arkisto** GitHub-tilillesi -2. **Kloonaa forkattu arkisto** paikallisesti +2. **Kloonaa forkki** paikallisesti 3. **Luo uusi haara** muutoksillesi 4. Tee muutoksia oppituntisisältöön tai koodiesimerkkeihin 5. Testaa koodimuutokset asiaankuuluvissa projektihakemistoissa -6. Lähetä pull requestit noudattaen osallistumisohjeita +6. Lähetä pull requestit ohjeiden mukaisesti ### Oppijoille 1. Forkkaa tai kloonaa arkisto -2. Siirry oppituntihakemistoihin järjestyksessä -3. Lue README-tiedostot jokaisesta oppitunnista -4. Suorita ennakkovisailut osoitteessa https://ff-quizzes.netlify.app/web/ -5. Työskentele oppituntihakemistojen koodiesimerkkien parissa +2. Siirry oppituntihakemistoihin peräkkäin +3. Lue jokaisen oppitunnin README-tiedostot +4. Täytä oppituntia edeltävät tietovisat osoitteessa https://ff-quizzes.netlify.app/web/ +5. Työskentele koodiesimerkkien parissa oppituntikansioissa 6. Suorita tehtävät ja haasteet -7. Tee jälkivisailut +7. Tee oppituntia seuraavat tietovisat ### Live-kehitys - **Dokumentaatio**: Suorita `docsify serve` juurihakemistossa (portti 3000) -- **Visailusovellus**: Suorita `npm run dev` quiz-app-hakemistossa -- **Projektit**: Käytä VS Code Live Server -laajennusta HTML-projekteihin -- **API-projektit**: Suorita `npm start` asiaankuuluvissa API-hakemistoissa +- **Quiz-sovellus**: Suorita `npm run dev` quiz-app-hakemistossa +- **Projektit**: Käytä VS Code Live Server -laajennusta HTML-projekteissa +- **API-projektit**: Suorita `npm start` vastaavissa API-hakemistoissa ## Testausohjeet -### Visailusovelluksen testaus +### Quiz-sovelluksen testaus ```bash cd quiz-app -npm run lint # Check for code style issues -npm run build # Verify build succeeds +npm run lint # Tarkista koodityyliongelmat +npm run build # Varmista, että käännös onnistuu ``` ### Pankki-API:n testaus ```bash cd 7-bank-project/api -npm run lint # Check for code style issues -node server.js # Verify server starts without errors +npm run lint # Tarkista koodityyliongelmat +node server.js # Varmista, että palvelin käynnistyy virheittä ``` -### Yleinen testauslähestymistapa +### Yleinen testausmenetelmä -- Tämä on opetusarkisto, jossa ei ole kattavia automatisoituja testejä +- Tämä on opetuksellinen arkisto ilman kattavia automatisoituja testejä - Manuaalinen testaus keskittyy: - - Koodiesimerkit toimivat ilman virheitä - - Dokumentaation linkit toimivat oikein - - Projektien rakennus onnistuu - - Esimerkit noudattavat parhaita käytäntöjä + - Koodiesimerkkien virheettömään suorittamiseen + - Dokumentaation linkkien toimivuuteen + - Projektikäännösten onnistumiseen + - Esimerkkien noudattavan parhaita käytäntöjä -### Ennen lähettämistä tarkistettavat asiat +### Ennen lähettämistä tehtävät tarkistukset - Suorita `npm run lint` hakemistoissa, joissa on package.json -- Varmista, että markdown-linkit ovat kelvollisia +- Varmista markdown-linkkien pätevyys - Testaa koodiesimerkit selaimessa tai Node.js:ssä -- Tarkista, että käännökset säilyttävät oikean rakenteen +- Tarkista, että käännökset säilyttävät rakenteen ## Koodityyliohjeet ### JavaScript - Käytä modernia ES6+ syntaksia -- Noudata projektien mukana tulevia ESLint-konfiguraatioita -- Käytä merkityksellisiä muuttuja- ja funktiotunnuksia opetuksen selkeyden vuoksi +- Noudata projektien antamia ESLint-asetuksia +- Käytä merkityksellisiä muuttuja- ja funktioiden nimiä opetuksen selkeyden vuoksi - Lisää kommentteja, jotka selittävät käsitteitä oppijoille -- Muotoile Prettierillä, jos se on konfiguroitu +- Muotoile Prettierillä, missä konfiguroitu ### HTML/CSS - Semanttiset HTML5-elementit - Responsiivisen suunnittelun periaatteet -- Selkeät luokkanimikonventiot +- Selkeät luokkien nimikäytännöt - Kommentit, jotka selittävät CSS-tekniikoita oppijoille ### Python - PEP 8 -tyyliohjeet -- Selkeät, opettavaiset koodiesimerkit -- Tyyppivihjeet, jos ne auttavat oppimisessa +- Selkeät, opetukselliset koodiesimerkit +- Tyyppivihjeet, jos hyödyllisiä oppimisen kannalta ### Markdown-dokumentaatio - Selkeä otsikkohierarkia -- Koodilohkot, joissa on kielimääritys +- Koodilohkot kielimäärittelyillä - Linkit lisäresursseihin -- Kuvakaappaukset ja kuvat `images/`-hakemistoissa -- Alt-teksti kuvien saavutettavuuden vuoksi +- Kuvakaappaukset ja kuvat `images/` hakemistoissa +- Kuvien alt-tekstit saavutettavuutta varten -### Tiedostojen organisointi +### Tiedostojen järjestely -- Oppitunnit numeroitu järjestyksessä (1-getting-started-lessons, 2-js-basics jne.) -- Jokaisessa projektissa on `solution/` ja usein `start/` tai `your-work/` hakemistot -- Kuvat tallennettu oppituntikohtaisiin `images/`-kansioihin -- Käännökset `translations/{language-code}/` rakenteessa +- Oppitunnit numeroitu peräkkäin (1-getting-started-lessons, 2-js-basics jne.) +- Jokaisella projektilla on `solution/` ja usein `start/` tai `your-work/` hakemistot +- Kuvat tallennettu oppituntikohtaisiin `images/` kansioihin +- Käännökset sijaitsevat `translations/{language-code}/` rakenteessa -## Rakennus ja käyttöönotto +## Kokoaminen ja julkaisu -### Visailusovelluksen käyttöönotto (Azure Static Web Apps) +### Quiz-sovelluksen julkaisu (Azure Static Web Apps) -Visailusovellus on konfiguroitu Azure Static Web Apps -käyttöönottoa varten: +Quiz-app on konfiguroitu Azure Static Web Apps -julkaisua varten: ```bash cd quiz-app -npm run build # Creates dist/ folder -# Deploys via GitHub Actions workflow on push to main +npm run build # Luo dist/-kansion +# Ottaa käyttöön GitHub Actions -työnkulun kautta siirron yhteydessä main-haaraan ``` Azure Static Web Apps -konfiguraatio: - **Sovelluksen sijainti**: `/quiz-app` -- **Tuotoksen sijainti**: `dist` +- **Tulosteen sijainti**: `dist` - **Työnkulku**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` -### Dokumentaation PDF-luonti +### Dokumentaation PDF:n luonti ```bash -npm install # Install docsify-to-pdf -npm run convert # Generate PDF from docs +npm install # Asenna docsify-to-pdf +npm run convert # Luo PDF docsista ``` ### Docsify-dokumentaatio ```bash -npm install -g docsify-cli # Install Docsify globally -docsify serve # Serve on localhost:3000 +npm install -g docsify-cli # Asenna Docsify globaalisti +docsify serve # Tarjoa palvelu localhost:3000:ssa ``` -### Projektikohtaiset rakennukset +### Projektikohtaiset rakentamiset Jokaisella projektihakemistolla voi olla oma rakennusprosessi: -- Vue-projektit: `npm run build` luo tuotantopaketit -- Staattiset projektit: Ei rakennusvaihetta, palvele tiedostoja suoraan +- Vue-projektit: `npm run build` luo tuotantopaketteja +- Staattiset projektit: Ei rakennusvaihetta, palvele tiedostot suoraan -## Pull Request -ohjeet +## Pull request -ohjeet ### Otsikkomuoto Käytä selkeitä, kuvaavia otsikoita, jotka kertovat muutoksen alueen: -- `[Quiz-app] Lisää uusi visailu oppitunnille X` +- `[Quiz-app] Lisää uusi tietovisa oppitunnille X` - `[Lesson-3] Korjaa kirjoitusvirhe terrarium-projektissa` - `[Translation] Lisää espanjankielinen käännös oppitunnille 5` - `[Docs] Päivitä asennusohjeet` -### Vaaditut tarkistukset +### Vaadittavat tarkistukset Ennen PR:n lähettämistä: 1. **Koodin laatu**: - - Suorita `npm run lint` asiaankuuluvissa projektihakemistoissa + - Suorita `npm run lint` vaikutuksille joutuvissa hakemistoissa - Korjaa kaikki lint-virheet ja -varoitukset -2. **Rakennuksen tarkistus**: - - Suorita `npm run build`, jos sovellettavissa - - Varmista, ettei rakennusvirheitä ole +2. **Rakennuksen varmistus**: + - Suorita `npm run build` jos sovellettavissa + - Varmista ettei rakennusvirheitä ilmene -3. **Linkkien validointi**: +3. **Linkkien tarkistus**: - Testaa kaikki markdown-linkit - - Varmista, että kuvaviittaukset toimivat + - Varmista kuvaviitteiden toimivuus -4. **Sisällön tarkistus**: - - Oikolue oikeinkirjoitus ja kielioppi - - Varmista, että koodiesimerkit ovat oikein ja opettavaisia +4. **Sisällön tarkastus**: + - Tarkista oikeinkirjoitus ja kielioppi + - Varmista koodiesimerkkien oikeellisuus ja opetuksellisuus - Tarkista, että käännökset säilyttävät alkuperäisen merkityksen ### Osallistumisvaatimukset -- Hyväksy Microsoft CLA (automaattinen tarkistus ensimmäisessä PR:ssä) +- Hyväksy Microsoft CLA (automaattinen tarkistus ensimmäisessä PR:ssa) - Noudata [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) -- Katso [CONTRIBUTING.md](./CONTRIBUTING.md) yksityiskohtaisia ohjeita varten -- Viittaa ongelmanumeroihin PR-kuvauksessa, jos sovellettavissa +- Katso yksityiskohtaiset ohjeet [CONTRIBUTING.md](./CONTRIBUTING.md) tiedostosta +- Viittaa issue-numeroihin PR-kuvauksessa, jos sovellettavissa -### Tarkistusprosessi +### Tarkastusprosessi -- PR:t tarkistetaan ylläpitäjien ja yhteisön toimesta -- Opetuksen selkeys on etusijalla +- PR:t tarkastetaan ylläpitäjien ja yhteisön toimesta +- Opetuksellinen selkeys on prioriteetti - Koodiesimerkkien tulee noudattaa nykyisiä parhaita käytäntöjä -- Käännökset tarkistetaan tarkkuuden ja kulttuurisen sopivuuden osalta +- Käännökset tarkastetaan tarkkuudesta ja kulttuurillisesta sopivuudesta ## Käännösjärjestelmä ### Automaattinen käännös -- Käyttää GitHub Actionsia co-op-translator-työnkululla +- Käyttää GitHub Actionsia co-op-translator -työnkulun kanssa - Kääntää automaattisesti yli 50 kielelle -- Lähdetiedostot päähakemistoissa -- Käännetyt tiedostot `translations/{language-code}/` hakemistoissa +- Lähdetiedostot ovat pääkansioissa +- Käännetyt tiedostot ovat `translations/{language-code}/` hakemistoissa -### Manuaalisten käännösparannusten lisääminen +### Käsin tehtävät käännösten parannukset 1. Etsi tiedosto `translations/{language-code}/` hakemistosta 2. Tee parannuksia säilyttäen rakenne 3. Varmista, että koodiesimerkit toimivat edelleen -4. Testaa lokalisoitu visailusisältö +4. Testaa mahdolliset lokalisoidut tietovisasisällöt -### Käännöksen metadata +### Käännösten metatiedot -Käännetyt tiedostot sisältävät metadataotsikon: +Käännetyt tiedostot sisältävät metatietojen otsikon: ```markdown +**Vastuuvapauslauseke**: +Tämä asiakirja on käännetty käyttäen tekoälypohjaista käännöspalvelua [Co-op Translator](https://github.com/Azure/co-op-translator). Vaikka pyrimme tarkkuuteen, on hyvä huomioida, että automaattiset käännökset saattavat sisältää virheitä tai epätarkkuuksia. Alkuperäistä asiakirjaa sen alkuperäiskielellä tulee pitää auktoritatiivisena lähteenä. Tärkeissä asioissa suositellaan ammattimaista ihmiskäännöstä. Emme ole vastuussa mistään väärinymmärryksistä tai virhetulkinnoista, jotka johtuvat tämän käännöksen käytöstä. + \ No newline at end of file diff --git a/translations/fi/README.md b/translations/fi/README.md index fb29b43f9..6f8b87d80 100644 --- a/translations/fi/README.md +++ b/translations/fi/README.md @@ -2,7 +2,7 @@ [![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/) [![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/) [![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/) -[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) +[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) [![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/) @@ -12,191 +12,193 @@ # Verkkokehitys aloittelijoille - Opetussuunnitelma -Opi verkkokehityksen perusteet 12 viikon kattavalla kurssillamme, jonka on kehittänyt Microsoft Cloud Advocates. Jokainen 24 oppitunnista syventyy JavaScriptiin, CSS:ään ja HTML:ään käytännön projektien kautta, kuten terrariumeihin, selaimen laajennuksiin ja avaruuspeliin. Osallistu visoihin, keskusteluihin ja käytännön tehtäviin. Kehitä taitojasi ja optimoi tiedon säilytyskykyä tehokkaan projektipohjaisen opetusmetodimme avulla. Aloita koodausmatkasi jo tänään! +Opi verkkokehityksen perusteet kattavassa 12 viikon kurssissamme, jonka järjestävät Microsoft Cloud Advocates -tiimin jäsenet. Jokainen 24 oppitunnista sukeltaa JavaScriptiin, CSS:ään ja HTML:ään käytännön projektien, kuten terrarion, selaimen laajennusten ja avaruuspeliin, kautta. Osallistu tietokilpailuihin, keskusteluihin ja käytännön tehtäviin. Paranna taitojasi ja optimoi oppimisesi tehokkaalla projektipohjaisella opetuksellamme. Aloita koodausmatkasi tänään! Liity Azure AI Foundry Discord -yhteisöön [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -Noudata näitä vaiheita päästäksesi alkuun näiden resurssien kanssa: -1. **Haarauta repositorio**: Klikkaa [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) -2. **Kloonaa repositorio**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +Noudata näitä ohjeita aloittaaksesi näiden resurssien käytön: +1. **Forkkaa Repository**: Klikkaa [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +2. **Kloonaa Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` 3. [**Liity Azure AI Foundry Discordiin ja tapaa asiantuntijoita ja muita kehittäjiä**](https://discord.com/invite/ByRwuEEgH4) ### 🌐 Monikielinen tuki -#### Tuettu GitHub Actionin kautta (automaattinen ja aina ajan tasalla) +#### Tuettu GitHub Actionin kautta (Automaattinen & Aina ajan tasalla) -[Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](./README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) +[Arabia](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgaria](../bg/README.md) | [Burma (Myanmar)](../my/README.md) | [Kiina (yksinkertaistettu)](../zh-CN/README.md) | [Kiina (perinteinen, Hongkong)](../zh-HK/README.md) | [Kiina (perinteinen, Macao)](../zh-MO/README.md) | [Kiina (perinteinen, Taiwan)](../zh-TW/README.md) | [Kroatia](../hr/README.md) | [Tsekki](../cs/README.md) | [Tanska](../da/README.md) | [Hollanti](../nl/README.md) | [Viro](../et/README.md) | [Suomi](./README.md) | [Ranska](../fr/README.md) | [Saksa](../de/README.md) | [Kreikka](../el/README.md) | [Heprea](../he/README.md) | [Hindi](../hi/README.md) | [Unkari](../hu/README.md) | [Indonesia](../id/README.md) | [Italia](../it/README.md) | [Japani](../ja/README.md) | [Kannada](../kn/README.md) | [Korea](../ko/README.md) | [Liettua](../lt/README.md) | [Malaiji](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norja](../no/README.md) | [Persia (Farsi)](../fa/README.md) | [Puola](../pl/README.md) | [Portugali (Brasilia)](../pt-BR/README.md) | [Portugali (Portugali)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romania](../ro/README.md) | [Venäjä](../ru/README.md) | [Serbia (kyrillinen)](../sr/README.md) | [Slovakki](../sk/README.md) | [Sloveeni](../sl/README.md) | [Espanja](../es/README.md) | [Swahili](../sw/README.md) | [Ruotsi](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkki](../tr/README.md) | [Ukraina](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnam](../vi/README.md) -> **Haluatko kloonata paikallisesti?** +> **Haluatko Kloonaa Paikallisesti?** -> Tässä repositoriossa on yli 50 käännöstä, mikä lisää merkittävästi latauskoon. Jos haluat kloonata ilman käännöksiä, käytä sparse checkoutia: +> Tämä arkisto sisältää yli 50 kielen käännöksiä, jotka lisäävät huomattavasti lataustiedoston kokoa. Jos haluat kloonata ilman käännöksiä, käytä sparse checkout:a: > ```bash > 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' > ``` -> Tämä antaa sinulle kaiken, mitä tarvitset kurssin suorittamiseen huomattavasti nopeammalla latauksella. +> Tämä antaa sinulle kaiken tarvittavan kurssin suorittamiseen paljon nopeammalla latauksella. -**Jos haluat lisätä tuettuja käännöskieliä, ne on listattu [tässä](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** +**Jos haluat lisätä lisää käännettyjä kieliä, tuetut kielet löytyvät [täältä](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** -[![Avaa Visual Studio Codessa](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Avaa%20Visual%20Studio%20Codessa&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) +[![Avaa Visual Studio Codessa](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) #### 🧑‍🎓 _Oletko opiskelija?_ -Vieraile [**Student Hub -sivulla**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), josta löydät aloittelijan resurssit, opiskelijapaketit ja jopa tapoja saada ilmainen sertifikaattikuponki. Tämä on sivu, jonka haluat tallentaa kirjanmerkkeihin ja tarkistaa säännöllisesti, sillä sisältöä vaihdetaan kuukausittain. +Vieraile [**Student Hub -sivulla**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon), josta löydät aloittelijan resurssit, opiskelijapaketit ja jopa tapoja saada ilmainen sertifikaattivoucher. Tämä on sivu, jonka haluat tallentaa kirjanmerkkeihin ja tarkistaa silloin tällöin, sillä sisältömme vaihtuu kuukausittain. -### 📣 Ilmoitus – Uusia GitHub Copilot Agent -tilan haasteita suoritettavaksi! +### 📣 Ilmoitus - Uudet GitHub Copilot Agent -tilahaasteet suoritettavaksi! -Uusi haaste lisätty, katso "GitHub Copilot Agent Challenge 🚀" useimmista luvuista. Tämä on uusi haaste, jonka voit suorittaa käyttämällä GitHub Copilotia ja Agent-tilaa. Jos et ole aiemmin käyttänyt Agent-tilaa, se pystyy paitsi generoimaan tekstiä, myös luomaan ja muokkaamaan tiedostoja, suorittamaan komentoja ja muuta. +Uusi haaste lisätty, etsi "GitHub Copilot Agent Challenge 🚀" useimmista luvuista. Tämä on uusi haaste sinulle, joka suoritetaan käyttämällä GitHub Copilotia ja Agent-tilaa. Jos et ole käyttänyt Agent-tilaa aiemmin, se pystyy paitsi tuottamaan tekstiä, myös luomaan ja muokkaamaan tiedostoja, suorittamaan komentoja ja muuta. -### 📣 Ilmoitus – _Uusi generatiiviseen tekoälyyn perustuva projekti rakennettavaksi_ +### 📣 Ilmoitus - _Uusi Generatiivisen tekoälyn projekti rakennettavaksi_ -Uusi AI-avustajaprojekti juuri lisätty, tutustu [projektiin](./9-chat-project/README.md) +Uusi tekoälyavustajaprojekti juuri lisätty, tutustu [projektiin](./9-chat-project/README.md) -### 📣 Ilmoitus – _Uusi Generative AI -opetussuunnitelma JavaScriptille julkaistu_ +### 📣 Ilmoitus - _Uusi opetussuunnitelma_ Generatiivisesta tekoälystä JavaScriptille juuri julkaistu Älä jää paitsi uudesta Generative AI -opetussuunnitelmastamme! -Aloita [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) +Aloita osoitteessa [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)! ![Tausta](../../translated_images/fi/background.148a8d43afde5730.webp) -- Oppitunteja perusteista RAG-malliin asti. -- Keskustele historiallisten hahmojen kanssa GenAI:n ja kumppanisovelluksemme avulla. -- Hauska ja mukaansatempaava tarinankerronta, matkustat ajassa! +- Oppitunteja kaikesta alkeista RAG:iin asti. +- Ole vuorovaikutuksessa historiallisten hahmojen kanssa GenAI:n ja kumppanisovelluksemme avulla. +- Hauska ja mukaansatempaava kertomus, matkustat ajassa! ![hahmo](../../translated_images/fi/character.5c0dd8e067ffd693.webp) -Jokainen oppitunti sisältää tehtävän suoritettavaksi, tietokokeen ja haasteen, jotka ohjaavat sinua oppimaan aiheita, kuten: -- Promptauksen ja promptinsuunnittelun perusteet -- Teksti- ja kuvapohjaiset sovellukset +Jokaisessa oppitunnissa on suoritettava tehtävä, tietotarkistus ja haaste, jotka ohjaavat sinua oppimaan aiheista kuten: +- Kehote ja kehotteen suunnittelu +- Tekstin ja kuvan sovellustuotanto - Hakusovellukset -Aloita täällä: [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course) +Aloita osoitteessa [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)! + + ## 🌱 Aloittaminen -> **Opettajat**, olemme [sisällyttäneet ehdotuksia](for-teachers.md) tämän opetussuunnitelman käyttöön. Toivomme palautettasi [keskustelufoorumissamme](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! +> **Opettajat**, olemme [sisällyttäneet joitain ehdotuksia](for-teachers.md) tämän opetussuunnitelman käytöstä. Haluaisimme saada palautettanne [keskustelufoorumissamme](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! -**[Oppijat](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, aloita jokainen oppitunti ennakkokyselyllä ja jatka luentomateriaalin lukemisella, suorita erilaiset aktiviteetit ja testaa ymmärryksesi jälkikyselyllä. +**[Oppijat](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, aloita jokainen oppitunti ennakkotietovisalla ja jatka sitten luentomateriaalin lukemiseen, erilaisten aktiviteettien suorittamiseen ja ymmärryksesi tarkistamiseen luennon jälkeisellä visalla. -Paranna oppimiskokemustasi liittymällä vertaistesi seuraan projekteissa! Keskustelut ovat tervetulleita [keskustelufoorumillamme](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), jossa moderaattoritiimimme vastaa kysymyksiisi. +Parantaaksesi oppimiskokemustasi, ota yhteyttä muihin oppijoihin työskennelläksesi projekteissa yhdessä! Keskusteluja kannustetaan [keskustelufoorumissamme](https://github.com/microsoft/Web-Dev-For-Beginners/discussions), jossa moderaattoritiimimme on valmiina vastaamaan kysymyksiisi. -Syvennä osaamistasi tutustumalla myös [Microsoft Learniin](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) lisäopetusmateriaaleja varten. +Jatka opiskelua tutustumalla suositelloimme [Microsoft Learning -materiaaleihin](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon). -### 📋 Ympäristön asennus +### 📋 Ympäristön asettaminen -Tämän opetussuunnitelman kehitysympäristö on valmiina! Aloittaessasi voit valita suorittaa opetussuunnitelman [Codespacessa](https://github.com/features/codespaces/) (_selaimessa toimiva, ei asennuksia vaativa ympäristö_) tai paikallisesti tietokoneellasi tekstieditorilla, kuten [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +Tässä opetussuunnitelmassa on kehitysympäristö valmiina käyttöön! Alkaessasi voit valita suorittaa opetussuunnitelman [Codespacessa](https://github.com/features/codespaces/) (selainsovellus, johon ei tarvitse asentaa mitään) tai paikallisesti tietokoneella tekstieditorilla, kuten [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). #### Luo oma repositoriosi -Jotta voit helposti tallentaa työsi, suosittelemme luomaan oman kopion tästä repositoriosta. Voit tehdä tämän painamalla sivun yläreunassa olevaa **Use this template** -painiketta. Tämä luo uuden repositorion GitHub-tilillesi, joka sisältää kopion opetussuunnitelmasta. +Jotta voit helposti tallentaa työsi, on suositeltavaa luoda oma kopiosi tästä repositoriosta. Voit tehdä tämän napsauttamalla sivun yläreunassa olevaa **Use this template** -painiketta. Tämä luo uuden repositorion GitHub-tilillesi opetussuunnitelman kopion kera. Noudata näitä ohjeita: -1. **Haarauta repositorio**: Klikkaa tämän sivun oikeassa yläkulmassa olevaa "Fork"-painiketta. -2. **Kloonaa repositorio**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +1. **Forkkaa Repository**: Klikkaa "Fork" -painiketta tämän sivun oikeassa yläkulmassa. +2. **Kloonaa Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -#### Opetussuunnitelman suorittaminen Codespacessa +#### Suorita opetussuunnitelma Codespacessa -Oman kopion repositoriosta luomasi jälkeen napsauta **Code**-painiketta ja valitse **Open with Codespaces**. Tämä luo sinulle uuden Codespace-ympäristön työskennellä. +Oman kopiosi repositoriosta, jonka loit, klikkaa **Code** -painiketta ja valitse **Open with Codespaces**. Tämä luo uuden Codespacen, jossa voit työskennellä. ![Codespace](../../translated_images/fi/createcodespace.0238bbf4d7a8d955.webp) -#### Opetussuunnitelman suorittaminen paikallisesti tietokoneellasi +#### Suorita opetussuunnitelma paikallisesti tietokoneellasi -Jos haluat suorittaa opetussuunnitelman paikallisesti tietokoneellasi, tarvitset tekstieditorin, selaimen ja komentorivityökalun. Ensimmäinen oppituntimme, [Johdanto ohjelmointikieliin ja työkaluihin](../../1-getting-started-lessons/1-intro-to-programming-languages), opastaa sinut eri vaihtoehtojen pariin, jotta voit valita itsellesi sopivimmat työkalut. +Suorittaaksesi opetussuunnitelman paikallisesti tarvitset tekstieditorin, selaimen ja komentorivityökalun. Ensimmäinen oppituntimme, [Ohjelmointikielien ja työkalujen perusasioiden esittely](../../1-getting-started-lessons/1-intro-to-programming-languages), opastaa sinua erilaisten näiden työkalujen vaihtoehtojen valinnassa. -Suosittelemme käyttämään tekstieditorina [Visual Studio Codea](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon), joka sisältää myös sisäänrakennetun [Komentorivin](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Voit ladata Visual Studio Coden [tästä](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +Suosituksemme on käyttää tekstieditorina [Visual Studio Codea](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon), jossa on myös sisäänrakennettu [Komentorivi](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Voit ladata Visual Studio Coden [tästä](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). -1. Kloonaa oma repositorio tietokoneellesi. Voit tehdä tämän klikkaamalla **Code**-painiketta ja kopioimalla URL-osoitteen: +1. Kloonaa oma repositoriosi tietokoneellesi. Voit tehdä tämän napsauttamalla **Code** -painiketta ja kopioimalla URL-osoitteen: [CodeSpace](./images/createcodespace.png) - Sitten avaa [Pääte](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) Visual Studio Codessa [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ja suorita seuraava komento korvaten `` juuri kopioimallasi URL-osoitteella: + Avaa sitten [Terminaali](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) [Visual Studio Codessa](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ja suorita seuraava komento korvaten `` juuri kopioimallasi URL-osoitteella: ```bash git clone ``` -2. Avaa kansio Visual Studio Codessa. Voit tehdä tämän valitsemalla **Tiedosto** > **Avaa kansio** ja valitsemalla juuri kloonaamasi kansion. +2. Avaa kansio Visual Studio Codessa. Voit tehdä tämän napsauttamalla **Tiedosto** > **Avaa kansio** ja valitsemalla juuri kloonaamasi kansion. > Suositellut Visual Studio Code -laajennukset: > -> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - esikatsele HTML-sivuja suoraan Visual Studio Codessa -> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - auttaaksesi sinua kirjoittamaan koodia nopeammin +> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - HTML-sivujen esikatseluun Visual Studio Codessa +> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - koodin kirjoittamisen nopeuttamiseen ## 📂 Jokainen oppitunti sisältää: -- valinnaisen luonnosmuistion +- valinnaisen luonnosmuistiinpanon - valinnaisen lisävideon -- ennakkolämmittelykyselyn ennen oppituntia -- kirjallisen oppitunnin -- projektilähtöisissä oppitunneissa vaiheittaiset ohjeet projektin rakentamiseen -- tietotestin +- ennakkolämmittelykyselyn +- kirjoitetun oppitunnin +- projektipohjaisissa oppitunneissa vaiheittaiset ohjeet projektin rakentamiseen +- tietovarmistukset - haasteen - lisälukemista - tehtävän - [oppitunnin jälkeisen kyselyn](https://ff-quizzes.netlify.app/web/) -> **Huomio kyselyistä**: Kaikki kyselyt löytyvät Quiz-app-kansiosta, yhteensä 48 kyselyä joissa jokaisessa kolme kysymystä. Ne ovat saatavilla [tässä](https://ff-quizzes.netlify.app/web/). Kyselysovelluksen voi ajaa paikallisesti tai julkaista Azureen; noudata ohjeita `quiz-app`-kansiossa. +> **Huomautus kyselyistä**: Kaikki kyselyt on koottu Quiz-app-kansioon, yhteensä 48 kyselyä, joissa kullakin on kolme kysymystä. Ne ovat saatavilla [tässä](https://ff-quizzes.netlify.app/web/). Kyselysovelluksen voi suorittaa paikallisesti tai ottaa käyttöön Azureen; noudata `quiz-app`-kansion ohjeita. ## 🗃️ Oppitunnit -| | Projektin nimi | Opitut käsitteet | Oppimistavoitteet | Linkitetty oppitunti | Tekijä | -| :-: | :-------------------------------------------------------: | :--------------------------------------------------------------------: | -------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | -| 01 | Aloittaminen | Johdanto ohjelmointiin ja työkaluihin | Opettele lähes kaikkien ohjelmointikielten perusperiaatteet sekä ohjelmistot jotka auttavat ammattilaisia työnsä tekemisessä | [Ohjelmointikielten ja työkalujen johdanto](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | Aloittaminen | GitHubin perusteet, tiimityöskentely | Miten käytät GitHubia projektissasi ja teet yhteistyötä muiden kanssa koodipohjan parissa | [GitHubin johdanto](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | Aloittaminen | Esteettömyys | Opi verkkosivujen esteettömyyden perusteet | [Esteettömyyden perusteet](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS Basics | JavaScriptin tietotyypit | JavaScriptin tietotyyppien perusteet | [Tietotyypit](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS Basics | Funktiot ja metodit | Opettele funktioista ja metodeista sovelluksen logiikan hallintaan | [Funktiot ja metodit](./2-js-basics/2-functions-methods/README.md) | Jasmine ja Christopher | -| 06 | JS Basics | Päätöksenteko JavaScriptillä | Opettele luomaan ehtoja koodissa päätöksentekomenetelmien avulla | [Päätöksenteko](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS Basics | Taulukot ja silmukat | Työskentele tietojen kanssa taulukkojen ja silmukoiden avulla JavaScriptissä | [Taulukot ja silmukat](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML-käytännössä | Rakenna HTML verkossa olevaa terrariota varten, keskittyen asettelun rakentamiseen | [Johdanto HTML:ään](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS-käytännössä | Rakenna CSS tyylittämään verkossa olevaa terrariota, keskittyen CSS:n perusteisiin ja sivun responsiivisuuteen | [Johdanto CSS:ään](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScriptin sulkeet, DOM-käsittely | Rakenna JavaScript terrariumin vetämis- ja pudotusliittymän toiminnalle, keskittyen sulkuihin ja DOM:n käsittelyyn | [JavaScriptin sulkeet ja DOM-käsittely](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [Typing Game](./4-typing-game/solution/README.md) | Kirjoituspelin rakentaminen | Opi käyttämään näppäimistötapahtumia sovelluksen logiikan ohjaamiseen | [Tapahtumapohjainen ohjelmointi](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Työskentely selainten kanssa | Opi miten selaimet toimivat, niiden historia sekä miten rakentaa selaimen laajennuksen ensimmäiset elementit | [Selaimista](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Lomakkeen rakentaminen, API-kutsu ja muuttujien tallennus paikalliseen tallennustilaan | Rakenna JavaScript-selaimen laajennuksen elementit API-kutsujen tekemiseen muuttujien avulla, jotka tallennetaan paikalliseen tallennustilaan | [API:t, lomakkeet ja paikallinen tallennus](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Taustaprosessit selaimessa, verkkotehokkuus | Hyödynnä selaimen taustaprosesseja laajennuksen kuvakkeen hallinnassa; opi verkkotehokkuudesta ja optimoinneista | [Taustatehtävät ja suorituskyky](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [Space Game](./6-space-game/solution/README.md) | Kehittyneempi pelikehitys JavaScriptillä | Opi perinnöstä luokkien ja koostumuksen avulla sekä Pub/Sub-kuviosta valmistautuaksesi pelin rakentamiseen | [Johdanto kehittyneeseen pelikehitykseen](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [Space Game](./6-space-game/solution/README.md) | Piirtäminen canvakselle | Opi Canvas API:sta, joka on käytössä ruudulle piirtämisessä | [Piirtäminen canvakselle](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [Space Game](./6-space-game/solution/README.md) | Elementtien liikuttaminen ruudulla | Opi miten elementit liikkuvat karteesisissa koordinaateissa ja Canvas APIn avulla | [Elementtien liikuttaminen](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [Space Game](./6-space-game/solution/README.md) | Törmäyksentunnistus | Tee elementeistä törmäileviä ja reagoivia, käytä näppäinkomentoja ja tarjoa jäähdytysfunktio pelin toiminnan varmistamiseksi | [Törmäyksentunnistus](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [Space Game](./6-space-game/solution/README.md) | Pisteiden laskeminen | Suorita matemaattisia laskutoimituksia pelin tilaan ja suoritukseen perustuen | [Pisteiden laskeminen](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [Space Game](./6-space-game/solution/README.md) | Pelin lopetus ja uudelleenkäynnistys | Opi pelin lopettamisesta ja uudelleenkäynnistyksestä, mukaan lukien resurssien siivous ja muuttujien arvon nollaus | [Lopetusehto](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [Banking App](./7-bank-project/solution/README.md) | HTML-pohjat ja reitit web-sovelluksessa | Opi luomaan monisivuisen verkkosivun arkkitehtuurin runko reitityksen ja HTML-pohjien avulla | [HTML-pohjat ja reitit](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [Banking App](./7-bank-project/solution/README.md) | Kirjautumis- ja rekisteröintilomakkeen rakentaminen | Tutustu lomakkeiden rakentamiseen ja validointirutiinien käsittelyyn | [Lomakkeet](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [Banking App](./7-bank-project/solution/README.md) | Datan hakemisen ja käytön menetelmät | Miten data virtaa sovellukseesi, miten hakea, tallentaa ja poistaa sitä | [Data](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [Banking App](./7-bank-project/solution/README.md) | Tilanhallinnan käsitteet | Opi miten sovelluksesi säilyttää tilansa ja hallitsee sitä ohjelmallisesti | [Tilanhallinta](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Selaimen/VScode koodi](../../8-code-editor) | Työskentely VScoden kanssa | Opi käyttämään koodieditoria| [Käytä VScode koodieditoria](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [AI-apulaiset](./9-chat-project/README.md) | Työskentely tekoälyn kanssa | Opi rakentamaan oma tekoälyavustajasi | [AI-avustajaprojekti](./9-chat-project/README.md) | Chris | +| | Projektin nimi | Opitut käsitteet | Oppimistavoitteet | Linkitetty oppitunti | Tekijä | +| :-: | :--------------------------------------------------------: | :--------------------------------------------------------------------: | -------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | +| 01 | Aloittaminen | Johdatus ohjelmointiin ja työkaluihin | Opit ohjelmointikielten perustan ja ohjelmistot, jotka auttavat ammattilaiskehittäjiä työssään | [Johdatus ohjelmointikieliin ja työkaluihin](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | Aloittaminen | GitHubin perusteet, tiimityöskentely | Kuinka käyttää GitHubia projektissasi ja tehdä yhteistyötä muiden kanssa koodipohjassa | [Johdatus GitHubiin](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | Aloittaminen | Saavutettavuus | Opit verkkosaavutettavuuden perusteet | [Saavutettavuuden perusteet](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS Perusteet | JavaScriptin tietotyypit | JavaScriptin tietotyyppien perusteet | [Tietotyypit](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS Perusteet | Funktiot ja metodit | Opit funktioista ja metodeista sovelluksen logiikan hallinnassa | [Funktiot ja metodit](./2-js-basics/2-functions-methods/README.md) | Jasmine ja Christopher | +| 06 | JS Perusteet | Päätöksenteko JS:llä | Opit luomaan olosuhteita koodissasi päätöksentekomenetelmien avulla | [Päätöksenteko](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS Perusteet | Taulukot ja silmukat | Työskentele tietojen kanssa taulukoiden ja silmukoiden avulla JavaScriptissä | [Taulukot ja silmukat](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML käytännössä | Rakenna HTML luodaksesi online-terraariumin, keskittyen asettelun tekemiseen | [Johdatus HTML:ään](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS käytännössä | Rakenna CSS tietoystävän terraariumin tyylittelyä varten, keskittyen CSS:n perusteisiin mukaan lukien responsiivisuus | [Johdatus CSS:ään](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript sulkeet, DOM-manipulointi | Rakenna JavaScript, joka mahdollistaa terraariumin toiminnan drag/drop-käyttöliittymänä, keskittyen sulkeisiin ja DOM-manipulointiin | [JavaScript sulkeet ja DOM-manipulointi](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [Typing Game](./4-typing-game/solution/README.md) | Kirjoituspelin rakentaminen | Opit käyttämään näppäimistötapahtumia JavaScript-sovelluksesi logiikan ohjaamiseen | [Tapahtumapohjainen ohjelmointi](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Selainten toiminta | Opit miten selaimet toimivat, niiden historian ja miten rakentaa ensimmäiset elementit selainlaajennukseen | [Tietoa selaimista](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Lomakkeen rakentaminen, API-kutsut ja muuttujien tallennus | Rakenna selainlaajennukseesi JavaScript-elementit API-kutsuihin paikallisesti tallennettujen muuttujien avulla | [APIt, lomakkeet ja paikallinen tallennus](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Selaintaustaprosessit, verkkosuorituskyky | Käytä selaimen taustaprosesseja hallitsemaan laajennuksen kuvaketta; opi verkkosuorituskyvystä ja optimointikeinoista | [Taustatehtävät ja suorituskyky](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [Space Game](./6-space-game/solution/README.md) | Edistyneempi pelinkehitys JavaScriptillä | Opit periytymisestä luokkien ja komposition avulla sekä Pub/Sub-kuvioista valmistautuessasi pelin rakentamiseen | [Johdatus edistyneeseen pelinkehitykseen](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [Space Game](./6-space-game/solution/README.md) | Piirtäminen kankaalle | Opit Canvas API:stä, jota käytetään elementtien piirtämiseen näytölle | [Piirtäminen kankaalle](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [Space Game](./6-space-game/solution/README.md) | Elementtien liikuttaminen näytöllä | Tutustu, miten elementit saavat liikkeen käyttäen karteesisia koordinaatteja ja Canvas API:ta | [Elementtien liikuttaminen](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [Space Game](./6-space-game/solution/README.md) | Törmäyksentunnistus | Tee, että elementit törmäävät ja reagoivat toisiinsa näppäinyhdistelmillä ja tarjoavat jäähdytystoiminnon pelin suorituskyvyn turvaamiseksi | [Törmäyksentunnistus](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [Space Game](./6-space-game/solution/README.md) | Pisteiden laskeminen | Tee matemaattisia laskelmia pelin tilan ja suorituksen perusteella | [Pisteiden laskeminen](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [Space Game](./6-space-game/solution/README.md) | Pelin lopettaminen ja uudelleenkäynnistys | Opit pelin lopettamisesta ja uudelleenkäynnistämisestä, mukaan lukien resurssien siivous ja muuttujien arvojen nollaus | [Lopetusehto](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [Pankkisovellus](./7-bank-project/solution/README.md) | HTML-mallit ja reitit web-sovelluksessa | Opit luomaan monisivuisen verkkosivuston arkkitehtuurin runkoa reitityksen ja HTML-mallien avulla | [HTML-mallit ja reitit](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [Pankkisovellus](./7-bank-project/solution/README.md) | Kirjautumis- ja rekisteröitymislomakkeen rakentaminen | Opit lomakkeiden rakentamisesta ja validointirutiinien käsittelystä | [Lomakkeet](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [Pankkisovellus](./7-bank-project/solution/README.md) | Datan hakeminen ja käyttö | Kuinka data virtaa sovellukseesi, miten hakea, tallentaa ja poistaa sitä | [Data](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [Pankkisovellus](./7-bank-project/solution/README.md) | Tilanhallinnan käsitteet | Opit, miten sovelluksesi säilyttää tilan ja miten hallita sitä ohjelmallisesti | [Tilanhallinta](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [Selain/VScode-koodi](../../8-code-editor) | Työskentely VScoden kanssa | Opit käyttämään koodieditoria | [Käytä VScode-koodieditoria](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [AI Assistants](./9-chat-project/README.md) | Työskentely tekoälyn kanssa | Opit rakentamaan oman tekoälyavustajan | [AI-avustajaprojekti](./9-chat-project/README.md) | Chris | ## 🏫 Pedagogiikka -Oppimäärämme on suunniteltu kahden keskeisen pedagogisen periaatteen mukaisesti: -* projektipohjainen oppiminen -* säännölliset kyselyt +Oppimateriaalimme on suunniteltu kahden keskeisen pedagogisen periaatteen pohjalta: +* projektioppiminen +* usein toistuvat kyselyt -Ohjelma opettaa JavaScriptin, HTML:n ja CSS:n perusteet sekä viimeisimmät työkalut ja tekniikat, joita nykyiset web-kehittäjät käyttävät. Oppilaat saavat käytännön kokemusta rakentamalla kirjoituspelin, virtuaalisen terrariumin, ekologisen selaimen laajennuksen, avaruusmuukalaisaiheisen pelin ja yrityskäyttöön tarkoitetun pankkisovelluksen. Sarjan lopussa oppilaat ovat hankkineet vahvan ymmärryksen verkkokehityksestä. +Ohjelma opettaa JavaScriptin, HTML:n ja CSS:n perusteet sekä nykyaikaisten web-kehittäjien käyttämiä työkaluja ja tekniikoita. Oppilailla on mahdollisuus kehittää käytännön taitoja rakentamalla kirjoituspeli, virtuaaliterraario, ympäristöystävällinen selainlaajennus, avaruustyyppinen peli ja liiketoiminta-pankkisovellus. Sarjan lopussa opiskelijoilla on vankka ymmärrys web-kehityksestä. -> 🎓 Voit suorittaa tämän oppimäärän ensimmäiset oppitunnit Microsoft Learnin [Oppimispolun](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) kautta! +> 🎓 Voit suorittaa tämän oppilaitoksen ensimmäiset oppitunnit [Oppimispolku](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon)-muodossa Microsoft Learnissa! -Varmistamalla, että sisältö vastaa projekteja, prosessi tehdään opiskelijoille kiinnostavammaksi ja käsitteiden omaksuminen tehostuu. Kirjoitimme myös useita aloitusoppitunteja JavaScriptin perusteista esittelemään käsitteitä, jotka on yhdistetty videoon "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" -videokokoelmasta, joiden tekijöistä osa osallistui tähän oppimäärään. +Varmistamalla sisällön yhteensopivuuden projektien kanssa prosessi tulee opiskelijoille mielekkäämmäksi ja käsitteiden omaksuminen tehostuu. Kirjoitimme myös useita aloitusoppitunteja JavaScript-perusteista käynnistämään kokonaisuuden, jotka on yhdistetty videosarjaan "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", joiden tekijät osallistuivat tähän oppimateriaalin kokoamiseen. -Lisäksi kevyt kysely ennen tuntia suuntaa opiskelijan tarkoitusta oppia aihetta, ja toinen kysely tunnin jälkeen takaa lisäomaksumisen. Tämä oppimäärä on suunniteltu joustavaksi ja hauskaksi, ja sen voi suorittaa kokonaan tai osittain. Projektit alkavat pienestä ja monimutkaistuvat vähitellen 12 viikon jakson loppuun mennessä. +Lisäksi aloituskysely luokkahuoneen edellä asettaa opiskelijan tavoitteen aiheeseen tutustumiselle, ja luokan jälkeinen toinen kysely tukee oppien säilymistä. Tämä oppimateriaali on suunniteltu joustavaksi ja hauskaksi, ja se voidaan suorittaa kokonaisuudessaan tai osittain. Projektit alkavat pienestä ja monimutkaistuvat viimeistään 12 viikon syklin loppuun mennessä. -Vaikka olemme tarkoituksella välttäneet JavaScript-kehysten esittelyä keskittyäksemme perusosaamiseen, joka web-kehittäjällä tulee olla ennen kehysten käyttöönottoa, hyvä seuraava askel oppimäärän suorittamisen jälkeen olisi Node.js:n opiskeluun keskittyvä videokokoelma: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". +Vaikka olemme tietoisesti välttäneet JavaScript-kehysten käyttöönottoa keskittyäksemme web-kehittäjän perusvalmiuksiin ennen kehysten omaksumista, hyvä seuraava askel tämän oppimateriaalin suorittamisen jälkeen on oppia Node.js:stä toisen videosarjan avulla: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". -> Tutustu [käyttäytymissääntöihimme](CODE_OF_CONDUCT.md) ja [osallistumisohjeisiin](CONTRIBUTING.md). Otamme mielellämme vastaan rakentavaa palautettasi! +> Tutustu myös [käytösohjeisiimme](CODE_OF_CONDUCT.md) ja [osallistumisohjeisiin](CONTRIBUTING.md). Otamme mielellämme vastaan rakentavaa palautettasi! ## 🧭 Offline-käyttö -Voit käyttää tätä dokumentaatiota offline-tilassa käyttämällä [Docsifyä](https://docsify.js.org/#/). Forkkaa tämä repositorio, [asenna Docsify](https://docsify.js.org/#/quickstart) paikalliselle koneellesi, ja aja sitten tämän repojen juuressa komentoa `docsify serve`. Verkkosivusto palvellaan portissa 3000 osoitteessa `localhost:3000`. +Voit käyttää tätä dokumentaatiota offline-tilassa käyttämällä [Docsifya](https://docsify.js.org/#/). Haarauta tämä repo, [asenna Docsify](https://docsify.js.org/#/quickstart) paikallisesti ja kirjoita tämän repokansion juurikansiossa komento `docsify serve`. Verkkosivusto toimii portissa 3000 paikallisessa koneessasi: `localhost:3000`. ## 📘 PDF @@ -204,16 +206,16 @@ Kaikkien oppituntien PDF löytyy [täältä](https://microsoft.github.io/Web-Dev ## 🎒 Muut kurssit -Tiimimme tuottaa myös muita kursseja! Tutustu: +Tiimimme tuottaa muitakin kursseja! Tutustu: ### LangChain [![LangChain4j for Beginners](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners) [![LangChain.js for Beginners](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin) - +[![LangChain for Beginners](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin) --- -### Azure / Edge / MCP / Agentit +### Azure / Edge / MCP / Agents [![AZD for Beginners](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst) [![Edge AI for Beginners](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) [![MCP for Beginners](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) @@ -221,7 +223,7 @@ Tiimimme tuottaa myös muita kursseja! Tutustu: --- -### Generatiivinen AI -sarja +### Generatiivisen tekoälyn sarja [![Generative AI for Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Generative AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) [![Generative AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) @@ -229,7 +231,7 @@ Tiimimme tuottaa myös muita kursseja! Tutustu: --- -### Perusopiskelu +### Perusteet [![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) @@ -248,21 +250,21 @@ Tiimimme tuottaa myös muita kursseja! Tutustu: ## Apua saamaan -Jos jumitut tai sinulla on kysyttävää tekoälysovellusten rakentamisesta, liity muiden oppijoiden ja kokeneiden kehittäjien keskusteluihin MCP:stä. Se on kannustava yhteisö, jossa kysymykset ovat tervetulleita ja tietoa jaetaan vapaasti. +Jos jumitut tai sinulla on kysyttävää tekoälysovellusten rakentamisesta, liity muiden oppijoiden ja kokeneiden kehittäjien keskusteluihin MCP:stä. Se on tukeva yhteisö, jossa kysymyksiä saa esittää ja tietoa jaetaan vapaasti. [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -Jos sinulla on tuotepalautetta tai rakentaessa ilmenee virheitä, käy: +Jos sinulla on tuotteen palautetta tai kohtaat virheitä rakentamisen aikana, käy: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) ## Lisenssi -Tämä arkisto on lisensoitu MIT-lisenssillä. Lisätietoja on tiedostossa [LICENSE](../../LICENSE). +Tämä arkisto on lisensoitu MIT-lisenssillä. Lisätietoja löytyy tiedostosta [LICENSE](../../LICENSE). --- **Vastuuvapauslauseke**: -Tämä asiakirja on käännetty tekoälypohjaisella käännöspalvelulla [Co-op Translator](https://github.com/Azure/co-op-translator). Vaikka pyrimme tarkkuuteen, otathan huomioon, että automaattikäännöksissä voi esiintyä virheitä tai epätarkkuuksia. Alkuperäinen asiakirja sen alkuperäiskielellä tulee pitää ensisijaisena lähteenä. Tärkeissä asioissa suositellaan ammattimaista ihmiskäännöstä. Emme ole vastuussa tämän käännöksen käytöstä aiheutuvista väärinymmärryksistä tai tulkinnoista. +Tämä asiakirja on käännetty käyttämällä tekoälypohjaista käännöspalvelua [Co-op Translator](https://github.com/Azure/co-op-translator). Vaikka pyrimme tarkkuuteen, ole hyvä ja huomioi, että automaattikäännöksissä saattaa esiintyä virheitä tai epätarkkuuksia. Alkuperäistä asiakirjaa sen alkuperäiskielellä tulisi pitää virallisena lähteenä. Tärkeissä tiedoissa suositellaan ammattilaisten tekemää ihmiskäännöstä. Emme ole vastuussa tämän käännöksen käytöstä johtuvista väärinymmärryksistä tai tulkinnoista. \ No newline at end of file diff --git a/translations/fi/Roadmap.md b/translations/fi/Roadmap.md new file mode 100644 index 000000000..a533d43d0 --- /dev/null +++ b/translations/fi/Roadmap.md @@ -0,0 +1,53 @@ +# Microsoftin Web-Dev-For-Beginners -varaston tiekartta + +**Tämä varasto tarjoaa tiekartan verkkokehityksen perusteiden oppimiseen keskittyen JavaScriptiin, HTML:ään ja CSS:ään. Opetussuunnitelma on joustava ja sen voi käydä kokonaan tai osittain, 24 oppituntia jakautuen 12 viikolle.** + +## Tärkeimmät virstanpylväät + +* **Viikot 1-3:** + * Johdanto ohjelmointikieliin ja alan työkaluihin + * GitHubin perusteet + * Saavutettavuus + * JS:n perusteet: tietotyypit, funktiot ja metodit + * Päätöksenteko JS:llä +* **Viikot 4-6:** + * Taulukot ja silmukat + * Terrarium: HTML käytännössä + * CSS käytännössä + * JavaScriptin sulkeumat + * DOM:n manipulointi +* **Viikot 7-9:** + * Typing Game: tapahtumapohjainen ohjelmointi + * Green Browser Extension: selainten kanssa työskentely + * Lomakkeen rakentaminen, API:n kutsuminen ja muuttujien tallentaminen paikalliseen tallennustilaan + * Taustaprosessit selaimessa + * Verkkosuorituskyky +* **Viikot 10-12:** + * Space Game: edistyneempää pelinkehitystä JavaScriptillä + * Piirtäminen canvasille + * Elementtien liikuttaminen ruudulla + * Törmäyksentunnistus + * Pisteiden pitäminen, pelin lopettaminen ja uudelleenkäynnistys + * Banking App: HTML-mallit ja reitit web-sovelluksessa + * Kirjautumis- ja rekisteröitymislomakkeen rakentaminen + * Tietojen hakemisen ja käyttämisen menetelmät + * Tilanhallinnan käsitteet + +## Oppimistulokset + +**Tämän tiekartan suorittamalla opiskelijat saavat käytännön kokemusta kirjoituspelin, virtuaalisen terrariumin, ympäristöystävällisen selainlaajennuksen, avaruuspakopaistyylisen pelin ja yrityksille tarkoitetun pankkisovelluksen rakentamisesta. He kehittävät myös vahvan ymmärryksen verkkokehityksen perusteista.** + +## Lisäresurssit + +* Tämä varasto tarjoaa runsaasti materiaaleja jatko-opiskeluun, mukaan lukien tutoriaaleja, koodiesimerkkejä ja haasteita. +* Microsoft Learn -alusta tarjoaa useita verkkokehityskursseja ja oppimispolkuja. +* Verkkoyhteisöt, kuten Stack Overflow ja MDN Web Docs, tarjoavat arvokasta tukea ja resursseja web-kehittäjille. + +**Toivon, että tämä tiekartta auttaa sinua verkkokehitysmatkallasi!** + +--- + + +**Vastuuvapauslauseke**: +Tämä asiakirja on käännetty tekoälypohjaisella käännöspalvelulla [Co-op Translator](https://github.com/Azure/co-op-translator). Pyrimme tarkkuuteen, mutta ole hyvä ja huomioi, että automaattiset käännökset saattavat sisältää virheitä tai epätarkkuuksia. Alkuperäinen asiakirja sen alkuperäisellä kielellä on ensisijainen ja luotettava lähde. Tärkeissä tiedoissa suositellaan ammattimaista ihmiskäännöstä. Emme ole vastuussa tämän käännöksen käytöstä mahdollisesti aiheutuvista väärinymmärryksistä tai tulkinnoista. + \ No newline at end of file diff --git a/translations/nl/.co-op-translator.json b/translations/nl/.co-op-translator.json index d0e1facf1..3541b2556 100644 --- a/translations/nl/.co-op-translator.json +++ b/translations/nl/.co-op-translator.json @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2025-10-03T11:31:33+00:00", + "translation_date": "2026-02-06T17:38:09+00:00", "source_file": "AGENTS.md", "language_code": "nl" }, @@ -516,11 +516,17 @@ "language_code": "nl" }, "README.md": { - "original_hash": "490c83786552d7fab6390991517bef09", - "translation_date": "2026-01-29T18:37:58+00:00", + "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc", + "translation_date": "2026-02-06T17:33:51+00:00", "source_file": "README.md", "language_code": "nl" }, + "Roadmap.md": { + "original_hash": "28bf6185fd7f27b62ddc210514366192", + "translation_date": "2026-02-06T17:34:37+00:00", + "source_file": "Roadmap.md", + "language_code": "nl" + }, "SECURITY.md": { "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228", "translation_date": "2025-08-27T20:03:50+00:00", diff --git a/translations/nl/AGENTS.md b/translations/nl/AGENTS.md index 15a1364a8..7a774d3c7 100644 --- a/translations/nl/AGENTS.md +++ b/translations/nl/AGENTS.md @@ -2,281 +2,281 @@ ## Projectoverzicht -Dit is een educatieve curriculumrepository voor het onderwijzen van de basisprincipes van webontwikkeling aan beginners. Het curriculum is een uitgebreide 12-weekse cursus ontwikkeld door Microsoft Cloud Advocates, met 24 praktische lessen over JavaScript, CSS en HTML. +Dit is een educatieve curriculumrepository voor het onderwijzen van webontwikkeling aan beginners. Het curriculum is een uitgebreide cursus van 12 weken ontwikkeld door Microsoft Cloud Advocates, met 24 hands-on lessen over JavaScript, CSS en HTML. -### Belangrijke onderdelen +### Belangrijkste Onderdelen - **Educatieve inhoud**: 24 gestructureerde lessen georganiseerd in projectgebaseerde modules -- **Praktische projecten**: Terrarium, Typingspel, Browserextensie, Ruimtespel, Bankapp, Code-editor en AI-chatassistent -- **Interactieve quizzen**: 48 quizzen met elk 3 vragen (voorafgaande/naderhandse lesbeoordelingen) -- **Meertalige ondersteuning**: Geautomatiseerde vertalingen in meer dan 50 talen via GitHub Actions +- **Praktische projecten**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor en AI Chat Assistant +- **Interactieve quizzen**: 48 quizzen met elk 3 vragen (pre/post-les beoordelingen) +- **Meertalige ondersteuning**: Geautomatiseerde vertalingen voor 50+ talen via GitHub Actions - **Technologieën**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (voor AI-projecten) ### Architectuur - Educatieve repository met lesgebaseerde structuur -- Elke lesmap bevat een README, codevoorbeelden en oplossingen -- Zelfstandige projecten in aparte mappen (quiz-app, diverse lesprojecten) -- Vertalingssysteem met GitHub Actions (co-op-translator) -- Documentatie beschikbaar via Docsify en als PDF +- Elke lesmap bevat README, codevoorbeelden en oplossingen +- Losstaande projecten in aparte directories (quiz-app, diverse lesprojecten) +- Vertalingssysteem via GitHub Actions (co-op-translator) +- Documentatie geserveerd via Docsify en beschikbaar als PDF -## Setup-commando's +## Setup Commando's Deze repository is primair bedoeld voor het consumeren van educatieve inhoud. Voor het werken met specifieke projecten: -### Hoofdrepository instellen +### Hoofdrepository Setup ```bash git clone https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners ``` -### Quiz-app instellen (Vue 3 + Vite) +### Quiz App Setup (Vue 3 + Vite) ```bash cd quiz-app npm install -npm run dev # Start development server -npm run build # Build for production -npm run lint # Run ESLint +npm run dev # Start ontwikkelserver +npm run build # Bouw voor productie +npm run lint # Voer ESLint uit ``` -### Bankproject-API (Node.js + Express) +### Bank Project API (Node.js + Express) ```bash cd 7-bank-project/api npm install -npm start # Start API server -npm run lint # Run ESLint -npm run format # Format with Prettier +npm start # Start API-server +npm run lint # Voer ESLint uit +npm run format # Opmaak met Prettier ``` -### Browserextensieprojecten +### Browser Extension Projecten ```bash cd 5-browser-extension/solution npm install -# Follow browser-specific extension loading instructions +# Volg browser-specifieke instructies voor het laden van extensies ``` -### Ruimtespelprojecten +### Space Game Projecten ```bash cd 6-space-game/solution npm install -# Open index.html in browser or use Live Server +# Open index.html in de browser of gebruik Live Server ``` -### Chatproject (Python-backend) +### Chat Project (Python Backend) ```bash cd 9-chat-project/solution/backend/python pip install openai -# Set GITHUB_TOKEN environment variable +# Stel de omgevingsvariabele GITHUB_TOKEN in python api.py ``` ## Ontwikkelworkflow -### Voor inhoudsbijdraaiers +### Voor Inhoud Bijdragers 1. **Fork de repository** naar je GitHub-account 2. **Clone je fork** lokaal -3. **Maak een nieuwe branch** voor je wijzigingen +3. **Maak een nieuwe branch** aan voor je wijzigingen 4. Breng wijzigingen aan in lesinhoud of codevoorbeelden -5. Test eventuele codewijzigingen in relevante projectmappen -6. Dien pull requests in volgens de richtlijnen voor bijdragen +5. Test eventuele codewijzigingen in relevante projectdirectories +6. Dien pull requests in volgens de bijdrage-richtlijnen -### Voor leerlingen +### Voor Leerlingen 1. Fork of clone de repository -2. Navigeer naar lesmappen in volgorde -3. Lees README-bestanden voor elke les -4. Maak voorafgaande quizzen op https://ff-quizzes.netlify.app/web/ +2. Navigeer sequentieel naar lesdirectories +3. Lees README-bestanden voor iedere les +4. Maak de pre-les quizzen op https://ff-quizzes.netlify.app/web/ 5. Werk door codevoorbeelden in lesmappen 6. Voltooi opdrachten en uitdagingen -7. Maak naderhandse quizzen +7. Maak post-les quizzen -### Live ontwikkeling +### Live Ontwikkeling -- **Documentatie**: Voer `docsify serve` uit in de root (poort 3000) -- **Quiz-app**: Voer `npm run dev` uit in de quiz-app-map -- **Projecten**: Gebruik de Live Server-extensie van VS Code voor HTML-projecten -- **API-projecten**: Voer `npm start` uit in de respectieve API-mappen +- **Documentatie**: Run `docsify serve` in root (poort 3000) +- **Quiz App**: Run `npm run dev` in quiz-app directory +- **Projecten**: Gebruik VS Code Live Server extensie voor HTML-projecten +- **API Projecten**: Run `npm start` in respectievelijke API directories ## Testinstructies -### Quiz-app testen +### Quiz App Testing ```bash cd quiz-app -npm run lint # Check for code style issues -npm run build # Verify build succeeds +npm run lint # Controleer op problemen met code-stijl +npm run build # Verifieer dat de build slaagt ``` -### Bank-API testen +### Bank API Testing ```bash cd 7-bank-project/api -npm run lint # Check for code style issues -node server.js # Verify server starts without errors +npm run lint # Controleren op problemen met de code stijl +node server.js # Controleren of de server zonder fouten start ``` -### Algemene testaanpak +### Algemene Testaanpak - Dit is een educatieve repository zonder uitgebreide geautomatiseerde tests -- Handmatige tests richten zich op: +- Handmatig testen focust op: - Codevoorbeelden draaien zonder fouten - Links in documentatie werken correct - - Projecten bouwen succesvol + - Project builds verlopen succesvol - Voorbeelden volgen best practices -### Controle vóór indiening +### Pre-Submission Checks -- Voer `npm run lint` uit in mappen met package.json -- Controleer of markdown-links geldig zijn -- Test codevoorbeelden in de browser of Node.js -- Controleer of vertalingen de juiste structuur behouden +- Run `npm run lint` in directories met package.json +- Verifieer dat markdown links geldig zijn +- Test codevoorbeelden in browser of Node.js +- Controleer dat vertalingen juiste structuur behouden -## Richtlijnen voor codestijl +## Code Style Richtlijnen ### JavaScript - Gebruik moderne ES6+ syntax -- Volg standaard ESLint-configuraties die in projecten worden geleverd +- Volg standaard ESLint configuraties zoals in projecten opgegeven - Gebruik betekenisvolle variabele- en functienamen voor educatieve duidelijkheid -- Voeg opmerkingen toe die concepten uitleggen voor leerlingen -- Formatteer met Prettier waar geconfigureerd +- Voeg commentaar toe die concepten uitlegt voor leerlingen +- Format met Prettier waar geconfigureerd ### HTML/CSS - Semantische HTML5-elementen -- Responsieve ontwerpprincipes -- Duidelijke klassennaamgeving -- Opmerkingen die CSS-technieken uitleggen voor leerlingen +- Responsive design principes +- Duidelijke class naming conventies +- Commentaar dat CSS-technieken uitlegt voor leerlingen ### Python -- PEP 8-stijlrichtlijnen +- PEP 8 stijlrichtlijnen - Duidelijke, educatieve codevoorbeelden - Type hints waar nuttig voor leren -### Markdown-documentatie +### Markdown Documentatie - Duidelijke koppenhiërarchie - Codeblokken met taalspecificatie - Links naar aanvullende bronnen -- Screenshots en afbeeldingen in `images/`-mappen +- Screenshots en afbeeldingen in `images/` directories - Alt-tekst voor afbeeldingen voor toegankelijkheid ### Bestandsorganisatie -- Lessen genummerd in volgorde (1-getting-started-lessons, 2-js-basics, enz.) -- Elk project heeft `solution/` en vaak `start/` of `your-work/`-mappen -- Afbeeldingen opgeslagen in les-specifieke `images/`-mappen -- Vertalingen in `translations/{language-code}/`-structuur +- Lessen oplopend genummerd (1-getting-started-lessons, 2-js-basics, etc.) +- Elk project heeft `solution/` en vaak `start/` of `your-work/` directories +- Afbeeldingen opgeslagen in les-specifieke `images/` mappen +- Vertalingen in `translations/{language-code}/` structuur -## Build en deployment +## Build en Deployment -### Quiz-app deployment (Azure Static Web Apps) +### Quiz App Deployment (Azure Static Web Apps) De quiz-app is geconfigureerd voor Azure Static Web Apps deployment: ```bash cd quiz-app -npm run build # Creates dist/ folder -# Deploys via GitHub Actions workflow on push to main +npm run build # Maakt map dist/ aan +# Zet uit via GitHub Actions workflow bij push naar main ``` -Azure Static Web Apps-configuratie: -- **App-locatie**: `/quiz-app` -- **Output-locatie**: `dist` +Azure Static Web Apps configuratie: +- **App locatie**: `/quiz-app` +- **Output locatie**: `dist` - **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` -### Documentatie PDF-generatie +### Generatie van Documentatie PDF ```bash -npm install # Install docsify-to-pdf -npm run convert # Generate PDF from docs +npm install # Installeer docsify-to-pdf +npm run convert # Genereer PDF van docs ``` -### Docsify-documentatie +### Docsify Documentatie ```bash -npm install -g docsify-cli # Install Docsify globally -docsify serve # Serve on localhost:3000 +npm install -g docsify-cli # Installeer Docsify wereldwijd +docsify serve # Server op localhost:3000 ``` -### Projectspecifieke builds +### Projectspecifieke Builds -Elke projectmap kan zijn eigen buildproces hebben: -- Vue-projecten: `npm run build` maakt productie-bundels -- Statische projecten: Geen buildstap, bestanden direct serveren +Elke projectdirectory kan zijn eigen buildproces hebben: +- Vue projecten: `npm run build` creëert productie bundles +- Statische projecten: Geen buildstap, serveer bestanden direct -## Richtlijnen voor pull requests +## Pull Request Richtlijnen -### Titelindeling +### Titel Formaat -Gebruik duidelijke, beschrijvende titels die het gebied van wijziging aangeven: -- `[Quiz-app] Nieuwe quiz toevoegen voor les X` -- `[Les-3] Typfout corrigeren in terrariumproject` -- `[Vertaling] Spaanse vertaling toevoegen voor les 5` -- `[Docs] Setup-instructies bijwerken` +Gebruik duidelijke, beschrijvende titels die het wijzigingsgebied aangeven: +- `[Quiz-app] Voeg nieuwe quiz toe voor les X` +- `[Lesson-3] Corrigeer typefout in terrarium project` +- `[Translation] Voeg Spaanse vertaling toe voor les 5` +- `[Docs] Werk setup-instructies bij` -### Vereiste controles +### Vereiste Checks -Voordat je een PR indient: +Voor het indienen van een PR: 1. **Codekwaliteit**: - - Voer `npm run lint` uit in de getroffen projectmappen - - Los alle lintingfouten en -waarschuwingen op + - Run `npm run lint` in de betrokken projectdirectories + - Los alle linting-fouten en waarschuwingen op -2. **Buildverificatie**: - - Voer `npm run build` uit indien van toepassing - - Zorg ervoor dat er geen buildfouten zijn +2. **Build-verificatie**: + - Run `npm run build` indien van toepassing + - Zorg dat er geen buildfouten zijn -3. **Linkvalidatie**: - - Test alle markdown-links - - Controleer of afbeeldingsverwijzingen werken +3. **Link validatie**: + - Test alle markdown links + - Verifieer dat afbeeldingsreferenties werken -4. **Inhoudscontrole**: - - Controleer op spelling en grammatica - - Zorg ervoor dat codevoorbeelden correct en educatief zijn - - Controleer of vertalingen de oorspronkelijke betekenis behouden +4. **Inhoud Review**: + - Corrigeer spelling en grammatica + - Zorg dat codevoorbeelden correct en educatief zijn + - Controleer dat vertalingen oorspronkelijke betekenis behouden -### Bijdragevereisten +### Bijdrage Vereisten -- Ga akkoord met Microsoft CLA (automatische controle bij eerste PR) +- Ga akkoord met Microsoft CLA (automatische check bij eerste PR) - Volg de [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Zie [CONTRIBUTING.md](./CONTRIBUTING.md) voor gedetailleerde richtlijnen -- Verwijs naar issuetickets in de PR-beschrijving indien van toepassing +- Verwijs naar issuetickets in PR-beschrijving indien relevant -### Reviewproces +### Review Proces -- PR's worden beoordeeld door maintainers en de community -- Educatieve duidelijkheid heeft prioriteit +- PR's worden beoordeeld door maintainers en community +- Educatieve duidelijkheid wordt prioriteit gegeven - Codevoorbeelden moeten huidige best practices volgen -- Vertalingen worden beoordeeld op nauwkeurigheid en culturele geschiktheid +- Vertalingen worden beoordeeld op nauwkeurigheid en culturele passendheid ## Vertalingssysteem -### Geautomatiseerde vertaling +### Geautomatiseerde Vertaling - Gebruikt GitHub Actions met co-op-translator workflow -- Vertaalt automatisch naar meer dan 50 talen -- Bronbestanden in hoofdmap -- Vertaalde bestanden in `translations/{language-code}/`-mappen +- Vertalingen naar 50+ talen automatisch +- Bronbestanden in hoofddirectories +- Vertaalde bestanden in `translations/{language-code}/` directories -### Handmatige verbeteringen aan vertalingen toevoegen +### Handmatige Vertaalverbeteringen Toevoegen -1. Zoek bestand in `translations/{language-code}/` -2. Breng verbeteringen aan terwijl je de structuur behoudt -3. Zorg ervoor dat codevoorbeelden functioneel blijven +1. Zoek bestand op in `translations/{language-code}/` +2. Breng verbeteringen aan met behoud van structuur +3. Zorg dat codevoorbeelden functioneel blijven 4. Test eventuele gelokaliseerde quizinhoud -### Metadata van vertalingen +### Vertaal Metadata -Vertaalde bestanden bevatten een metadata-header: +Vertaalde bestanden bevatten metadata header: ```markdown ``` -## Debugging en probleemoplossing +## Debugging en Probleemoplossing -### Veelvoorkomende problemen +### Veelvoorkomende Problemen -**Quiz-app start niet**: -- Controleer Node.js-versie (v14+ aanbevolen) -- Verwijder `node_modules` en `package-lock.json`, voer `npm install` opnieuw uit +**Quiz app start niet**: +- Controleer Node.js versie (v14+ aanbevolen) +- Verwijder `node_modules` en `package-lock.json`, run `npm install` opnieuw - Controleer op poortconflicten (standaard: Vite gebruikt poort 5173) -**API-server start niet**: -- Controleer of Node.js-versie voldoet aan minimumvereisten (node >=10) +**API server start niet**: +- Verifieer dat Node.js versie minimaal is (node >=10) - Controleer of poort al in gebruik is -- Zorg ervoor dat alle afhankelijkheden zijn geïnstalleerd met `npm install` +- Zorg dat alle dependencies geïnstalleerd zijn met `npm install` -**Browserextensie laadt niet**: +**Browser extensie laadt niet**: - Controleer of manifest.json correct is geformatteerd -- Controleer browserconsole op fouten +- Bekijk browserconsole op fouten - Volg browser-specifieke installatie-instructies voor extensies -**Python-chatprojectproblemen**: -- Zorg ervoor dat OpenAI-pakket is geïnstalleerd: `pip install openai` -- Controleer of GITHUB_TOKEN-omgevingsvariabele is ingesteld -- Controleer toegangsmachtigingen voor GitHub Models +**Python chat project problemen**: +- Zorg dat OpenAI pakket geïnstalleerd is: `pip install openai` +- Controleer of GITHUB_TOKEN omgevingsvariabele ingesteld is +- Controleer GitHub Models toegangsrechten -**Docsify serveert geen docs**: +**Docsify serveert geen documentatie**: - Installeer docsify-cli globaal: `npm install -g docsify-cli` -- Voer uit vanuit de rootmap van de repository -- Controleer of `docs/_sidebar.md` bestaat +- Run vanuit root van repository +- Controleer dat `docs/_sidebar.md` bestaat -### Tips voor ontwikkelomgeving +### Tips voor Ontwikkelomgeving - Gebruik VS Code met Live Server-extensie voor HTML-projecten -- Installeer ESLint- en Prettier-extensies voor consistente opmaak -- Gebruik browser DevTools voor het debuggen van JavaScript -- Voor Vue-projecten, installeer Vue DevTools-browserextensie +- Installeer ESLint en Prettier extensies voor consistente formattering +- Gebruik browser DevTools voor debugging van JavaScript +- Voor Vue projecten, installeer Vue DevTools browserextensie -### Prestatieoverwegingen +### Prestatie Overwegingen -- Groot aantal vertaalde bestanden (50+ talen) betekent dat volledige clones groot zijn -- Gebruik een shallow clone als je alleen aan inhoud werkt: `git clone --depth 1` -- Sluit vertalingen uit van zoekopdrachten bij het werken aan Engelse inhoud -- Buildprocessen kunnen traag zijn bij de eerste run (npm install, Vite build) +- Groot aantal vertaalde bestanden (50+ talen) betekent grote volledige clones +- Gebruik shallow clone als je alleen aan inhoud werkt: `git clone --depth 1` +- Sluit vertalingen uit van zoekopdrachten bij werken in Engelse inhoud +- Buildprocessen kunnen traag zijn bij eerste run (npm install, Vite build) -## Veiligheidsoverwegingen +## Beveiligingsoverwegingen ### Omgevingsvariabelen -- API-sleutels mogen nooit in de repository worden opgenomen -- Gebruik `.env`-bestanden (al in `.gitignore`) -- Documenteer vereiste omgevingsvariabelen in project-README's +- API-sleutels mogen nooit in de repository gecommit worden +- Gebruik `.env` bestanden (staan al in `.gitignore`) +- Documenteer vereiste omgevingsvariabelen in project READMEs -### Python-projecten +### Python Projecten - Gebruik virtuele omgevingen: `python -m venv venv` -- Houd afhankelijkheden up-to-date -- GitHub-tokens moeten minimale vereiste machtigingen hebben +- Houd dependencies up-to-date +- GitHub tokens moeten minimale vereiste permissies hebben -### Toegang tot GitHub Models +### GitHub Models Toegang -- Persoonlijke toegangstokens (PAT) vereist voor GitHub Models -- Tokens moeten worden opgeslagen als omgevingsvariabelen -- Nooit tokens of inloggegevens opnemen in de repository +- Persoonlijke toegangs-token (PAT) vereist voor GitHub Models +- Tokens moeten als omgevingsvariabelen worden opgeslagen +- Tokens en inloggegevens nooit comitten -## Aanvullende opmerkingen +## Aanvullende Notities ### Doelgroep -- Volledige beginners in webontwikkeling +- Complete beginners in webontwikkeling - Studenten en zelflerenden -- Docenten die het curriculum in klaslokalen gebruiken -- Inhoud is ontworpen voor toegankelijkheid en geleidelijke vaardigheidsopbouw +- Docenten die curriculum in klaslokalen gebruiken +- Inhoud is ontworpen voor toegankelijkheid en geleidelijke vaardighedenopbouw -### Educatieve filosofie +### Educatieve Filosofie - Projectgebaseerde leerbenadering -- Regelmatige kenniscontroles (quizzen) -- Praktische codeoefeningen -- Voorbeelden van toepassingen in de echte wereld +- Regelmatige kennischecks (quizzen) +- Hands-on programmeeroefeningen +- Voorbeelden met echte toepassingen - Focus op basisprincipes vóór frameworks -### Onderhoud van de repository +### Repository Onderhoud -- Actieve community van leerlingen en bijdragers -- Regelmatige updates van afhankelijkheden en inhoud +- Actieve gemeenschap van leerlingen en bijdragers +- Regelmatige updates van dependencies en inhoud - Issues en discussies worden gemonitord door maintainers -- Vertalingsupdates geautomatiseerd via GitHub Actions +- Vertaalupdates geautomatiseerd via GitHub Actions -### Gerelateerde bronnen +### Gerelateerde Bronnen -- [Microsoft Learn-modules](https://docs.microsoft.com/learn/) -- [Student Hub-bronnen](https://docs.microsoft.com/learn/student-hub/) +- [Microsoft Learn modules](https://docs.microsoft.com/learn/) +- [Student Hub bronnen](https://docs.microsoft.com/learn/student-hub/) - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) aanbevolen voor leerlingen -- Aanvullende cursussen: Generatieve AI, Data Science, ML, IoT-curricula beschikbaar +- Extra cursussen: Generatieve AI, Data Science, ML, IoT curricula beschikbaar -### Werken met specifieke projecten +### Werken met Specifieke Projecten -Voor gedetailleerde instructies over individuele projecten, raadpleeg de README-bestanden in: -- `quiz-app/README.md` - Vue 3 quiz-applicatie -- `7-bank-project/README.md` - Bankapplicatie met authenticatie -- `5-browser-extension/README.md` - Ontwikkeling van browserextensies -- `6-space-game/README.md` - Canvas-gebaseerde spelontwikkeling -- `9-chat-project/README.md` - AI-chatassistentproject +Voor gedetailleerde instructies per individueel project, zie de README-bestanden in: +- `quiz-app/README.md` - Vue 3 quizapplicatie +- `7-bank-project/README.md` - Banking applicatie met authenticatie +- `5-browser-extension/README.md` - Browser extensie ontwikkeling +- `6-space-game/README.md` - Canvas-gebaseerde game ontwikkeling +- `9-chat-project/README.md` - AI chat assistent project -### Monorepo-structuur +### Monorepo Structuur -Hoewel geen traditionele monorepo, bevat deze repository meerdere onafhankelijke projecten: -- Elke les is zelfstandig -- Projecten delen geen afhankelijkheden +Hoewel dit geen traditionele monorepo is, bevat deze repository meerdere onafhankelijke projecten: +- Elke les is op zichzelf staand +- Projecten delen geen dependencies - Werk aan individuele projecten zonder anderen te beïnvloeden -- Clone de volledige repo voor de volledige curriculumervaring +- Clone de hele repo voor de volledige curriculumervaring --- -**Disclaimer**: -Dit document is vertaald met behulp van de AI-vertalingsservice [Co-op Translator](https://github.com/Azure/co-op-translator). Hoewel we streven naar nauwkeurigheid, dient u zich ervan bewust te zijn dat geautomatiseerde vertalingen fouten of onnauwkeurigheden kunnen bevatten. Het originele document in de oorspronkelijke taal moet worden beschouwd als de gezaghebbende bron. Voor cruciale informatie wordt professionele menselijke vertaling aanbevolen. Wij zijn niet aansprakelijk voor misverstanden of verkeerde interpretaties die voortvloeien uit het gebruik van deze vertaling. \ No newline at end of file + +**Disclaimer**: +Dit document is vertaald met behulp van de AI-vertalingsservice [Co-op Translator](https://github.com/Azure/co-op-translator). Hoewel wij streven naar nauwkeurigheid, dient u er rekening mee te houden dat automatische vertalingen fouten of onnauwkeurigheden kunnen bevatten. Het originele document in de oorspronkelijke taal wordt beschouwd als de gezaghebbende bron. Voor kritieke informatie wordt professionele menselijke vertaling aanbevolen. Wij zijn niet aansprakelijk voor eventuele misverstanden of verkeerde interpretaties die voortvloeien uit het gebruik van deze vertaling. + \ No newline at end of file diff --git a/translations/nl/README.md b/translations/nl/README.md index a44237b6b..6a1cd466d 100644 --- a/translations/nl/README.md +++ b/translations/nl/README.md @@ -1,24 +1,38 @@ +[![GitHub license](https://img.shields.io/github/license/microsoft/Web-Dev-For-Beginners.svg)](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE) +[![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/) +[![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/) +[![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/) +[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) + +[![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) +[![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/) +[![GitHub stars](https://img.shields.io/github/stars/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/) + +[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) + # Webontwikkeling voor Beginners - Een Curriculum -Leer de basisprincipes van webontwikkeling met onze 12-weekse uitgebreide cursus van Microsoft Cloud Advocates. Elk van de 24 lessen duikt in JavaScript, CSS en HTML door middel van praktijkprojecten zoals terraria, browserextensies en spacegames. Doe mee met quizzen, discussies en praktische opdrachten. Verhoog je vaardigheden en optimaliseer je kennisbehoud met onze effectieve project-gebaseerde leerwijze. Begin vandaag nog met coderen! +Leer de basisprincipes van webontwikkeling met onze 12 weken durende uitgebreide cursus door Microsoft Cloud Advocates. Elke van de 24 lessen duikt in JavaScript, CSS en HTML via praktische projecten zoals terrariums, browserextensies en ruimtespellen. Doe mee met quizzen, discussies en praktische opdrachten. Versterk je vaardigheden en optimaliseer je kennisretentie met onze effectieve projectgerichte didactiek. Begin vandaag nog met coderen! Word lid van de Azure AI Foundry Discord Community -Volg deze stappen om aan de slag te gaan met deze bronnen: -1. **Fork de repository**: Klik [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) -2. **Clone de repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -3. [**Word lid van de Azure AI Foundry Discord en ontmoet experts en mede-ontwikkelaars**](https://discord.com/invite/ByRwuEEgH4) +[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) + +Volg deze stappen om aan de slag te gaan met deze resources: +1. **Fork de Repository**: Klik op [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +2. **Clone de Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +3. [**Word lid van de Azure AI Foundry Discord en ontmoet experts en medeontwikkelaars**](https://discord.com/invite/ByRwuEEgH4) ### 🌐 Meertalige Ondersteuning -#### Ondersteund via GitHub Action (geautomatiseerd & altijd up-to-date) +#### Ondersteund via GitHub Action (Geautomatiseerd & Altijd Up-to-date) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](./README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) -> **Lievere lokaal clonen?** +> **Liever lokaal clonen?** -> Deze repository bevat meer dan 50 taalvertalingen die de downloadgrootte aanzienlijk vergroten. Om zonder vertalingen te clonen, gebruik sparse checkout: +> Deze repository bevat meer dan 50 taalvertalingen, wat de downloadgrootte aanzienlijk vergroot. Om zonder vertalingen te clonen, gebruik dan sparse checkout: > ```bash > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > cd Web-Dev-For-Beginners @@ -27,160 +41,163 @@ Volg deze stappen om aan de slag te gaan met deze bronnen: > Dit geeft je alles wat je nodig hebt om de cursus te voltooien met een veel snellere download. -**Als je graag extra vertalingen wilt, staan de ondersteunde talen hier [hier](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** +**Als je wenst dat extra vertalingen ondersteund worden, zijn die hier te vinden [hier](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** + +[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) #### 🧑‍🎓 _Ben je een student?_ -Bezoek de [**Student Hub pagina**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) waar je beginnersbronnen, studentenpakketten en zelfs manieren vindt om een gratis certificaatvoucher te krijgen. Dit is de pagina die je wilt bookmarken en af en toe wilt checken omdat we maandelijks content wisselen. +Bezoek de [**Student Hub pagina**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) waar je beginnersbronnen, studentpakketten en zelfs manieren vindt om een gratis certificaatvoucher te bemachtigen. Dit is de pagina die je wilt bookmarken en af en toe bezoeken, aangezien we maandelijks content wisselen. -### 📣 Aankondiging - Nieuwe GitHub Copilot Agent modus uitdagingen om te voltooien! +### 📣 Aankondiging - Nieuwe GitHub Copilot Agent-modus uitdagingen om te voltooien! -Nieuwe uitdaging toegevoegd, zoek naar "GitHub Copilot Agent Challenge 🚀" in de meeste hoofdstukken. Dat is een nieuwe uitdaging die je kunt voltooien met GitHub Copilot en Agent-modus. Als je Agent-modus nog niet hebt gebruikt: het kan niet alleen tekst genereren, maar ook bestanden maken en bewerken, opdrachten uitvoeren en meer. +Nieuwe uitdaging toegevoegd, zoek naar "GitHub Copilot Agent Challenge 🚀" in de meeste hoofdstukken. Dit is een nieuwe uitdaging om te voltooien met behulp van GitHub Copilot en Agent-modus. Als je Agent-modus nog niet hebt gebruikt: het kan niet alleen tekst genereren, maar ook bestanden creëren en bewerken, opdrachten uitvoeren en meer. -### 📣 Aankondiging - _Nieuw project om te bouwen met Generatieve AI_ +### 📣 Aankondiging - _Nieuw Project te bouwen met Generatieve AI_ -Nieuw AI Assistant project zojuist toegevoegd, bekijk het [project](./9-chat-project/README.md) +Nieuw AI-assistentproject toegevoegd, bekijk het [project](./9-chat-project/README.md) -### 📣 Aankondiging - _Nieuw curriculum_ over Generatieve AI voor JavaScript is net uitgebracht +### 📣 Aankondiging - _Nieuw Curriculum_ over Generatieve AI voor JavaScript is zojuist uitgebracht -Mis ons nieuwe Generative AI curriculum niet! +Mis ons nieuwe Generatieve AI-curriculum niet! Bezoek [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) om te beginnen! ![Background](../../translated_images/nl/background.148a8d43afde5730.webp) -- Lessen die alles behandelen, van basis tot RAG. -- Interacteer met historische personages met behulp van GenAI en onze begeleidende app. -- Leuke en boeiende verhaallijn, je reist door de tijd! +- Lessen die alles behandelen van basisprincipes tot RAG. +- Interactie met historische personages via GenAI en onze compagnon-app. +- Leuk en boeiend verhaal, je reist door de tijd! ![character](../../translated_images/nl/character.5c0dd8e067ffd693.webp) - -Elke les bevat een opdracht om te voltooien, een kenniscontrole en een uitdaging die je begeleidt bij het leren van onderwerpen zoals: -- Prompting en prompt engineering +Elke les omvat een opdracht om te voltooien, een kennischeck en een uitdaging om je te begeleiden bij het leren van onderwerpen zoals: +- Prompting en promptengineering - Tekst- en afbeeldingsapp-generatie - Zoekapps -Bezoek [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course) om te beginnen! +Bezoek [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) om te beginnen! + ## 🌱 Aan de slag -> **Docenten**, we hebben [enkele suggesties opgenomen](for-teachers.md) over hoe dit curriculum te gebruiken. We horen graag jullie feedback [in ons discussieforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! +> **Docenten**, we hebben [enkele suggesties opgenomen](for-teachers.md) over hoe je dit curriculum kunt gebruiken. We horen graag je feedback [in ons discussieforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! -**[Leerlingen](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, begin bij elke les met een pre-lecture quiz en volg deze met het lezen van het lesmateriaal, het voltooien van de verschillende activiteiten en controleer je begrip met de post-lecture quiz. +**[Leerlingen](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, voor elke les begin je met een pre-lecture quiz en ga je door met het lezen van het lesmateriaal, het voltooien van de verschillende activiteiten en controleer je je begrip met de post-lecture quiz. -Om je leerervaring te verbeteren, maak verbinding met je medeleerlingen om samen aan de projecten te werken! Discussies worden aangemoedigd in ons [discussieforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) waar ons team van moderators beschikbaar zal zijn om je vragen te beantwoorden. +Om je leerervaring te verbeteren, verbind je met je medestudenten om samen aan de projecten te werken! Discussies worden aangemoedigd in ons [discussieforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) waar ons team van moderator beschikbaar zal zijn om je vragen te beantwoorden. -Voor verdere scholing raden wij sterk aan om [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) te verkennen voor aanvullende studiematerialen. +Om je educatie verder te bevorderen, raden we ten zeerste aan Microsoft Learn te verkennen voor aanvullende studiematerialen: [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon). ### 📋 Je omgeving instellen -Dit curriculum heeft een ontwikkelomgeving klaar voor gebruik! Als je begint, kun je ervoor kiezen om het curriculum te draaien in een [Codespace](https://github.com/features/codespaces/) (_een browser-gebaseerde, geen installaties benodigde omgeving_), of lokaal op je computer met een teksteditor zoals [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +Dit curriculum heeft een ontwikkelomgeving die klaar is om te gebruiken! Terwijl je begint, kun je ervoor kiezen de cursus uit te voeren in een [Codespace](https://github.com/features/codespaces/) (_een browsergebaseerde, geen installatie benodigde omgeving_), of lokaal op je computer met een teksteditor zoals [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). #### Maak je repository aan -Om je werk gemakkelijk op te slaan, wordt aanbevolen om een eigen kopie van deze repository te maken. Dit kan je doen door op de knop **Use this template** bovenaan de pagina te klikken. Dit maakt een nieuwe repository aan in je GitHub-account met een kopie van het curriculum. +Om je werk makkelijk op te slaan, is het aanbevolen een eigen kopie van deze repository te maken. Dit kan je doen door op de knop **Use this template** bovenaan de pagina te klikken. Dit maakt een nieuwe repository aan in je GitHub-account met een kopie van het curriculum. Volg deze stappen: -1. **Fork de repository**: Klik op de knop "Fork" rechtsboven op deze pagina. -2. **Clone de repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +1. **Fork de Repository**: Klik op de "Fork"-knop rechtsboven op deze pagina. +2. **Clone de Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -#### Het curriculum draaien in een Codespace +#### De cursus draaien in een Codespace -In je eigen kopie van deze repository, klik op de **Code**-knop en selecteer **Open with Codespaces**. Dit maakt een nieuwe Codespace voor je aan om in te werken. +In je kopie van deze repository die je hebt aangemaakt, klik je de knop **Code** en selecteer je **Open with Codespaces**. Dit maakt een nieuwe Codespace aan waarin je kunt werken. ![Codespace](../../translated_images/nl/createcodespace.0238bbf4d7a8d955.webp) -#### Het curriculum lokaal draaien op je computer +#### De cursus lokaal draaien op je computer -Om dit curriculum lokaal op je computer te draaien, heb je een teksteditor, een browser en een opdrachtregel-tool nodig. Onze eerste les, [Introductie tot programmeertalen en tools van het vak](../../1-getting-started-lessons/1-intro-to-programming-languages), leidt je door verschillende opties voor elk van deze tools, zodat je kunt kiezen wat het beste bij jou past. +Om deze cursus lokaal op je computer te draaien, heb je een teksteditor, een browser en een opdrachtregeltool nodig. Onze eerste les, [Introductie tot programmeertalen en tools van het vak](../../1-getting-started-lessons/1-intro-to-programming-languages), zal je door verschillende opties voor elk van deze tools leiden zodat je kunt kiezen wat het beste bij jou past. -Wij raden aan om [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) als editor te gebruiken, die ook een ingebouwde [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) heeft. Je kunt Visual Studio Code [hier downloaden](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +We raden aan om [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) als editor te gebruiken, die ook een ingebouwde [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) heeft. Je kunt Visual Studio Code [hier downloaden](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). -1. Clone je repository naar je computer. Dit kan je doen door op de knop **Code** te klikken en de URL te kopiëren: +1. Clone je repository naar je computer. Dit kan door op de knop **Code** te klikken en de URL te kopiëren: [CodeSpace](./images/createcodespace.png) -Open vervolgens [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) binnen [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) en voer het volgende commando uit, waarbij je `` vervangt door de URL die je zojuist hebt gekopieerd: + Open dan [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) binnen [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) en voer het volgende commando uit, waarbij u `` vervangt door de URL die u zojuist hebt gekopieerd: ```bash git clone ``` -2. Open de map in Visual Studio Code. Dit kun je doen door te klikken op **Bestand** > **Map openen** en de zojuist gekloonde map te selecteren. +2. Open de map in Visual Studio Code. Dit kan door te klikken op **File** > **Open Folder** en de map te selecteren die u zojuist hebt gekloond. -> Aanbevolen extensies voor Visual Studio Code: +> Aanbevolen Visual Studio Code-extensies: > -> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - om HTML-pagina's binnen Visual Studio Code te bekijken -> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - om je te helpen sneller code te schrijven +> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - om HTML-pagina's te bekijken binnen Visual Studio Code +> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - om u te helpen sneller code te schrijven ## 📂 Elke les bevat: -- optionele schetsnotitie +- optionele sketchnote - optionele aanvullende video -- warming-up quiz voorafgaand aan de les -- schriftelijke les +- warming-up quiz voor de les +- geschreven les - voor projectgebaseerde lessen, stapsgewijze handleidingen over hoe het project te bouwen -- kenniscontroles +- kennistests - een uitdaging - aanvullende lectuur -- een [quiz na de les](https://ff-quizzes.netlify.app/web/) +- opdracht +- [quiz na de les](https://ff-quizzes.netlify.app/web/) -> **Een opmerking over quizzes**: Alle quizzes bevinden zich in de Quiz-app map, in totaal 48 quizzes van elk drie vragen. Ze zijn beschikbaar [hier](https://ff-quizzes.netlify.app/web/), de quiz-app kan lokaal worden uitgevoerd of op Azure worden gedeployed; volg de instructies in de `quiz-app` map. +> **Een opmerking over quizzen**: Alle quizzen bevinden zich in de Quiz-app map, in totaal 48 quizzen van elk drie vragen. Ze zijn beschikbaar [hier](https://ff-quizzes.netlify.app/web/); de quiz-app kan lokaal worden uitgevoerd of worden gedeployed naar Azure; volg de instructies in de `quiz-app` map. ## 🗃️ Lessen -| | Projectnaam | Geleerde Concepten | Leerdoelen | Gelinkte Les | Auteur | -| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | --------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | -| 01 | Aan de slag | Introductie tot programmeren en tools van het vak | Leer de basisprincipes achter de meeste programmeertalen en software die professionele ontwikkelaars helpt hun werk te doen | [Introductie tot programmeertalen en tools van het vak](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | Aan de slag | Basiskennis van GitHub, inclusief samenwerken in een team | Hoe je GitHub gebruikt in je project, hoe je met anderen samenwerkt aan een codebase | [Introductie tot GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | Aan de slag | Toegankelijkheid | Leer de basis van webtoegankelijkheid | [Toegankelijkheidsfundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS Basics | JavaScript-datatypes | De basis van JavaScript-datatypes | [Datatypes](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS Basics | Functies en methoden | Leer over functies en methoden om de logica van een applicatie te beheren | [Functies en methoden](./2-js-basics/2-functions-methods/README.md) | Jasmine en Christopher | -| 06 | JS Basics | Beslissingen nemen met JS | Leer hoe je voorwaarden maakt in je code met besluitvormingsmethoden | [Beslissingen maken](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS Basics | Arrays en lussen | Werk met data met arrays en lussen in JavaScript | [Arrays en lussen](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML in de praktijk | Bouw de HTML voor een online terrarium, met focus op het maken van een layout | [Introductie tot HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS in de praktijk | Bouw de CSS voor de styling van het online terrarium, met de nadruk op basisbeginselen van CSS inclusief een responsive pagina | [Introductie tot CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closures, DOM-manipulatie | Bouw de JavaScript om het terrarium functioneel te maken als een drag/drop interface, met focus op closures en DOM-manipulatie | [JavaScript Closures, DOM-manipulatie](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [Typen Spel](./4-typing-game/solution/README.md) | Bouw een Typen Spel | Leer hoe je toetsenbordgebeurtenissen gebruikt om de logica van je JavaScript-app aan te sturen | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [Groene Browser Extensie](./5-browser-extension/solution/README.md) | Werken met browsers | Leer hoe browsers werken, hun geschiedenis, en hoe je de eerste elementen van een browser extensie opzet | [Over browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [Groene Browser Extensie](./5-browser-extension/solution/README.md) | Formulieren bouwen, een API aanroepen en variabelen lokaal opslaan | Bouw de JavaScript-elementen van je browser extensie om een API aan te roepen met variabelen die lokaal zijn opgeslagen | [API's, formulieren en lokale opslag](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [Groene Browser Extensie](./5-browser-extension/solution/README.md) | Achtergrondprocessen in de browser, webprestaties | Gebruik de achtergrondprocessen van de browser om het icoon van de extensie te beheren; leer over webprestaties en optimalisaties | [Achtergrondtaken en prestaties](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [Ruimte Spel](./6-space-game/solution/README.md) | Meer geavanceerde spelontwikkeling met JavaScript | Leer over overerving met zowel klassen als compositie en het Pub/Sub-patroon, ter voorbereiding op het bouwen van een spel | [Introductie tot geavanceerde spelontwikkeling](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [Ruimte Spel](./6-space-game/solution/README.md) | Tekenen op canvas | Leer over de Canvas-API, gebruikt om elementen op een scherm te tekenen | [Tekenen op canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [Ruimte Spel](./6-space-game/solution/README.md) | Elementen bewegen op het scherm | Ontdek hoe elementen beweging krijgen met behulp van de cartesiaanse coördinaten en de Canvas-API | [Elementen bewegen](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [Ruimte Spel](./6-space-game/solution/README.md) | Botsingdetectie | Laat elementen botsen en op elkaar reageren met keypresses en geef een cooldown-functie om de prestaties van het spel te waarborgen | [Botsingdetectie](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [Ruimte Spel](./6-space-game/solution/README.md) | Score bijhouden | Voer wiskundige berekeningen uit op basis van de status en prestaties van het spel | [Score bijhouden](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [Ruimte Spel](./6-space-game/solution/README.md) | Het spel beëindigen en opnieuw starten | Leer over het beëindigen en opnieuw starten van het spel, inclusief het opruimen van assets en het resetten van variabelen | [De eindvoorwaarde](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [Bankieren App](./7-bank-project/solution/README.md) | HTML-sjablonen en routes in een webapp | Leer hoe je de basisstructuur van een multipagina-website creëert met routing en HTML-sjablonen | [HTML-Sjablonen en routes](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [Bankieren App](./7-bank-project/solution/README.md) | Bouw een inlog- en registratieformulier | Leer over het bouwen van formulieren en het afhandelen van validatieroutines | [Formulieren](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [Bankieren App](./7-bank-project/solution/README.md) | Methoden voor ophalen en gebruiken van data | Hoe data in en uit je app stroomt, hoe je het ophaalt, opslaat en verwijdert | [Data](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [Bankieren App](./7-bank-project/solution/README.md) | Concepten van state management | Leer hoe jouw app de status behoudt en hoe je die programmatisch beheert | [State management](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Browser/VScode Code](../../8-code-editor) | Werken met VScode | Leer hoe je een code-editor gebruikt | [Gebruik VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [AI Assistenten](./9-chat-project/README.md) | Werken met AI | Leer hoe je je eigen AI-assistent bouwt | [AI Assistent project](./9-chat-project/README.md) | Chris | +| | Projectnaam | Aangeleerde Concepten | Leerdoelen | Gelinkte Les | Auteur | +| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------------: | -------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | +| 01 | Aan de slag | Introductie in programmeren en tools van het vak | Leer de basisprincipes achter de meeste programmeertalen en over software die professionele ontwikkelaars helpt | [Introductie in programmeertalen en tools van het vak](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | Aan de slag | Basiskennis van GitHub, inclusief samenwerken in een team | Hoe GitHub te gebruiken in jouw project, hoe samen te werken met anderen aan een codebase | [Introductie in GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | Aan de slag | Toegankelijkheid | Leer de basis van webtoegankelijkheid | [Fundamentals Toegankelijkheid](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS Grundlagen | JavaScript Datatypes | De basis van JavaScript datatypes | [Datatypes](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS Grundlagen | Functies en Methoden | Leer over functies en methoden om de logica van een applicatie te beheren | [Functies en Methodes](./2-js-basics/2-functions-methods/README.md) | Jasmine en Christopher | +| 06 | JS Grundlagen | Beslissingen maken met JS | Leer hoe je voorwaarden maakt in je code met besluitvormingsmethoden | [Beslissingen maken](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS Grundlagen | Arrays en Lussen | Werk met data via arrays en lussen in JavaScript | [Arrays en lussen](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML in de praktijk | Bouw de HTML om een online terrarium te maken, met focus op het bouwen van een layout | [Introductie in HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS in de praktijk | Bouw de CSS om het online terrarium te stylen, met basiskennis van CSS, inclusief het responsief maken van de pagina | [Introductie in CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closures, DOM-manipulatie | Bouw de JavaScript om het terrarium als een sleep-en-zet-interface te laten functioneren, met focus op closures en DOM-manipulatie | [JavaScript Closures, DOM-manipulatie](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [Typwedstrijd](./4-typing-game/solution/README.md) | Bouw een Typwedstrijd | Leer hoe je toetsenbordgebeurtenissen gebruikt om de logica van je JavaScript-app aan te sturen | [Gebeurtenisgestuurd programmeren](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [Groene Browserextensie](./5-browser-extension/solution/README.md) | Werken met browsers | Leer hoe browsers werken, hun geschiedenis, en hoe je de eerste elementen van een browserextensie bouwt | [Over Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [Groene Browserextensie](./5-browser-extension/solution/README.md) | Formulier bouwen, API aanroepen en variabelen opslaan in local storage | Bouw de JavaScript-elementen van je browserextensie om een API aan te roepen met variabelen opgeslagen in local storage | [APIs, formulieren en local storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [Groene Browserextensie](./5-browser-extension/solution/README.md) | Achtergrondprocessen in de browser, webprestaties | Gebruik de achtergrondprocessen van de browser om het pictogram van de extensie te beheren; leer over webprestaties en optimalisaties | [Achtergrondtaken en prestaties](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [Ruimte Spel](./6-space-game/solution/README.md) | Geavanceerde spelontwikkeling met JavaScript | Leer over overerving met zowel klassen als compositie en het Pub/Sub-patroon, ter voorbereiding op het bouwen van een spel | [Introductie in geavanceerde spelontwikkeling](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [Ruimte Spel](./6-space-game/solution/README.md) | Tekenen op canvas | Leer over de Canvas API, gebruikt om elementen op een scherm te tekenen | [Tekenen op Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [Ruimte Spel](./6-space-game/solution/README.md) | Elementen rond het scherm bewegen | Ontdek hoe elementen beweging krijgen met behulp van kartesische coördinaten en de Canvas API | [Elementen bewegen](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [Ruimte Spel](./6-space-game/solution/README.md) | Detectie van botsingen | Laat elementen botsen en op elkaar reageren via toetsaanslagen en zorg voor een cooldown-functie om prestaties te waarborgen | [Botsingsdetectie](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [Ruimte Spel](./6-space-game/solution/README.md) | Score bijhouden | Voer wiskundige berekeningen uit op basis van de status en prestaties van het spel | [Score bijhouden](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [Ruimte Spel](./6-space-game/solution/README.md) | Het spel beëindigen en herstarten | Leer over het beëindigen en herstarten van het spel, inclusief opruimen van middelen en resetten van variabelen | [De eindvoorwaarde](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [Bankapp](./7-bank-project/solution/README.md) | HTML-sjablonen en routes in een webapp | Leer hoe je de opbouw van een meerpaginawebsite architectuur maakt met routing en HTML-sjablonen | [HTML-sjablonen en routes](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [Bankapp](./7-bank-project/solution/README.md) | Bouw een inlog- en registratieformulier | Leer over het bouwen van formulieren en het afhandelen van validatieroutines | [Formulieren](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [Bankapp](./7-bank-project/solution/README.md) | Methoden voor ophalen en gebruiken van data | Hoe data in en uit je app stroomt, hoe je het ophaalt, opslaat en verwijdert | [Data](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [Bankapp](./7-bank-project/solution/README.md) | Concepten van State Management | Leer hoe je app state behoudt en hoe je die programmatisch beheert | [State Management](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [Browser/VScode Code](../../8-code-editor) | Werken met VScode | Leer hoe je een code-editor gebruikt | [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [AI Assistants](./9-chat-project/README.md) | Werken met AI | Leer hoe je je eigen AI-assistent bouwt | [AI Assistant project](./9-chat-project/README.md) | Chris | ## 🏫 Pedagogiek -Ons curriculum is ontworpen met twee belangrijke pedagogische principes in gedachten: -* leren door projecten -* frequente quizzes +Onze lesmethode is ontworpen met twee belangrijke pedagogische principes in gedachten: +* projectgebaseerd leren +* frequente quizzen -Het programma leert de basisprincipes van JavaScript, HTML en CSS, evenals de nieuwste tools en technieken die tegenwoordig door webontwikkelaars worden gebruikt. Studenten krijgen de kans om praktische ervaring op te doen door het bouwen van een typenspel, een virtueel terrarium, een milieuvriendelijke browserextensie, een ruimte-invader-stijl spel en een bankapp voor bedrijven. Aan het einde van de serie zullen studenten een gedegen begrip van webontwikkeling hebben verworven. +Het programma onderwijst de basisprincipes van JavaScript, HTML en CSS, evenals de nieuwste tools en technieken die tegenwoordig door webontwikkelaars worden gebruikt. Studenten krijgen de kans om praktische ervaring op te doen door het bouwen van een typwedstrijd, virtueel terrarium, milieuvriendelijke browserextensie, space-invader-stijl spel en een bankapp voor bedrijven. Aan het einde van de serie hebben studenten een solide begrip van webontwikkeling opgebouwd. -> 🎓 Je kunt de eerste paar lessen in dit curriculum volgen als een [Leerpad](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) op Microsoft Learn! +> 🎓 Je kunt de eerste paar lessen van deze cursus volgen als een [Leerpad](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) op Microsoft Learn! -Door ervoor te zorgen dat de inhoud aansluit bij projecten, wordt het proces leerzamer en boeiender voor de studenten en wordt het onthouden van concepten versterkt. We hebben ook verschillende startlessen geschreven in de basis van JavaScript om concepten te introduceren, gecombineerd met een video uit de "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" collectie van videotutorials, waarvan sommige auteurs bijdroegen aan dit curriculum. +Doordat de inhoud aansluit bij projecten, wordt het proces voor studenten boeiender en wordt het onthouden van concepten vergroot. We hebben ook verschillende startlessen in JavaScript basics geschreven om de concepten te introduceren, gekoppeld aan een video uit de "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" collectie van videotutorials, waarvan sommige auteurs hebben bijgedragen aan deze cursus. -Daarnaast zet een quiz met lage druk voor een les de intentie van de student voor het leren van een onderwerp, terwijl een tweede quiz na de les verdere retentie verzekert. Dit curriculum is ontworpen om flexibel en leuk te zijn en kan geheel of gedeeltelijk worden gevolgd. De projecten beginnen klein en worden steeds complexer aan het einde van de 12-weekse cyclus. +Daarnaast zet een quiz met weinig inzet voor een les de intentie van de student om een onderwerp te leren, terwijl een tweede quiz na de les zorgt voor verdere retentie. Deze cursus is ontworpen om flexibel en leuk te zijn en kan geheel of gedeeltelijk worden gevolgd. De projecten beginnen klein en worden steeds complexer aan het einde van de 12-weekse cyclus. -Hoewel we er bewust voor hebben gekozen om geen JavaScript-frameworks te introduceren om ons te concentreren op de basisvaardigheden die je als webontwikkelaar nodig hebt voordat je een framework adopteert, is een goede volgende stap na dit curriculum het leren over Node.js via een andere collectie video’s: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". +Hoewel we er bewust voor hebben gekozen om geen JavaScript-frameworks te introduceren, om ons te concentreren op de basisvaardigheden die nodig zijn als webontwikkelaar voordat je een framework adopteert, zou een goede vervolgstap na deze cursus het leren van Node.js zijn via een andere collectie video’s: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". > Bezoek onze [Gedragscode](CODE_OF_CONDUCT.md) en [Bijdragen](CONTRIBUTING.md) richtlijnen. We verwelkomen je constructieve feedback! ## 🧭 Offline toegang -Je kunt deze documentatie offline gebruiken door [Docsify](https://docsify.js.org/#/) te gebruiken. Fork deze repo, [installeer Docsify](https://docsify.js.org/#/quickstart) op je lokale machine en typ vervolgens in de hoofdmap van deze repo `docsify serve`. De website wordt dan bediend op poort 3000 op je localhost: `localhost:3000`. +Je kunt deze documentatie offline gebruiken met [Docsify](https://docsify.js.org/#/). Fork deze repository, [installeer Docsify](https://docsify.js.org/#/quickstart) op je lokale machine, en typ vervolgens in de hoofdmap van deze repository `docsify serve`. De website wordt geserveerd op poort 3000 op je localhost: `localhost:3000`. ## 📘 PDF @@ -192,51 +209,51 @@ Ons team maakt ook andere cursussen! Bekijk: ### LangChain -[![LangChain4j voor Beginners](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners) -[![LangChain.js voor Beginners](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin) - +[![LangChain4j for Beginners](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners) +[![LangChain.js for Beginners](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin) +[![LangChain for Beginners](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin) --- ### Azure / Edge / MCP / Agents -[![AZD voor Beginners](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst) -[![Edge AI voor Beginners](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) -[![MCP voor Beginners](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) -[![AI Agents voor Beginners](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst) +[![AZD for Beginners](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst) +[![Edge AI for Beginners](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) +[![MCP for Beginners](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) +[![AI Agents for Beginners](https://img.shields.io/badge/AI%20Agents%20for%20Beginners-00C49A?style=for-the-badge&labelColor=E5E7EB&color=00C49A)](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst) --- ### Generatieve AI Serie -[![Generatieve AI voor Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) -[![Generatieve AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) -[![Generatieve AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) -[![Generatieve AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst) +[![Generative AI for Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) +[![Generative AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) +[![Generative AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) +[![Generative AI (JavaScript)](https://img.shields.io/badge/Generative%20AI%20(JavaScript)-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst) --- -### Core Learning -[![ML voor Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) -[![Data Science voor Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) -[![AI voor Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) -[![Cybersecurity voor Beginners](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung) -[![Web Dev voor Beginners](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst) -[![IoT voor Beginners](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst) -[![XR Ontwikkeling voor Beginners](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst) +### Kernleren +[![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) +[![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) +[![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) +[![Cybersecurity for Beginners](https://img.shields.io/badge/Cybersecurity%20for%20Beginners-F97316?style=for-the-badge&labelColor=E5E7EB&color=F97316)](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung) +[![Web Dev for Beginners](https://img.shields.io/badge/Web%20Dev%20for%20Beginners-EC4899?style=for-the-badge&labelColor=E5E7EB&color=EC4899)](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst) +[![IoT for Beginners](https://img.shields.io/badge/IoT%20for%20Beginners-14B8A6?style=for-the-badge&labelColor=E5E7EB&color=14B8A6)](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst) +[![XR Development for Beginners](https://img.shields.io/badge/XR%20Development%20for%20Beginners-38BDF8?style=for-the-badge&labelColor=E5E7EB&color=38BDF8)](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst) --- ### Copilot Serie -[![Copilot voor AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) -[![Copilot voor C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) -[![Copilot Avontuur](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) +[![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) +[![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) +[![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) ## Hulp krijgen -Als je vastloopt of vragen hebt over het bouwen van AI-apps. Doe mee met andere leerlingen en ervaren ontwikkelaars in discussies over MCP. Het is een ondersteunende gemeenschap waar vragen welkom zijn en kennis vrij gedeeld wordt. +Als je vastloopt of vragen hebt over het bouwen van AI-apps. Doe mee aan discussies met mede-leerlingen en ervaren ontwikkelaars over MCP. Het is een ondersteunende gemeenschap waar vragen welkom zijn en kennis vrij wordt gedeeld. [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -Als je productfeedback hebt of fouten tegenkomt tijdens het bouwen, bezoek: +Als je productfeedback hebt of fouten tegenkomt tijdens het bouwen, bezoek dan: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) @@ -247,6 +264,6 @@ Deze repository is gelicentieerd onder de MIT-licentie. Zie het [LICENSE](../../ --- -**Disclaimer**: -Dit document is vertaald met behulp van de AI-vertalingsdienst [Co-op Translator](https://github.com/Azure/co-op-translator). Hoewel wij streven naar nauwkeurigheid, dient u er rekening mee te houden dat geautomatiseerde vertalingen fouten of onnauwkeurigheden kunnen bevatten. Het originele document in de oorspronkelijke taal wordt beschouwd als de gezaghebbende bron. Voor cruciale informatie wordt professionele menselijke vertaling aanbevolen. Wij zijn niet aansprakelijk voor misverstanden of verkeerd geïnterpreteerde informatie voortkomend uit het gebruik van deze vertaling. +**Disclaimer**: +Dit document is vertaald met behulp van de AI-vertalingsservice [Co-op Translator](https://github.com/Azure/co-op-translator). Hoewel wij streven naar nauwkeurigheid, dient u er rekening mee te houden dat automatische vertalingen fouten of onnauwkeurigheden kunnen bevatten. Het originele document in de oorspronkelijke taal moet worden beschouwd als de gezaghebbende bron. Voor kritieke informatie wordt professionele menselijke vertaling aanbevolen. Wij zijn niet aansprakelijk voor misverstanden of verkeerde interpretaties die voortvloeien uit het gebruik van deze vertaling. \ No newline at end of file diff --git a/translations/nl/Roadmap.md b/translations/nl/Roadmap.md new file mode 100644 index 000000000..f8ccd5c61 --- /dev/null +++ b/translations/nl/Roadmap.md @@ -0,0 +1,53 @@ +# Routekaart voor de Web-Dev-For-Beginners Repository van Microsoft + +**Deze repository biedt een routekaart om de basisprincipes van webontwikkeling te leren met een focus op JavaScript, HTML en CSS. Het curriculum is flexibel en kan geheel of gedeeltelijk worden gevolgd, met 24 lessen verspreid over 12 weken.** + +## Belangrijke mijlpalen + +* **Weken 1-3:** + * Introductie tot programmeertalen en tools van het vak + * Basis van GitHub + * Toegankelijkheid + * JS basisprincipes: gegevenstypen, functies en methoden + * Beslissingen maken met JS +* **Weken 4-6:** + * Arrays en lussen + * Terrarium: HTML in de praktijk + * CSS in de praktijk + * JavaScript closures + * DOM-manipulatie +* **Weken 7-9:** + * Typing Game: Gebeurtenisgestuurde programmering + * Green Browser Extension: Werken met browsers + * Een formulier bouwen, een API aanroepen en variabelen opslaan in lokale opslag + * Achtergrondprocessen in de browser + * Webprestaties +* **Weken 10-12:** + * Space Game: Meer geavanceerde game-ontwikkeling met JavaScript + * Tekenen op canvas + * Elementen verplaatsen over het scherm + * Botsingsdetectie + * Score bijhouden, het spel beëindigen en opnieuw starten + * Banking App: HTML-sjablonen en routes in een web-app + * Een login- en registratieformulier bouwen + * Methoden om data op te halen en te gebruiken + * Concepten van State Management + +## Leerresultaten + +**Door deze routekaart te voltooien, krijgen studenten praktische ervaring met het bouwen van een typgame, een virtueel terrarium, een milieuvriendelijke browserextensie, een space-invader-stijl spel en een bankapp voor bedrijven. Ze ontwikkelen ook een solide begrip van de basisprincipes van webontwikkeling.** + +## Aanvullende bronnen + +* Deze repository biedt een schat aan bronnen voor verdere studie, inclusief tutorials, codevoorbeelden en uitdagingen. +* Het Microsoft Learn-platform biedt diverse webontwikkeling cursussen en leertrajecten. +* Online gemeenschappen zoals Stack Overflow en de MDN Web Docs bieden waardevolle ondersteuning en bronnen voor webontwikkelaars. + +**Ik hoop dat deze routekaart je helpt op je webontwikkelingsreis!** + +--- + + +**Disclaimer**: +Dit document is vertaald met behulp van de AI-vertalingsdienst [Co-op Translator](https://github.com/Azure/co-op-translator). Hoewel we streven naar nauwkeurigheid, dient u er rekening mee te houden dat geautomatiseerde vertalingen fouten of onjuistheden kunnen bevatten. Het oorspronkelijke document in de oorspronkelijke taal geldt als de gezaghebbende bron. Voor cruciale informatie wordt professionele menselijke vertaling aanbevolen. Wij zijn niet aansprakelijk voor eventuele misverstanden of verkeerde interpretaties die voortvloeien uit het gebruik van deze vertaling. + \ No newline at end of file diff --git a/translations/no/.co-op-translator.json b/translations/no/.co-op-translator.json index a29daf3b4..e4e16a3c5 100644 --- a/translations/no/.co-op-translator.json +++ b/translations/no/.co-op-translator.json @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2025-10-03T11:30:17+00:00", + "translation_date": "2026-02-06T17:35:49+00:00", "source_file": "AGENTS.md", "language_code": "no" }, @@ -516,11 +516,17 @@ "language_code": "no" }, "README.md": { - "original_hash": "490c83786552d7fab6390991517bef09", - "translation_date": "2026-01-29T18:34:07+00:00", + "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc", + "translation_date": "2026-02-06T17:29:49+00:00", "source_file": "README.md", "language_code": "no" }, + "Roadmap.md": { + "original_hash": "28bf6185fd7f27b62ddc210514366192", + "translation_date": "2026-02-06T17:34:10+00:00", + "source_file": "Roadmap.md", + "language_code": "no" + }, "SECURITY.md": { "original_hash": "4ecc3bf2e27983d4c780be6f26ee6228", "translation_date": "2025-08-26T21:27:03+00:00", diff --git a/translations/no/AGENTS.md b/translations/no/AGENTS.md index fd18ed37f..d66690106 100644 --- a/translations/no/AGENTS.md +++ b/translations/no/AGENTS.md @@ -2,53 +2,53 @@ ## Prosjektoversikt -Dette er et utdanningsrepository for å lære nybegynnere grunnleggende webutvikling. Pensumet er et omfattende 12-ukers kurs utviklet av Microsoft Cloud Advocates, med 24 praktiske leksjoner som dekker JavaScript, CSS og HTML. +Dette er et utdanningsrepository for å lære bort grunnleggende webutvikling til nybegynnere. Pensumet er et omfattende 12-ukers kurs utviklet av Microsoft Cloud Advocates, med 24 praktiske leksjoner som dekker JavaScript, CSS og HTML. -### Hovedkomponenter +### Nøkkelkomponenter - **Utdanningsinnhold**: 24 strukturerte leksjoner organisert i prosjektbaserte moduler -- **Praktiske prosjekter**: Terrarium, Skrivespill, Nettleserutvidelse, Romspill, Bankapp, Kodeeditor og AI-chatassistent -- **Interaktive quizer**: 48 quizer med 3 spørsmål hver (før/etter leksjon) -- **Flerspråklig støtte**: Automatiserte oversettelser til 50+ språk via GitHub Actions +- **Praktiske prosjekter**: Terrarium, Typing Game, Nettleserutvidelse, Space Game, Banking App, Code Editor og AI Chat Assistant +- **Interaktive quizzer**: 48 quizzer med 3 spørsmål hver (før og etter leksjon) +- **Flerspråklig støtte**: Automatiserte oversettelser for 50+ språk via GitHub Actions - **Teknologier**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (for AI-prosjekter) ### Arkitektur - Utdanningsrepository med leksjonsbasert struktur - Hver leksjonsmappe inneholder README, kodeeksempler og løsninger -- Frittstående prosjekter i separate kataloger (quiz-app, ulike leksjonsprosjekter) +- Frittstående prosjekter i egne kataloger (quiz-app, ulike leksjonsprosjekter) - Oversettelsessystem ved bruk av GitHub Actions (co-op-translator) - Dokumentasjon levert via Docsify og tilgjengelig som PDF ## Oppsettskommandoer -Dette repositoryet er primært for konsumering av utdanningsinnhold. For å jobbe med spesifikke prosjekter: +Dette repositoryet er primært for konsumering av utdanningsinnhold. For arbeid med spesifikke prosjekter: -### Hovedrepository-oppsett +### Hovedrepository Oppsett ```bash git clone https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners ``` -### Oppsett av Quiz-app (Vue 3 + Vite) +### Quiz App Oppsett (Vue 3 + Vite) ```bash cd quiz-app npm install -npm run dev # Start development server -npm run build # Build for production -npm run lint # Run ESLint +npm run dev # Start utviklingsserver +npm run build # Bygg for produksjon +npm run lint # Kjør ESLint ``` -### Bankprosjekt-API (Node.js + Express) +### Bankprosjekt API (Node.js + Express) ```bash cd 7-bank-project/api npm install -npm start # Start API server -npm run lint # Run ESLint -npm run format # Format with Prettier +npm start # Start API-server +npm run lint # Kjør ESLint +npm run format # Formater med Prettier ``` ### Nettleserutvidelsesprosjekter @@ -56,70 +56,70 @@ npm run format # Format with Prettier ```bash cd 5-browser-extension/solution npm install -# Follow browser-specific extension loading instructions +# Følg nettleserspesifikke instruksjoner for lasting av utvidelser ``` -### Romspillprosjekter +### Space Game Prosjekter ```bash cd 6-space-game/solution npm install -# Open index.html in browser or use Live Server +# Åpne index.html i nettleser eller bruk Live Server ``` -### Chat-prosjekt (Python-backend) +### Chat Prosjekt (Python Backend) ```bash cd 9-chat-project/solution/backend/python pip install openai -# Set GITHUB_TOKEN environment variable +# Sett miljøvariabelen GITHUB_TOKEN python api.py ``` ## Utviklingsarbeidsflyt -### For innholdsbidragsytere +### For innholdsleverandører 1. **Fork repositoryet** til din GitHub-konto 2. **Klon din fork** lokalt -3. **Opprett en ny gren** for endringene dine +3. **Opprett en ny branch** for endringene dine 4. Gjør endringer i leksjonsinnhold eller kodeeksempler 5. Test eventuelle kodeendringer i relevante prosjektkataloger -6. Send inn pull requests i henhold til retningslinjene for bidrag +6. Send pull requests i henhold til retningslinjene for bidrag ### For lærende 1. Fork eller klon repositoryet 2. Naviger til leksjonskatalogene i rekkefølge 3. Les README-filene for hver leksjon -4. Fullfør før-leksjonsquizer på https://ff-quizzes.netlify.app/web/ -5. Jobb gjennom kodeeksempler i leksjonsmapper +4. Fullfør før-leksjon quizzer på https://ff-quizzes.netlify.app/web/ +5. Jobb gjennom kodeeksempler i leksjonsmappene 6. Fullfør oppgaver og utfordringer -7. Ta etter-leksjonsquizer +7. Ta etter-leksjon quizzer ### Live utvikling -- **Dokumentasjon**: Kjør `docsify serve` i rotkatalogen (port 3000) -- **Quiz-app**: Kjør `npm run dev` i quiz-app-katalogen -- **Prosjekter**: Bruk VS Code Live Server-utvidelsen for HTML-prosjekter +- **Dokumentasjon**: Kjør `docsify serve` i roten (port 3000) +- **Quiz App**: Kjør `npm run dev` i quiz-app katalogen +- **Prosjekter**: Bruk VS Code Live Server extension for HTML-prosjekter - **API-prosjekter**: Kjør `npm start` i respektive API-kataloger ## Testinstruksjoner -### Testing av Quiz-app +### Testing av Quiz App ```bash cd quiz-app -npm run lint # Check for code style issues -npm run build # Verify build succeeds +npm run lint # Sjekk for kode stil problemer +npm run build # Bekreft at byggingen lykkes ``` -### Testing av Bank-API +### Testing av Bank API ```bash cd 7-bank-project/api -npm run lint # Check for code style issues -node server.js # Verify server starts without errors +npm run lint # Sjekk for kode stil problemer +node server.js # Bekreft at server starter uten feil ``` ### Generell testtilnærming @@ -127,8 +127,8 @@ node server.js # Verify server starts without errors - Dette er et utdanningsrepository uten omfattende automatiserte tester - Manuell testing fokuserer på: - Kodeeksempler kjører uten feil - - Lenker i dokumentasjonen fungerer korrekt - - Prosjektbygg fullføres vellykket + - Lenker i dokumentasjonen fungerer riktig + - Prosjektbyggeoperasjoner fullføres uten feil - Eksempler følger beste praksis ### Sjekk før innsending @@ -136,147 +136,147 @@ node server.js # Verify server starts without errors - Kjør `npm run lint` i kataloger med package.json - Verifiser at markdown-lenker er gyldige - Test kodeeksempler i nettleser eller Node.js -- Sjekk at oversettelser opprettholder riktig struktur +- Sjekk at oversettelser opprettholder korrekt struktur -## Retningslinjer for kodestil +## Kode stil retningslinjer ### JavaScript -- Bruk moderne ES6+ syntaks -- Følg standard ESLint-konfigurasjoner som er gitt i prosjektene -- Bruk meningsfulle variabel- og funksjonsnavn for pedagogisk klarhet +- Bruk moderne ES6+ syntax +- Følg standard ESLint-konfigurasjoner gitt i prosjektene +- Bruk meningsfulle variabel- og funksjonsnavn for utdanningsklarhet - Legg til kommentarer som forklarer konsepter for lærende -- Formater med Prettier der det er konfigurert +- Formater med Prettier der dette er konfigurert ### HTML/CSS - Semantiske HTML5-elementer -- Prinsipper for responsivt design -- Klare klassenavnkonvensjoner +- Responsive designprinsipper +- Klare klasse-navnekonvensjoner - Kommentarer som forklarer CSS-teknikker for lærende ### Python -- PEP 8-stilretningslinjer -- Klare, pedagogiske kodeeksempler -- Type hints der det er nyttig for læring +- PEP 8 stilretningslinjer +- Tydelige, pedagogiske kodeeksempler +- Type hints hvor hjelpsomt for læring ### Markdown-dokumentasjon - Klar overskriftsstruktur -- Kodeblokker med språkspecifikasjon -- Lenker til tilleggsmateriell -- Skjermbilder og bilder i `images/`-kataloger +- Kodeblokker med språkspesifikasjon +- Lenker til tilleggsmateriale +- Skjermbilder og bilder i `images/` kataloger - Alt-tekst for bilder for tilgjengelighet ### Filorganisering - Leksjoner nummerert sekvensielt (1-getting-started-lessons, 2-js-basics, osv.) -- Hvert prosjekt har `solution/` og ofte `start/` eller `your-work/`-kataloger -- Bilder lagret i leksjonsspesifikke `images/`-mapper -- Oversettelser i `translations/{language-code}/`-struktur +- Hvert prosjekt har `solution/` og ofte `start/` eller `your-work/` kataloger +- Bilder lagres i leksjon-spesifikke `images/` mapper +- Oversettelser lagres i `translations/{language-code}/` struktur ## Bygging og distribusjon -### Distribusjon av Quiz-app (Azure Static Web Apps) +### Distribusjon av Quiz App (Azure Static Web Apps) -Quiz-appen er konfigurert for distribusjon via Azure Static Web Apps: +quiz-app er konfigurert for distribusjon til Azure Static Web Apps: ```bash cd quiz-app -npm run build # Creates dist/ folder -# Deploys via GitHub Actions workflow on push to main +npm run build # Oppretter dist/-mappen +# Distribuerer via GitHub Actions-arbeidsflyt ved push til main ``` -Konfigurasjon for Azure Static Web Apps: +Azure Static Web Apps konfigurasjon: - **App-plassering**: `/quiz-app` - **Output-plassering**: `dist` -- **Arbeidsflyt**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` +- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` -### Generering av dokumentasjon som PDF +### Generering av PDF-dokumentasjon ```bash -npm install # Install docsify-to-pdf -npm run convert # Generate PDF from docs +npm install # Installer docsify-to-pdf +npm run convert # Generer PDF fra docs ``` ### Docsify-dokumentasjon ```bash -npm install -g docsify-cli # Install Docsify globally -docsify serve # Serve on localhost:3000 +npm install -g docsify-cli # Installer Docsify globalt +docsify serve # Tjen på localhost:3000 ``` ### Prosjektspesifikke bygg -Hver prosjektkatalog kan ha sin egen byggeprosess: -- Vue-prosjekter: `npm run build` lager produksjonsbundler -- Statisk prosjekter: Ingen byggeprosess, server filene direkte +Hver prosjektkatalog kan ha egen byggeprosess: +- Vue-prosjekter: `npm run build` lager produksjonspakker +- Statisk prosjekter: Ingen byggeprosess, server filer direkte ## Retningslinjer for pull requests ### Tittelformat -Bruk klare, beskrivende titler som indikerer endringsområdet: +Bruk klare, beskrivende titler som angir område for endring: - `[Quiz-app] Legg til ny quiz for leksjon X` - `[Lesson-3] Rett skrivefeil i terrarium-prosjekt` - `[Translation] Legg til spansk oversettelse for leksjon 5` -- `[Docs] Oppdater oppsettsinstruksjoner` +- `[Docs] Oppdater oppsettinstruksjoner` ### Nødvendige sjekker -Før du sender inn en PR: +Før du sender en PR: 1. **Kodekvalitet**: - Kjør `npm run lint` i berørte prosjektkataloger - - Rett alle linting-feil og advarsler + - Rett opp alle lint-feil og advarsler -2. **Byggverifisering**: - - Kjør `npm run build` hvis aktuelt +2. **Byggeverifisering**: + - Kjør `npm run build` om relevant - Sørg for at det ikke er byggefeil -3. **Lenkevalidering**: +3. **Lenkekontroll**: - Test alle markdown-lenker - - Verifiser at bildereferanser fungerer + - Verifiser at bildehenvisninger fungerer -4. **Innholdsrevisjon**: - - Korrekturles for stave- og grammatikkfeil - - Sørg for at kodeeksempler er korrekte og pedagogiske - - Verifiser at oversettelser opprettholder original mening +4. **Innholdsgjennomgang**: + - Korrekturles for stavefeil og grammatikk + - Sørg for at kodeeksempler er riktige og pedagogiske + - Dobbeltsjekk at oversettelser beholder opprinnelig betydning -### Krav til bidrag +### Bidragskrav -- Godta Microsoft CLA (automatisk sjekk ved første PR) +- Aksepter Microsoft CLA (automatisk sjekk på første PR) - Følg [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Se [CONTRIBUTING.md](./CONTRIBUTING.md) for detaljerte retningslinjer -- Referer til issuenumre i PR-beskrivelsen hvis aktuelt +- Referer til issue-numre i PR-beskrivelse om relevant ### Gjennomgangsprosess -- PR-er gjennomgås av vedlikeholdere og fellesskapet -- Pedagogisk klarhet prioriteres -- Kodeeksempler bør følge gjeldende beste praksis -- Oversettelser gjennomgås for nøyaktighet og kulturell tilpasning +- PRer gjennomgås av vedlikeholdere og fellesskap +- Utdanningsklarhet prioriteres +- Kodeeksempler skal følge gjeldende beste praksis +- Oversettelser vurderes for nøyaktighet og kulturell tilpasning ## Oversettelsessystem -### Automatisert oversettelse +### Automatisk oversettelse -- Bruker GitHub Actions med co-op-translator arbeidsflyt +- Bruker GitHub Actions med co-op-translator workflow - Oversetter automatisk til 50+ språk - Kildefiler i hovedkataloger -- Oversatte filer i `translations/{language-code}/`-kataloger +- Oversatte filer i `translations/{language-code}/` kataloger -### Legge til manuelle forbedringer i oversettelser +### Legge til manuelle oversettelsesforbedringer -1. Finn filen i `translations/{language-code}/` -2. Gjør forbedringer mens du opprettholder strukturen +1. Finn fil i `translations/{language-code}/` +2. Gjør forbedringer samtidig som struktur bevares 3. Sørg for at kodeeksempler forblir funksjonelle 4. Test eventuelt lokaliserte quizinnhold -### Metadata for oversettelser +### Oversettelsesmetadata -Oversatte filer inkluderer metadata-header: +Oversatte filer inkluderer metadata header: ```markdown +**Ansvarsfraskrivelse**: +Dette dokumentet er oversatt ved hjelp av AI-oversettelsestjenesten [Co-op Translator](https://github.com/Azure/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 originale dokumentet på dets opprinnelige språk bør anses som den autoritative kilden. For kritisk informasjon anbefales profesjonell menneskelig oversettelse. Vi er ikke ansvarlige for eventuelle misforståelser eller feiltolkninger som oppstår ved bruk av denne oversettelsen. + \ No newline at end of file diff --git a/translations/no/README.md b/translations/no/README.md index 126ae1e1c..99014091b 100644 --- a/translations/no/README.md +++ b/translations/no/README.md @@ -2,7 +2,7 @@ [![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/) [![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/) [![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/) -[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) +[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) [![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/) @@ -10,29 +10,29 @@ [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -# Webutvikling for nybegynnere - Et læreplan +# Webutvikling for nybegynnere - en 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! +Lær det grunnleggende om 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. Delta i quizzer, diskusjoner og praktiske oppgaver. Forbedre ferdighetene dine og optimaliser kunnskapsbevaringen med vår effektive prosjektbaserte pedagogikk. Start din kodingreise i dag! -Bli med i Azure AI Foundry Discord Community +Bli med i Azure AI Foundry Discord-fellesskapet [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -Følg disse trinnene for å komme i gang med å bruke disse ressursene: -1. **Gaffel depotet**: Klikk [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) -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**](https://discord.com/invite/ByRwuEEgH4) +Følg disse trinnene for å komme i gang med disse ressursene: +1. **Lag en gaffel av repositoriet**: Klikk [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +2. **Klon repositoriet**: `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**](https://discord.com/invite/ByRwuEEgH4) ### 🌐 Flerspråklig støtte -#### Støttet via GitHub Action (Automatisert og alltid oppdatert) +#### Støttet via GitHub Action (Automatisk og alltid oppdatert) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](./README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) > **Foretrekker du å klone lokalt?** -> Dette depotet inkluderer 50+ språkoversettelser som betydelig øker nedlastingsstørrelsen. For å klone uten oversettelser, bruk sparse checkout: +> Dette repositoriet inkluderer 50+ språkoversettelser som øker nedlastningsstørrelsen betydelig. For å klone uten oversettelser, bruk sparse checkout: > ```bash > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > cd Web-Dev-For-Beginners @@ -41,89 +41,90 @@ Følg disse trinnene for å komme i gang med å bruke disse ressursene: > 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](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** +**Hvis du ønsker at flere oversettelsesspråk skal støttes, er de oppført [her](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) #### 🧑‍🎓 _Er du student?_ -Besøk [**Student Hub-siden**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) 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. +Besøk [**Student Hub-side**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) 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 ettersom vi bytter ut innhold månedlig. -### 📣 Annonsering - Nye GitHub Copilot Agent-modus utfordringer å fullføre! +### 📣 Kunngjøring - 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. +Ny utfordring lagt til, se etter "GitHub Copilot Agent Challenge 🚀" i de fleste kapitler. Det er en ny utfordring for deg å fullføre ved hjelp av GitHub Copilot og Agent-modus. Om du ikke har brukt Agent-modus før, kan den ikke bare generere tekst, men også lage og redigere filer, kjøre kommandoer og mer. -### 📣 Annonsering - _Nytt prosjekt å bygge med Generativ AI_ +### 📣 Kunngjøring - _Nytt prosjekt å bygge med Generativ AI_ -Nytt AI-assistentprosjekt nettopp lagt til, sjekk ut [prosjektet](./9-chat-project/README.md) +Nytt AI Assistant-prosjekt nettopp lagt til, sjekk det ut [prosjekt](./9-chat-project/README.md) -### 📣 Annonsering - _Ny læreplan_ om Generativ AI for JavaScript ble nettopp utgitt +### 📣 Kunngjøring - _Ny læreplan_ om Generativ AI for JavaScript er nettopp lansert -Ikke gå glipp av vår nye Generative AI læreplan! +Ikke gå glipp av vår nye Generativ AI læreplan! Besøk [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) for å komme i gang! ![Background](../../translated_images/no/background.148a8d43afde5730.webp) - 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! +- Kommuniser med historiske karakterer med GenAI og vår følgesvenn-app. +- Morsom og engasjerende fortelling, du vil reise i tid! ![character](../../translated_images/no/character.5c0dd8e067ffd693.webp) -Hver leksjon inkluderer en oppgave å fullføre, en kunnskapskontroll og en utfordring som guider deg i å lære emner som: + +Hver leksjon inkluderer en oppgave å fullføre, en kunnskapstest og en utfordring for å veilede deg gjennom læringsemner som: - Prompting og prompt-engineering -- Tekst- og bildeappgenerering +- Tekst- og bildeapp-generering - Søkeapper -Besøk [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course) for å komme i gang! +Besøk [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) for å komme i gang! ## 🌱 Komme i gang -> **Lærere**, vi har [inkludert noen forslag](for-teachers.md) til hvordan du kan bruke denne læreplanen. Vi vil gjerne ha tilbakemeldingen din [i vårt diskusjonsforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! +> **Lærere**, vi har [inkludert noen forslag](for-teachers.md) til hvordan bruke denne læreplanen. Vi setter stor pris på din tilbakemelding [i vår diskusjonsforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! -**[Elever](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, 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. +**[Lærende](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, for hver leksjon, start med en pre-forelesningsquiz og følg deretter med å lese forelesningsmaterialet, fullføre de ulike aktivitetene og sjekk forståelsen din med post-forelesningsquizen. -For å forbedre læringsopplevelsen din, koble til med jevnaldrende for å jobbe med prosjektene sammen! Diskusjoner oppmuntres i vårt [diskusjonsforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) hvor vårt team av moderatorer vil være tilgjengelig for å svare på dine spørsmål. +For å forbedre læringsopplevelsen din, koble deg sammen med dine jevnaldrende for å jobbe med prosjektene sammen! Diskusjoner oppfordres i vårt [diskusjonsforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) 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](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) for flere studiematerialer. +For å videreutvikle utdannelsen din, anbefaler vi sterkt å utforske [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) for tilleggsmateriell. ### 📋 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](https://github.com/features/codespaces/) (_et nettleserbasert miljø uten installasjoner nødvendig_), eller lokalt på datamaskinen din ved å bruke en tekstredigerer som [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +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](https://github.com/features/codespaces/) (_et nettleserbasert miljø uten behov for installasjoner_), eller lokalt på din datamaskin ved bruk av en tekstredigerer som [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). -#### 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. +#### Opprett ditt eget repository +For at du enkelt skal kunne lagre arbeidet ditt, anbefales det at du oppretter din egen kopi av dette repositoriet. Du kan gjøre dette ved å klikke på **Use this template** knappen øverst på siden. Dette vil opprette et nytt repository i din GitHub-konto 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` +1. **Lag en gaffel av repositoriet**: Klikk på "Fork"-knappen øverst til høyre på denne siden. +2. **Klon repositoriet**: `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. +I din kopi av dette repositoriet du opprettet, klikk på **Code**-knappen og velg **Open with Codespaces**. Dette vil opprette en ny Codespace for deg å jobbe i. ![Codespace](../../translated_images/no/createcodespace.0238bbf4d7a8d955.webp) -#### Kjøre læreplanen lokalt på datamaskinen din +#### Kjøre læreplanen lokalt på din datamaskin -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](../../1-getting-started-lessons/1-intro-to-programming-languages), vil lede deg gjennom ulike alternativer for hvert av disse verktøyene slik at du kan velge det som passer best for deg. +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](../../1-getting-started-lessons/1-intro-to-programming-languages), vil guide deg gjennom ulike 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](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) som redigeringsprogram, som også har en innebygd [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Du kan laste ned Visual Studio Code [her](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +Vår anbefaling er å bruke [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) som redigerer, som også har en innebygd [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Du kan laste ned Visual Studio Code [her](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). -1. Klon depotet ditt til datamaskinen. Du kan gjøre dette ved å klikke på **Code** knappen og kopiere URL-en: +1. Klon ditt repository til din datamaskin. Du kan gjøre dette ved å klikke på **Code**-knappen og kopiere URL-en: [CodeSpace](./images/createcodespace.png) - Åpne deretter [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) i [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) og kjør følgende kommando, og erstatt `` med URL-en du nettopp kopierte: +Deretter åpner du [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) i [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) og kjører følgende kommando, og erstatter `` med URL-en du nettopp kopierte: ```bash git clone ``` -2. Åpne mappen i Visual Studio Code. Du kan gjøre dette ved å klikke **File** > **Open Folder** og velge mappen du nettopp klonet. +2. Åpne mappen i Visual Studio Code. Du kan gjøre dette ved å klikke **Fil** > **Åpne mappe** og velge mappen du nettopp klonet. > Anbefalte Visual Studio Code-utvidelser: @@ -131,91 +132,91 @@ Vår anbefaling er å bruke [Visual Studio Code](https://code.visualstudio.com/? > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - for å forhåndsvise HTML-sider i Visual Studio Code > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - for å hjelpe deg å skrive kode raskere -## 📂 Hver leksjon inkluderer: +## 📂 Hver leksjon inneholder: -- valgfri skissetegning +- valgfri skisse - valgfri supplerende video -- forprøve før leksjonen +- oppvarmingsquiz før leksjonen - skriftlig leksjon -- for prosjektbaserte leksjoner, steg-for-steg-veiledninger om hvordan bygge prosjektet +- for prosjektbaserte leksjoner, trinnvise guider for hvordan du bygger prosjektet - kunnskapstester - en utfordring - supplerende lesing - oppgave -- [etterprøve](https://ff-quizzes.netlify.app/web/) +- [quiz etter leksjonen](https://ff-quizzes.netlify.app/web/) -> **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](https://ff-quizzes.netlify.app/web/). Quiz-appen kan kjøres lokalt eller distribueres til Azure; følg instruksjonene i `quiz-app`-mappen. +> **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](https://ff-quizzes.netlify.app/web/). quiz-appen kan kjøres lokalt eller deployeres 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](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | 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](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | Komme i gang | Tilgjengelighet | Lær det grunnleggende om tilgjengelighet på nettet | [Tilgjengelighetsgrunnlag](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS Grunnleggende | JavaScript-datatyper | Grunnleggende om JavaScript-datatyper | [Datatyper](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS Grunnleggende | Funksjoner og metoder | Lær om funksjoner og metoder for å styre applogikken | [Funksjoner og metoder](./2-js-basics/2-functions-methods/README.md) | Jasmine og Christopher | -| 06 | JS Grunnleggende | Beslutningstaking med JS | Lær hvordan du lager betingelser i koden din ved bruk av beslutningsmetoder | [Beslutningstaking](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS Grunnleggende | Arrays og løkker | Arbeid med data ved hjelp av arrays og løkker i JavaScript | [Arrays og løkker](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML i praksis | Bygg HTML for å lage et online terrarium med fokus på å bygge layout | [Introduksjon til HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | 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](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | 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](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [Typing Game](./4-typing-game/solution/README.md) | Bygg et skrive-spill | Lær hvordan du bruker tastaturhendelser til å styre logikken i JavaScript-appen | [Hendelsesdrevet programmering](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Arbeide med nettlesere | Lær hvordan nettlesere fungerer, deres historie, og hvordan skissere de første elementene i en nettleserutvidelse | [Om nettlesere](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | 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](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Bakgrunnsprosesser i nettleseren, webytelse | Bruk nettleserens bakgrunnsprosesser til å administrere utvidelsens ikon; lær om webytelse og noen optimaliseringer for å forbedre | [Bakgrunnsoppgaver og ytelse](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [Space Game](./6-space-game/solution/README.md) | 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](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [Space Game](./6-space-game/solution/README.md) | Tegning på canvas | Lær om Canvas API, brukt til å tegne elementer på skjerm | [Tegning på canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [Space Game](./6-space-game/solution/README.md) | Flytte elementer rundt på skjermen | Oppdag hvordan elementer kan få bevegelse ved bruk av kartesiske koordinater og Canvas API | [Flytte elementer rundt](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [Space Game](./6-space-game/solution/README.md) | Kollisjonsdeteksjon | Få elementer til å kollidere og reagere på hverandre ved hjelp av tastetrykk og tilby en avkjølingsfunksjon for å sikre ytelsen | [Kollisjonsdeteksjon](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [Space Game](./6-space-game/solution/README.md) | Holde poengsum | Utfør matematiske beregninger basert på spillets status og ytelse | [Holde poengsum](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [Space Game](./6-space-game/solution/README.md) | Avslutte og starte spillet på nytt | Lær om å avslutte og starte spillet på nytt, inkludert å rydde opp ressurser og tilbakestille variabelverdier | [Avslutningstilstand](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [Banking App](./7-bank-project/solution/README.md) | 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](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [Banking App](./7-bank-project/solution/README.md) | Bygge et påloggings- og registreringsskjema | Lær om bygging av skjemaer og håndtering av valideringsrutiner | [Skjemaer](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [Banking App](./7-bank-project/solution/README.md) | 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](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [Banking App](./7-bank-project/solution/README.md) | Konsepter for tilstandshåndtering | Lær hvordan appen din beholder tilstand og hvordan styre det programmessig | [Tilstandshåndtering](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Browser/VScode Code](../../8-code-editor) | Arbeide med VScode | Lær hvordan du bruker en kodeeditor| [Bruke VScode-kodeeditor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [AI Assistants](./9-chat-project/README.md) | Arbeide med AI | Lær hvordan du bygger din egen AI-assistent | [AI-assistentprosjekt](./9-chat-project/README.md) | Chris | +| | Prosjektnavn | Konsepter som læres | Læringsmål | Tilknyttet leksjon | Forfatter | +| :-: | :------------------------------------------------------: | :------------------------------------------------------------------------: | --------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :-----------------------: | +| 01 | Komme i gang | Introduksjon til programmering og verktøy for faget | 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](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | Komme i gang | Grunnleggende om GitHub, inkludert samarbeid i team | Hvordan bruke GitHub i prosjektet ditt, hvordan samarbeide med andre på en kodebase | [Introduksjon til GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | Komme i gang | Tilgjengelighet | Lær det grunnleggende om nettside-tilgjengelighet | [Tilgjengelighet Grunnleggende](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS Grunnleggende | JavaScript-datatyper | Grunnleggende om JavaScript-datatyper | [Datatyper](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS Grunnleggende | Funksjoner og metoder | Lær om funksjoner og metoder for å håndtere et applikasjons logikkflyt | [Funksjoner og Metoder](./2-js-basics/2-functions-methods/README.md) | Jasmine og Christopher | +| 06 | JS Grunnleggende | Å ta beslutninger med JS | Lær hvordan du lager betingelser i koden din ved å bruke beslutningsmetoder | [Ta beslutninger](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS Grunnleggende | Arrays og løkker | Arbeide med data ved bruk av arrays og løkker i JavaScript | [Arrays og løkker](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML i praksis | Bygg HTML for å lage et virtuelt terrarium, med fokus på å bygge en layout | [Introduksjon til HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS i praksis | Bygg CSS for å style det virtuelle terrariet, med fokus på grunnleggende CSS inkludert making siden responsiv | [Introduksjon til CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript closures, DOM-manipulering | Bygg JavaScript for å gjøre terrariet funksjonelt som et dra/slipp-grensesnitt, med fokus på closures og DOM-manipulering | [JavaScript closures, DOM-manipulering](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [Typing Game](./4-typing-game/solution/README.md) | Lag et Skrivespill | Lær hvordan du bruker tastaturhendelser for å drive logikken i JavaScript-appen din | [Hendelsesdrevet Programmering](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Arbeide med nettlesere | Lær hvordan nettlesere fungerer, deres historie, og hvordan du bygger opp de første elementene i en nettleserutvidelse | [Om nettlesere](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Lage et skjema, kalle et API og lagre variabler i lokal lagring | Bygg JavaScript-elementene til nettleserutvidelsen din for å kalle et API ved bruk av variabler lagret i lokal lagring | [APIer, skjemautfylling og lokal lagring](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Bakgrunnsprosesser i nettleseren, web-ytelse | Bruk nettleserens bakgrunnsprosesser for å administrere utvidelsens ikon; lær om web-ytelse og noen optimaliseringer for å gjøre | [Bakgrunnsoppgaver og ytelse](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [Space Game](./6-space-game/solution/README.md) | Mer avansert spillutvikling med JavaScript | Lær om arv ved å bruke både klasser og komposisjon og Pub/Sub-mønsteret, som en forberedelse til å lage et spill | [Introduksjon til avansert spillutvikling](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [Space Game](./6-space-game/solution/README.md) | Tegning til lerret | Lær om Canvas API, som brukes til å tegne elementer på skjermen | [Tegning til lerret](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [Space Game](./6-space-game/solution/README.md) | Flytte elementer rundt på skjermen | Oppdag hvordan elementer kan få bevegelse ved hjelp av kartesiske koordinater og Canvas API | [Flytte elementer rundt](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [Space Game](./6-space-game/solution/README.md) | Kollisjonsdeteksjon | La elementer kollidere og reagere på hverandre ved hjelp av tastetrykk og implementer en cooldown-funksjon for å sikre spillytelse | [Kollisjonsdeteksjon](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [Space Game](./6-space-game/solution/README.md) | Hold styr på poeng | Utfør matematiske beregninger basert på spillets status og ytelse | [Poengtelling](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [Space Game](./6-space-game/solution/README.md) | Avslutte og starte spillet på nytt | Lær om å avslutte og restarte spillet, inkludert å rydde opp ressurser og tilbakestille variabelverdier | [Avslutningsbetingelsen](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [Banking App](./7-bank-project/solution/README.md) | HTML-maler og ruter i et webapp | Lær hvordan du lager grunnstrukturen til en flersidig nettsides arkitektur ved bruk av routing og HTML-maler | [HTML-maler og ruter](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [Banking App](./7-bank-project/solution/README.md) | Lag en innloggings- og registreringsskjema | Lær om å lage skjemaer og håndtere valideringsrutiner | [Skjemaer](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [Banking App](./7-bank-project/solution/README.md) | Metoder for å hente og bruke data | Hvordan data flyter inn og ut av appen din, hvordan hente det, lagre det, og kvitte seg med det | [Data](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [Banking App](./7-bank-project/solution/README.md) | Begreper om tilstandsadministrasjon | Lær hvordan appen din beholder tilstand og hvordan du kan styre den programmessig | [Tilstandsadministrasjon](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [Browser/VScode Code](../../8-code-editor) | Arbeider med VScode | Lær hvordan du bruker en kode-editor| [Bruk VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [AI Assistants](./9-chat-project/README.md) | Arbeider med AI | Lær hvordan du bygger din egen AI-assistent | [AI Assistent prosjekt](./9-chat-project/README.md) | Chris | ## 🏫 Pedagogikk -Vårt pensum er utformet med to viktige pedagogiske prinsipper i tankene: +Vårt pensum er designet med to viktige pedagogiske prinsipper i tankene: * prosjektbasert læring -* hyppige prøver +* hyppige quizer -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. +Programmet lærer grunnleggende JavaScript, HTML og CSS, samt de nyeste verktøyene og teknikkene som dagens webutviklere bruker. Studentene vil få muligheten til å utvikle praktisk erfaring ved å bygge et skrivespill, virtuelt terrarium, miljøvennlig nettleserutvidelse, rom-invader-stil 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](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) 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](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)"-samlingen av videotutorialer, hvor noen av forfatterne bidro til dette pensumet. +Ved å sikre at innholdet stemmer overens med prosjektene, gjøres prosessen mer engasjerende for studentene og lagring av konsepter vil bli forbedret. Vi skrev også flere startleksjoner i JavaScript-grunnleggende for å introdusere konsepter, koblet med en video fra "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" samlingen av videotutorials, 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. +I tillegg setter en lavterskelquiz før en time intensjonen til studenten om å lære et tema, mens en andre quiz etter timen sikrer ytterligere lagring. Dette pensumet er designet for å være fleksibelt og morsomt og kan tas i sin helhet eller delvis. Prosjektene starter smått og blir stadig mer komplekse innen 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](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". +Selv om vi med vilje har unngått å introdusere JavaScript-rammeverk for å fokusere på grunnleggende ferdigheter som trengs som webutvikler før man tar i bruk et rammeverk, vil et godt neste steg etter å ha fullført dette pensumet være å lære om Node.js via en annen samling videoer: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". -> Besøk våre retningslinjer for [oppførselskode](CODE_OF_CONDUCT.md) og [bidrag](CONTRIBUTING.md). Vi ønsker din konstruktive tilbakemelding velkommen! +> Besøk våre retningslinjer for [Atferdskodeks](CODE_OF_CONDUCT.md) og [Bidra](CONTRIBUTING.md). Vi ønsker din konstruktive tilbakemelding velkommen! -## 🧭 Offline tilgang +## 🧭 Offline-tilgang -Du kan kjøre denne dokumentasjonen offline ved å bruke [Docsify](https://docsify.js.org/#/). Fork dette repoet, [installer Docsify](https://docsify.js.org/#/quickstart) 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`. +Du kan kjøre denne dokumentasjonen offline ved å bruke [Docsify](https://docsify.js.org/#/). Fork dette repoet, [installer Docsify](https://docsify.js.org/#/quickstart) på din lokale maskin, og deretter i rotmappen til dette repoet, skriv `docsify serve`. Nettstedet vil serveres på port 3000 på din localhost: `localhost:3000`. ## 📘 PDF -En PDF med alle leksjonene kan finnes [her](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). +En PDF av alle leksjonene kan finnes [her](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). -## 🎒 Andre kurs +## 🎒 Andre Kurs Teamet vårt produserer andre kurs! Sjekk ut: ### LangChain [![LangChain4j for Beginners](https://img.shields.io/badge/LangChain4j%20for%20Beginners-22C55E?style=for-the-badge&&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchain4j-for-beginners) [![LangChain.js for Beginners](https://img.shields.io/badge/LangChain.js%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin) - +[![LangChain for Beginners](https://img.shields.io/badge/LangChain%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=0553D6)](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin) --- -### Azure / Edge / MCP / Agents +### Azure / Edge / MCP / Agenter [![AZD for Beginners](https://img.shields.io/badge/AZD%20for%20Beginners-0078D4?style=for-the-badge&labelColor=E5E7EB&color=0078D4)](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst) [![Edge AI for Beginners](https://img.shields.io/badge/Edge%20AI%20for%20Beginners-00B8E4?style=for-the-badge&labelColor=E5E7EB&color=00B8E4)](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst) [![MCP for Beginners](https://img.shields.io/badge/MCP%20for%20Beginners-009688?style=for-the-badge&labelColor=E5E7EB&color=009688)](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst) @@ -223,7 +224,7 @@ Teamet vårt produserer andre kurs! Sjekk ut: --- -### Generative AI Series +### Generativ AI-serie [![Generative AI for Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Generative AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) [![Generative AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) @@ -231,7 +232,7 @@ Teamet vårt produserer andre kurs! Sjekk ut: --- -### Core Learning +### Kjerneopplæring [![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) @@ -242,7 +243,7 @@ Teamet vårt produserer andre kurs! Sjekk ut: --- -### Copilot Series +### Copilot-serie [![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) @@ -250,11 +251,11 @@ Teamet vårt produserer andre kurs! Sjekk ut: ## 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. +Hvis du sitter fast eller har noen 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](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -Hvis du har produktfeedback eller feil under bygging, besøk: +Hvis du har produktfeedback eller finner feil mens du bygger, besøk: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) @@ -266,5 +267,5 @@ Dette depotet er lisensiert under MIT-lisensen. Se [LICENSE](../../LICENSE)-file **Ansvarsfraskrivelse**: -Dette dokumentet er oversatt ved hjelp av AI-oversettelsestjenesten [Co-op Translator](https://github.com/Azure/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. +Dette dokumentet er oversatt ved bruk av AI-oversettelsestjenesten [Co-op Translator](https://github.com/Azure/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 originale dokumentet på dets opprinnelige språk skal betraktes som den autoritative kilden. For kritisk informasjon anbefales profesjonell menneskelig oversettelse. Vi er ikke ansvarlige for eventuelle misforståelser eller feiltolkninger som oppstår ved bruk av denne oversettelsen. \ No newline at end of file diff --git a/translations/no/Roadmap.md b/translations/no/Roadmap.md new file mode 100644 index 000000000..155111742 --- /dev/null +++ b/translations/no/Roadmap.md @@ -0,0 +1,53 @@ +# Veikart for Microsofts Web-Dev-For-Beginners Repository + +**Dette depotet gir et veikart for å lære grunnleggende webutvikling med fokus på JavaScript, HTML og CSS. Pensumet er fleksibelt og kan tas i sin helhet eller delvis, med 24 leksjoner fordelt på 12 uker.** + +## Viktige milepæler + +* **Uker 1-3:** + * Introduksjon til programmeringsspråk og verktøy for faget + * Grunnleggende om GitHub + * Tilgjengelighet + * JS grunnleggende: datatyper, funksjoner og metoder + * Å ta beslutninger med JS +* **Uker 4-6:** + * Arrayer og løkker + * Terrarium: HTML i praksis + * CSS i praksis + * JavaScript closures + * DOM-manipulering +* **Uker 7-9:** + * Typing Game: Hendelsesdrevet programmering + * Green Browser Extension: Arbeide med nettlesere + * Lage et skjema, kalle et API og lagre variabler i lokal lagring + * Bakgrunnsprosesser i nettleseren + * Nettleserytelse +* **Uker 10-12:** + * Space Game: Mer avansert spillutvikling med JavaScript + * Tegning på canvas + * Flytte elementer rundt på skjermen + * Kollisjonsdeteksjon + * Holde poengsum, avslutte og starte spillet på nytt + * Banking App: HTML-maler og ruter i en webapp + * Lage innloggings- og registreringsskjema + * Metoder for å hente og bruke data + * Konsepter innen tilstandsbehandling + +## Læringsutbytte + +**Ved å fullføre dette veikartet vil studentene få praktisk erfaring med å bygge et typing-spill, virtuelt terrarium, miljøvennlig nettleserutvidelse, space-invader-stil spill og en bankapp for bedrifter. De vil også utvikle en solid forståelse av grunnleggende webutvikling.** + +## Ekstra ressurser + +* Dette depotet tilbyr et vell av ressurser for videre læring, inkludert opplæringsmateriell, kodeeksempler og utfordringer. +* Microsoft Learn-plattformen tilbyr en rekke kurs og læringsstier innen webutvikling. +* Nettmiljøer som Stack Overflow og MDN Web Docs gir verdifull støtte og ressurser til webutviklere. + +**Jeg håper dette veikartet hjelper deg på din webutviklingsreise!** + +--- + + +**Ansvarsfraskrivelse**: +Dette dokumentet er oversatt ved hjelp av AI-oversettelsestjenesten [Co-op Translator](https://github.com/Azure/co-op-translator). Selv om vi streber etter nøyaktighet, vennligst vær oppmerksom på at automatiserte oversettelser kan inneholde feil eller unøyaktigheter. Det originale dokumentet på dets opprinnelige språk bør anses som den autoritative kilden. For kritisk informasjon anbefales profesjonell menneskelig oversettelse. Vi påtar oss ikke ansvar for misforståelser eller feiltolkninger som oppstår ved bruk av denne oversettelsen. + \ No newline at end of file