msb-public
/
Web-Dev-For-Beginners
mirror of https://github.com/microsoft/Web-Dev-For-Beginners.git
1
0
Code Issues Projects Releases Wiki Activity

chore(i18n): sync translations with latest source changes (chunk 1/1, 6 changes)

Browse Source
pull/1690/head
localizeflow[bot] 3 weeks ago
parent aad7d1fd52
commit 8097450416
6 changed files with 439 additions and 438 deletions
Show Stats Download Patch File Download Diff File

2
translations/fi/.co-op-translator.json
Unescape View File

@ -493,7 +493,7 @@
},
"AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-02-06T09:08:06+00:00",
"translation_date": "2026-02-06T11:38:37+00:00",
"source_file": "AGENTS.md",
"language_code": "fi"
},

309
translations/fi/AGENTS.md
Unescape View File

@ -1,37 +1,37 @@
# AGENTS.md
## Projektin yleiskuvaus
## Projektin yleiskatsaus
Tämä on opetussisältöjen arkisto, joka on tarkoitettu web-kehityksen perusteiden opettamiseen aloittelijoille. Opetussuunnitelma on kattava 12 viikon kurssi, jonka ovat kehittäneet Microsoft Cloud Advocates -tiimi, ja se sisältää 24 käytännön oppituntia käsitellen JavaScriptiä, CSS:ää ja HTML:ää.
Tämä on opetusohjelmakokoelma verkkokehityksen perusteiden opettamiseen aloittelijoille. Opetusohjelma on kattava 12 viikon kurssi, jonka on kehittänyt Microsoft Cloud Advocates, ja se sisältää 24 käytännönläheistä oppituntia, jotka kattavat JavaScriptin, CSS:n ja HTML:n.
### Keskeiset osat
- **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 visailut**: 48 visaa, joissa jokaisessa 3 kysymystä (ennakoivat/jälkeiset arvioinnit)
- **Monikielinen tuki**: Automaattiset käännökset yli 50 kielelle GitHub Actionsin kautta
- **Käytännön projektit**: Terrarium, Typing Game, Selainlaajennus, Space Game, Pankkisovellus, Koodieditori ja AI Chat Assistant
- **Interaktiiviset tietovisat**: 48 tietovisaa, joissa kussakin 3 kysymystä (ennen ja jälkeen oppitunnin arvioinnit)
- **Monikielinen tuki**: Automaattiset käännökset yli 50 kielelle GitHub Actionsilla
- **Teknologiat**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI-projekteihin)
### Arkkitehtuuri
- Opetussisältöihin perustuva arkisto oppituntirakenteella
- Opetusrepo oppituntirakenteella
- Jokaisessa oppituntikansiossa README, koodiesimerkit ja ratkaisut
- Erilliset projektit omissa hakemistoissaan (quiz-app, erilaiset oppimisprojektit)
- Käännösjärjestelmä GitHub Actionsin avulla (co-op-translator)
- Dokumentaatio tarjolla Docsifyn kautta ja PDF-muodossa
- Itsenäiset projektit omissa hakemistoissaan (quiz-app, eri oppituntiprojektit)
- Käännösjärjestelmä GitHub Actionsia käyttäen (co-op-translator)
- Dokumentaatio Docsifyllä ja PDF-muodossa saatavana
## Asennuskomennot
Tätä arkistoa käytetään pääasiassa opetussisällön kuluttamiseen. Työskenneltäessä tiettyjen projektien parissa:
Tämä repo on pääasiassa opetussisällön kulutukseen. Työskennellessäsi tiettyjen projektien parissa:
### Pääarkiston asennus
### Päänäilon asetukset
```bash
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
```
### Quiz Appin asennus (Vue 3 + Vite)
### Quiz-sovelluksen asennus (Vue 3 + Vite)
```bash
cd quiz-app
@ -51,12 +51,12 @@ npm run lint # Suorita ESLint
npm run format # Muotoile Prettierillä
```
### Selaimen laajennusprojektit
### Selainlaajennusprojektit
```bash
cd 5-browser-extension/solution
npm install
# Noudata selaimen erityisiä laajennuksen latausohjeita
# Noudata selainkohtaisia lisäosien latausohjeita
```
### Space Game -projektit
@ -67,7 +67,7 @@ npm install
# Avaa index.html selaimessa tai käytä Live Serveriä
```
### Chat-projekti (Python Backend)
### Chat-projekti (Python-palvelin)
```bash
cd 9-chat-project/solution/backend/python
@ -76,207 +76,208 @@ pip install openai
python api.py
```
## Kehitysprosessi
## Kehitystyön kulku
### Sisällöntuottajille
1. **Tee oma fork** arkistosta GitHub-tilillesi
2. **Kloonaa fork paikallisesti**
1. **Haarauta repositorio** GitHub-tilillesi
2. **Kloonaa haarasi** paikallisesti
3. **Luo uusi haara** muutoksillesi
4. Tee muutoksia oppituntisisältöön tai koodiesimerkkeihin
5. Testaa tekemäsi koodimuutokset asianmukaisissa projektihakemistoissa
6. Lähetä pull requesteja noudattaen kontribuutiokäytäntöjä
5. Testaa koodimuutoksia asianmukaisissa projektikansioissa
6. Lähetä pull requesteja seuraamalla ohjeita
### Oppijoille
1. Tee fork tai kloonaa arkisto
1. Haarauta tai kloonaa repo
2. Siirry oppituntikansioihin peräkkäin
3. Lue jokaisen oppitunnin README-tiedostot
4. Suorita ennakkovisailut osoitteessa https://ff-quizzes.netlify.app/web/
4. Tee oppituntien esikyselyt osoitteessa https://ff-quizzes.netlify.app/web/
5. Työstä koodiesimerkkejä oppituntikansioissa
6. Suorita tehtävät ja haasteet
7. Osallistu jälkeisiin visoihin
7. Tee oppituntien jälkikyselyt
### Live-kehitys
- **Dokumentaatio**: Käynnistä `docsify serve` juurikansiossa (portti 3000)
- **Quiz App**: Käynnistä `npm run dev` quiz-app-hakemistossa
- **Projektit**: Käytä VS Code Live Server -laajennusta HTML-projekteille
- **API-projektit**: Käynnistä `npm start` vastaavissa API-hakemistoissa
- **Dokumentaatio**: Suorita `docsify serve` juurikansiossa (portti 3000)
- **Quiz-sovellus**: Suorita `npm run dev` quiz-app-kansiossa
- **Projektit**: Käytä VS Coden Live Server -laajennusta HTML-projekteissa
- **API-projektit**: Suorita `npm start` vastaavissa API-kansioissa
## Testausohjeet
### Quiz Appin testaus
### Quiz-sovelluksen testaus
```bash
cd quiz-app
npm run lint # Tarkista koodityylivirheet
npm run build # Varmista, että käännös onnistuu
npm run build # Varmista, että kokoaminen onnistuu
```
### Bank API:n testaus
### Pankin API-testauksen ohjeet
```bash
cd 7-bank-project/api
npm run lint # Tarkista koodityyliongelmat
npm run lint # Tarkista koodityylin ongelmat
node server.js # Varmista, että palvelin käynnistyy ilman virheitä
```
### Yleinen testauslähestymistapa
### Yleinen testausmenetelmä
- Tämä on opetussisältöarkisto ilman kattavia automatisoituja testejä
- Manuaalinen testaus keskittyy:
- Tämä on opetusrepo ilman kattavia automaattisia testejä
- Käsin tehtävä testaus keskittyy:
- Koodiesimerkkien virheettömään suoritukseen
- Dokumentaation linkkien toimivuuteen
- Projektien onnistuneeseen kääntämiseen
- Esimerkkien oikeellisuuteen ja käytäntöjen noudattamiseen
- Projektien onnistuneeseen käännökseen
- Esimerkkien parhaiden käytäntöjen noudattamiseen
### Tarkistukset ennen lähettämistä
### Esittäminen ennen tarkistusta
- Suorita `npm run lint` hakemistoissa, joissa on package.json
- Suorita `npm run lint` kansioissa, joissa on package.json
- Varmista markdown-linkkien toimivuus
- 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 rakenteensa
## Koodityyliohjeet
### JavaScript
- Käytä modernia ES6+-syntaksia
- Noudata projektien ESLint-konfiguraatioita
- Käytä merkityksellisiä muuttuja- ja funktioiden nimiä opetuksellisuuden vuoksi
- Lisää kommentteja oppijan havainnollistamiseksi
- Muotoile Prettierillä, jos se on määritetty
- Käytä modernia ES6+ syntaksia
- Noudata projektien mukana tulevia ESLint-asetuksia
- Käytä merkityksellisiä muuttuja- ja funktioiden nimiä opetusmukavuuden parantamiseksi
- Lisää kommentteja käsitteiden selittämiseksi oppijoille
- Muotoile Prettierillä, jos konfiguroitu
### HTML/CSS
- Semanttiset HTML5-elementit
- Responsiivisen suunnittelun periaatteet
- Selkeät luokkien nimikäytännöt
- Kommentit CSS-tekniikoiden selittämiseen oppijoille
- Selkeät luokkanimikkeet
- Kommentit CSS-tekniikoiden selittämiseksi oppijoille
### Python
- PEP 8 -tyylistandardit
- PEP 8 -tyyliohjeet
- Selkeät, opetukselliset koodiesimerkit
- Tyyppivihjeet oppimisen tukemiseksi
- Tyyppivihjeet oppimista tukemaan
### Markdown-dokumentaatio
- Selkeä otsikkohierarkia
- Koodilohkot kielimäärittelyllä
- Selkeä otsikkorakenne
- Koodilohkot kielimääritteellä
- Linkit lisäresursseihin
- Kuvankaappauksia ja kuvia `images/`-hakemistoissa
- Kuvien alt-tekstit saavutettavuuden vuoksi
- Kuvakaappaukset ja kuvat `images/`-kansioissa
- Kuvien tekstit saavutettavuuden vuoksi
### Tiedostojen järjestely
### Tiedostojen järjestäminen
- Oppitunnit numeroitu peräkkäin (1-getting-started-lessons, 2-js-basics jne.)
- Jokaisella projektilla on `solution/` ja usein myös `start/` tai `your-work/`-hakemistot
- Kuvat tallennettuna oppituntikohtaisiin `images/`-kansioihin
- Käännökset `translations/{language-code}/` -rakenteessa
- Oppitunnit numeroin sequentialisesti (1-getting-started-lessons, 2-js-basics jne.)
- Jokaisella projektilla on `solution/` ja usein `start/` tai `your-work/` kansiot
- Kuvat säilytetään oppituntikohtaisissa `images/`-kansioissa
- Käännökset `translations/{language-code}/` rakenteessa
## Kääntäminen ja julkaisu
## Käännös ja julkaisuprosessi
### Quiz Appin julkaisu (Azure Static Web Apps)
### Quiz-sovelluksen julkaisuprosessi (Azure Static Web Apps)
Quiz-app on konfiguroitu Azure Static Web Apps -julkaisua varten:
```bash
cd quiz-app
npm run build # Luo dist/ kansion
# Julkaisee GitHub Actions -työnkulun kautta, kun tehdään push mainiin
npm run build # Luo dist/-kansion
# Julkaisee GitHub Actions -työnkulun kautta, kun main-haaraan tehdään pushaus
```
Azure Static Web Apps -konfiguraatio:
- **Sovelluksen sijainti**: `/quiz-app`
- **Tulostuskansio**: `dist`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
- **Työnkulku**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Dokumentaation PDF-luonti
### Dokumentaation PDF-generointi
```bash
npm install # Asenna docsify-to-pdf
npm run convert # Luo PDF dokumentaatiosta
npm run convert # Luo PDF docsista
```
### Docsify-dokumentaatio
```bash
npm install -g docsify-cli # Asenna Docsify globaalisti
docsify serve # Palvele paikallisessa isännässä portissa 3000
docsify serve # Palvele osoitteessa localhost:3000
```
### Projektikohtaiset käännökset
Jokaisella projektihakemistolla voi olla oma build-prosessinsa:
- Vue-projekteilla: `npm run build` luo tuotantopakettit
- Staattisilla projekteilla: Ei erillistä käännöstä, tarjoillaan tiedostot suoraan
Jokaisessa projektihakemistossa voi olla oma käännösprosessi:
- Vue-projekteissa: `npm run build` tuottaa tuotantopaketteja
- Staattisissa projekteissa: Ei käännösvaihetta, tarjoillaan tiedostot suoraan
## Pull request -ohjeet
### Otsikkomuoto
Käytä selkeitä ja kuvaavia otsikoita, jotka osoittavat muutoksen kohteen:
- `[Quiz-app] Lisää uusi visa oppitunnille X`
Käytä selkeitä, kuvailevia otsikoita ilmoittaen muutoksen alue:
- `[Quiz-app] Lisää uusi tietovisa oppitunnille X`
- `[Lesson-3] Korjaa kirjoitusvirhe terrarium-projektissa`
- `[Translation] Lisää espanjan käännös oppitunnille 5`
- `[Translation] Lisää espanjankielinen käännös oppitunnille 5`
- `[Docs] Päivitä asennusohjeet`
### Pakolliset tarkistukset
### Vaatimukset tarkistuksille
Ennen PR:n lähettämistä:
1. **Koodin laatu**:
- Suorita `npm run lint` vaikuttavissa projektihakemistoissa
- Korjaa kaikki lint-virheet ja varoitukset
- Suorita `npm run lint` vaikuttavissa projektikansioissa
- Korjaa kaikki lint-virheet ja -varoitukset
2. **Käännösten varmistus**:
2. **Käännöksen varmentaminen**:
- Suorita `npm run build` tarvittaessa
- Varmista ettei käännösvirheitä esiinny
- Varmista, ettei käännöksessä ole virheitä
3. **Linkkien tarkistus**:
3. **Linkkien tarkastus**:
- Testaa kaikki markdown-linkit
- Varmista kuvaviittausten toimivuus
- Varmista, että kuvat toimivat
4. **Sisällön tarkastus**:
4. **Sisältöarviointi**:
- Tarkista oikeinkirjoitus ja kielioppi
- Varmista koodiesimerkkien oikeellisuus ja opetuksellisuus
- Tarkista käännösten pysyvyys alkuperäisessä merkityksessä
- Varmista koodiesimerkkien oikeellisuus ja opettavuus
- Tarkista käännösten säilyttäneen alkuperäisen merkityksen
### Kontribuution vaatimukset
### Osallistumisvaatimukset
- Hyväksy Microsoft CLA (automaattinen tarkistus ensimmäisessä PR:ssä)
- Noudata [Microsoft Open Source Code of Conductia](https://opensource.microsoft.com/codeofconduct/)
- Katso [CONTRIBUTING.md](./CONTRIBUTING.md) yksityiskohtaiset ohjeet
- Viittaa issue-numeroihin PR-kuvauksessa, jos mahdollista
- Hyväksy Microsoftin CLA (automaattinen tarkastus ensimmäisellä PR:llä)
- Noudata [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) -käyttäytymissääntöä
- Katso yksityiskohdat [CONTRIBUTING.md](./CONTRIBUTING.md) -tiedostosta
- Viittaa issue-numeroihin PR-kuvauksessa tarvittaessa
### Tarkastusprosessi
- PR:t tarkastetaan ylläpitäjien ja yhteisön toimesta
- Opetuksellisen selkeyden korostaminen
- Koodiesimerkkien noudattavan parhaimpia käytäntöjä
- Käännökset arvioidaan tarkkuuden ja kulttuurisen sopivuuden perusteella
- PR:t tarkistetaan ylläpitäjien ja yhteisön toimesta
- Opetuksellinen selkeys on etusijalla
- Koodiesimerkkien tulee noudattaa parhaita käytäntöjä
- Käännökset tarkistetaan tarkkuuden ja kulttuurin sopivuuden osalta
## Käännösjärjestelmä
### Automaattinen käännös
- Käyttää GitHub Actionsin co-op-translator workflow’ta
- Kääntää yli 50 kielelle automaattisesti
- Käyttää GitHub Actionsia ja co-op-translator-työnkulkua
- Kääntää automaattisesti yli 50 kielelle
- Lähdetiedostot pääkansioissa
- Käännetyt tiedostot `translations/{language-code}/` -hakemistoissa
- Käännetyt tiedostot `translations/{language-code}/` hakemistoissa
### Manuaalisten käännösten parannukset
1. Etsi tiedosto `translations/{language-code}/` -hakemistosta
2. Tee parannuksia säilyttäen rakenne
1. Etsi tiedosto `translations/{language-code}/` kansiosta
2. Tee parannukset säilyttäen rakenne
3. Varmista, että koodiesimerkit toimivat edelleen
4. Testaa paikallistetut visasisällöt
4. Testaa mahdollinen paikallinen tietovisa sisältö
### Käännösten metadata
### Käännöksen metatiedot
Käännetyt tiedostot sisältävät metatietopään:
Käännetyissä tiedostoissa on metadataotsikko:
```markdown
<!--
CO_OP_TRANSLATOR_METADATA:
@ -289,120 +290,120 @@ CO_OP_TRANSLATOR_METADATA:
-->
```
## Virheenkorjaus ja ongelmanratkaisu
## Virheenkorjaus ja vianratkaisu
### Yleiset ongelmat
**Quiz app ei käynnisty**:
- Tarkista Node.js:n versio (v14+ suositeltu)
**Quiz-sovellus ei käynnisty**:
- Tarkista Node.js-versio (v14+ suositeltu)
- Poista `node_modules` ja `package-lock.json`, suorita `npm install` uudelleen
- Tarkista porttikonfliktit (Vite käyttää oletuksena porttia 5173)
- Tarkista porttien ristiriidat (oletus: Vite käyttää porttia 5173)
**API-palvelin ei käynnisty**:
- Varmista, että Node.js-versio on vähintään 10
- Varmista Node.js-version vaatimukset (node >=10)
- Tarkista, onko portti jo käytössä
- Varmista, että kaikki riippuvuudet on asennettu `npm install` -komennolla
- Varmista, että kaikki riippuvuudet on asennettu komennolla `npm install`
**Selaimen laajennusta ei ladata**:
- Varmista, että manifest.json on oikein muotoiltu
- Tarkista selaimen konsoli virheiden varalta
- Seuraa selaimen laajennuksen asennusohjeita
**Selainlaajennus ei lataudu**:
- Tarkista manifest.json on oikein muotoiltu
- Tarkista selaimen konsolin virheet
- Noudata selaimeen liittyviä laajennuksen asennusohjeita
**Python-chat-projektin ongelmat**:
- Varmista OpenAI-paketin asennus: `pip install openai`
- Tarkista, että GITHUB_TOKEN-ympäristömuuttuja on asetettu
- Varmista, että OpenAI-paketti on asennettu: `pip install openai`
- Tarkista GITHUB_TOKEN-ympäristömuuttujan asetus
- Tarkista GitHub Models -käyttöoikeudet
**Docsify ei palvele dokumentaatiota**:
- Asenna docsify-cli globaalisti: `npm install -g docsify-cli`
- Käynnistä arkiston juuresta
**Docsify ei tarjoa dokumentaatiota**:
- Asenna docsify-cli globaaliin käyttöön: `npm install -g docsify-cli`
- Suorita repovaraston juuresta
- Tarkista, että `docs/_sidebar.md` on olemassa
### Kehitysympäristön vinkkejä
### Kehitysympäristön vinkit
- Käytä VS Codea Live Server -laajennuksella HTML-projekteille
- Asenna ESLint ja Prettier yhdenmukaista muotoilua varten
- Käytä VS Codea Live Server -laajennuksella HTML-projekteissa
- Asenna ESLint ja Prettier -laajennukset yhtenäiseen muotoiluun
- Käytä selaimen DevToolsia JavaScriptin virheenkorjaukseen
- Vue-projekteissa asenna Vue DevTools -selaimen lisäosa
- Vue-projekteille asenna Vue DevTools -laajennus selaimeen
### Suorituskyvyn huomioita
- Suuri määrä käännettyjä tiedostoja (50+) tekee koko kloonauksesta raskaan
- Käytä matalaa kloonausta sisällön muokkaamiseen: `git clone --depth 1`
- Poista käännökset haun kohteista työskennellessäsi englanninkielisen sisällön kanssa
- Käännösprosessit voivat olla hitaita ensimmäisellä suorituksella (npm install, Vite build)
- Suuri määrä käännettyjä tiedostoja (50+ kieliä) tekee täydellisestä kloonista raskaan
- Käytä kevyttä kloonausta, jos työskentelet vain sisällön parissa: `git clone --depth 1`
- Sulje käännökset hausta pois työskentelyssä englannin kanssa
- Käännösprosessit voivat olla hitaita ensimmäisellä ajolla (npm install, Vite build)
## Turvallisuusnäkökulmat
## Turvallisuusohjeet
### Ympäristömuuttujat
- API-avaimia ei tule koskaan sitoa arkistoon
- Käytä `.env`-tiedostoja (jo sisältyy `.gitignoreen`)
- Dokumentoi tarvittavat ympäristömuuttujat projektin README-tiedostoissa
- API-avaimia ei koskaan saa sitoa repositorioon
- Käytä `.env`-tiedostoja (jo .gitignore:ssa)
- Dokumentoi tarvittavat ympäristömuuttujat projektin README-tiedostoihin
### Python-projektit
- Käytä virtuaaliympäristöjä: `python -m venv venv`
- Pidä riippuvuudet ajan tasalla
- GitHub-tunnuksilla tulee olla vain tarvittavat oikeudet
- GitHub-tokenien tulee olla mahdollisimman rajatuin oikeuksin
### GitHub Models -käyttö
### GitHub Models -käyttöoikeudet
- Henkilökohtaiset access tokenit (PAT) vaaditaan GitHub Models -käyttöön
- Tokenit tulee tallentaa ympäristömuuttujiin
- Älä koskaan lähetä tokeneita tai tunnisteita arkistoon
- Henkilökohtaiset Access Tokenit (PAT) vaaditaan GitHub Models -käyttöön
- Tokenit säilytettävä ympäristömuuttujina
- Älä koskaan sitoudu tokenia tai tunnistetietoja repositorioon
## Lisähuomiot
## Lisätiedot
### Kohdeyleisö
- Täysin web-kehityksen aloittelijat
- Täysin aloittelijat verkkokehityksessä
- Opiskelijat ja itseopiskelijat
- Opettajat, jotka käyttävät opetussuunnitelmaa luokkahuoneissa
- Sisältö on suunniteltu saavutettavaksi ja taidot rakentavaksi
- Opettajat, jotka käyttävät opetussuunnitelmaa luokissa
- Sisältö on suunniteltu saavutettavaksi ja taitojen asteittaiseksi kehittämiseksi
### Opetuksellinen filosofia
- Projektipohjainen oppiminen
- Säännölliset tietojen tarkastukset (visat)
- Käytännön koodausharjoitukset
- Todelliset sovellus-esimerkit
- Painotus perusteissa ennen frameworkkeja
- Projektiin perustuva oppiminen
- Usein toteutettavat tietovisat
- Käytännön koodiharjoitukset
- Todellisten sovellusesimerkkien käyttö
- Painotus perusteissa ennen kehysten käyttöä
### Arkiston ylläpito
### Kokoelman ylläpito
- Aktiivinen yhteisö oppijoita ja kontribuoijia
- Säännölliset päivitykset riippuvuuksiin ja sisältöön
- Issueiden ja keskustelujen valvonta ylläpitäjien toimesta
- Aktiivinen oppijoiden ja osallistujien yhteisö
- Riippuvuuksien ja sisällön säännöllinen päivitys
- Issues ja keskustelut ylläpitäjien valvonnassa
- Käännösten päivitykset automatisoitu GitHub Actionsilla
### Liittyvät resurssit
### Aiheeseen liittyvät resurssit
- [Microsoft Learn -moduulit](https://docs.microsoft.com/learn/)
- [Student Hub -resurssit](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) suositellaan oppijoille
- Lisäkurssit: Generatiivinen AI, Data Science, ML, IoT opetussuunnitelmat saatavilla
- Lisää kursseja: Generatiivinen AI, Data Science, ML, IoT-kurssit saatavilla
### Työskentely tietyissä projekteissa
### Työskentely erityisten projektien parissa
Yksityiskohtaiset ohjeet löytyvät projektien README-tiedostoista:
- `quiz-app/README.md` - Vue 3 visasovellus
Yksityiskohtaiset ohjeet yksittäisiin projekteihin löytyvät README-tiedostoista:
- `quiz-app/README.md` - Vue 3 -tietovisasovellus
- `7-bank-project/README.md` - Pankkisovellus autentikoinnilla
- `5-browser-extension/README.md` - Selaimen laajennuskehitys
- `5-browser-extension/README.md` - Selainlaajennuskehitys
- `6-space-game/README.md` - Canvas-pohjainen peli
- `9-chat-project/README.md` - AI-chat-avustajan projekti
- `9-chat-project/README.md` - AI chat assistant -projekti
### Monorepo-rakenne
Tämä ei ole perinteinen monorepo, mutta sisältää useita itsenäisiä projekteja:
Vaikka tämä ei ole perinteinen monorepo, se sisältää useita itsenäisiä projekteja:
- Jokainen oppitunti on itsenäinen kokonaisuus
- Projektit eivät jaa riippuvuuksia
- Työskentele yksittäisten projektien parissa vaikuttamatta muihin
- Kloonaa koko arkisto saadaksesi täydellisen opetussuunnitelman kokemuksen
- Työskentele yksittäisten projektien kanssa vaikuttamatta muihin
- Kloonaa koko repo saadaksesi täydellisen opetusohjelman kokemuksen
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Vastuuvapauslauseke**:
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). Pyrimme tarkkuuteen, mutta ota huomioon, että automaattikäännöksissä saattaa esiintyä virheitä tai epätarkkuuksia. Alkuperäinen asiakirja omalla kielellään on virallinen lähde. Tärkeissä asioissa suosittelemme ammattimaista ihmiskäännöstä. Emme ole vastuussa mahdollisista väärinymmärryksistä tai virhetulkinnoista, jotka johtuvat tämän käännöksen käytöstä.
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, otathan huomioon, että automaattikäännöksissä voi esiintyä virheitä tai epätarkkuuksia. Alkuperäinen asiakirja sen alkuperäiskielellä on aina virallinen lähde. Tärkeiden tietojen osalta suositellaan ammattilaisen tekemää ihmiskäännöstä. Emme ole vastuussa mahdollisista väärinymmärryksistä tai virhetulkintojen seurauksista, jotka johtuvat tästä käännöksestä.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

2
translations/nl/.co-op-translator.json
Unescape View File

@ -493,7 +493,7 @@
},
"AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-02-06T09:09:14+00:00",
"translation_date": "2026-02-06T11:39:37+00:00",
"source_file": "AGENTS.md",
"language_code": "nl"
},

286
translations/nl/AGENTS.md
Unescape View File

@ -2,13 +2,13 @@
## Projectoverzicht
Dit is een educatief curriculumrepository voor het onderwijzen van webontwikkelingsbasisprincipes aan beginners. Het curriculum is een uitgebreide cursus van 12 weken ontwikkeld door Microsoft Cloud Advocates, met 24 praktische lessen over JavaScript, CSS en HTML.
Dit is een educatieve curriculumrepository voor het onderwijzen van webontwikkeling fundamentals aan beginners. Het curriculum is een uitgebreide 12-weekse cursus ontwikkeld door Microsoft Cloud Advocates, met 24 praktische lessen over JavaScript, CSS en HTML.
### Belangrijkste Onderdelen
### Belangrijke Onderdelen
- **Educatieve Inhoud**: 24 gestructureerde lessen georganiseerd in projectgebaseerde modules
- **Praktische Projecten**: Terrarium, Typvaardigheidspel, Browserextensie, Ruimtespel, Bankapp, Code-editor en AI-chatassistent
- **Interactieve Quizzen**: 48 quizzen met elk 3 vragen (voor- en na-les beoordelingen)
- **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 (voor- en na-les assessments)
- **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)
@ -16,13 +16,13 @@ Dit is een educatief curriculumrepository voor het onderwijzen van webontwikkeli
- Educatieve repository met lesgebaseerde structuur
- Elke lesmap bevat README, codevoorbeelden en oplossingen
- Op zichzelf staande projecten in aparte mappen (quiz-app, diverse lesprojecten)
- Vertalingssysteem via GitHub Actions (co-op-translator)
- Losstaande projecten in aparte directories (quiz-app, diverse lesprojecten)
- Vertalingssysteem met GitHub Actions (co-op-translator)
- Documentatie geserveerd via Docsify en beschikbaar als PDF
## Setup-commando's
## Setup Commando's
Deze repository is voornamelijk bedoeld voor het consumeren van educatieve inhoud. Voor werken met specifieke projecten:
Deze repository is voornamelijk bedoeld voor consumptie van educatieve inhoud. Voor het werken met specifieke projecten:
### Hoofdrepository Setup
@ -31,7 +31,7 @@ git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
```
### Quiz-app Setup (Vue 3 + Vite)
### Quiz App Setup (Vue 3 + Vite)
```bash
cd quiz-app
@ -41,17 +41,17 @@ 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 # Voer ESLint uit
npm run format # Formatteren met Prettier
npm run format # Opmaak met Prettier
```
### Browserextensieprojecten
### Browser Extension Projecten
```bash
cd 5-browser-extension/solution
@ -59,15 +59,15 @@ npm install
# 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 de browser of gebruik Live Server
# Open index.html in browser of gebruik Live Server
```
### Chatproject (Python Backend)
### Chat Project (Python Backend)
```bash
cd 9-chat-project/solution/backend/python
@ -78,35 +78,35 @@ python api.py
## Ontwikkelworkflow
### Voor Inhoudbijdragers
### Voor Inhoud Bijdragers
1. **Fork de repository** naar je GitHub-account
2. **Clone je fork** lokaal
3. **Maak een nieuwe branch** voor je wijzigingen
4. Maak wijzigingen aan lesinhoud of codevoorbeelden
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 bijdrage-richtlijnen
6. Dien pull requests in volgens de bijdrage richtlijnen
### Voor Leerlingen
1. Fork of clone de repository
2. Navigeer sequentieel door de lesmappen
3. Lees de README-bestanden van elke les
4. Maak pre-les quizzen op https://ff-quizzes.netlify.app/web/ af
5. Werk codevoorbeelden in lesmappen door
6. Maak opdrachten en uitdagingen af
7. Maak post-les quizzen
3. Lees README-bestanden van elke les
4. Maak de voor-les quizzen op https://ff-quizzes.netlify.app/web/
5. Werk codevoorbeelden door in lesmappen
6. Voltooi opdrachten en uitdagingen
7. Maak de na-les quizzen
### Live Ontwikkeling
- **Documentatie**: Voer `docsify serve` uit in de hoofdmap (poort 3000)
- **Quiz-app**: Voer `npm run dev` uit in de quiz-app map
- **Documentatie**: Voer `docsify serve` uit in de root (poort 3000)
- **Quiz App**: Voer `npm run dev` uit in quiz-app map
- **Projecten**: Gebruik VS Code Live Server extensie voor HTML-projecten
- **API-projecten**: Voer `npm start` uit in respectievelijke API-mappen
- **API Projecten**: Voer `npm start` uit in respectievelijke API-mappen
## Testinstructies
### Quiz-app Testing
### Quiz App Testen
```bash
cd quiz-app
@ -114,58 +114,58 @@ npm run lint # Controleer op problemen met de code-stijl
npm run build # Verifieer dat de build slaagt
```
### Bank API Testing
### Bank API Testen
```bash
cd 7-bank-project/api
npm run lint # Controleer op code stijlproblemen
node server.js # Verifieer dat de server zonder fouten start
node server.js # Controleer of de server zonder fouten start
```
### Algemene Testaanpak
### Algemene Testbenadering
- Dit is een educatieve repository zonder uitgebreide geautomatiseerde tests
- Handmatig testen richt zich op:
- Codevoorbeelden zonder fouten uitvoeren
- Codevoorbeelden draaien zonder fouten
- Links in documentatie werken correct
- Project builds worden succesvol voltooid
- Project builds voltooien succesvol
- Voorbeelden volgen best practices
### Pre-submissie Controles
### Checks Voor Submitten
- Voer `npm run lint` uit in mappen met package.json
- Controleer of Markdown-links geldig zijn
- Controleer of markdown links geldig zijn
- Test codevoorbeelden in browser of Node.js
- Controleer dat vertalingen de juiste structuur behouden
- Controleer dat vertalingen juiste structuur behouden
## Code Stijlrichtlijnen
## Code Stijl Richtlijnen
### JavaScript
- Gebruik moderne ES6+ syntax
- Volg standaard ESLint-configuraties in projecten
- Volg standaard ESLint configuraties in projecten
- Gebruik betekenisvolle variabele- en functienamen voor educatieve duidelijkheid
- Voeg opmerkingen toe die concepten uitleggen voor leerlingen
- Voeg commentaar toe dat concepten uitlegt voor leerlingen
- Format met Prettier waar geconfigureerd
### HTML/CSS
- Semantische HTML5-elementen
- Responsive designprincipes
- Duidelijke classnaamconventies
- Opmerkingen die CSS-technieken uitleggen voor leerlingen
- Semantische HTML5 elementen
- Responsive design principes
- Duidelijke class naamgevingsconventies
- Commentaar die CSS-technieken uitlegt voor leerlingen
### Python
- PEP 8-stijlrichtlijnen
- PEP 8 stijlrichtlijnen
- Duidelijke, educatieve codevoorbeelden
- Type hints waar nuttig voor het leren
- Type hints waar nuttig voor leren
### Markdown Documentatie
- Duidelijke koppenhiërarchie
- Duidelijke kophiërarchie
- Codeblokken met taalspecificatie
- Links naar aanvullende bronnen
- Links naar extra bronnen
- Screenshots en afbeeldingen in `images/` mappen
- Alt-tekst voor afbeeldingen voor toegankelijkheid
@ -178,19 +178,19 @@ node server.js # Verifieer dat de server zonder fouten start
## 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 # Maakt dist/ map aan
npm run build # Maakt de 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`
- **App locatie**: `/quiz-app`
- **Output locatie**: `dist`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Documentatie PDF Generatie
@ -204,79 +204,79 @@ npm run convert # Genereer PDF van docs
```bash
npm install -g docsify-cli # Installeer Docsify wereldwijd
docsify serve # Serveren op localhost:3000
docsify serve # Serveer op localhost:3000
```
### Project-specifieke Builds
Elke projectmap kan zijn eigen buildproces hebben:
- Vue-projecten: `npm run build` maakt productie-bundels aan
- Statische projecten: Geen buildstap, bestanden direct serveren
Elke projectmap kan een eigen buildproces hebben:
- Vue projecten: `npm run build` maakt productiebundels
- Statische projecten: Geen buildstap, serveer bestanden direct
## Pull Request Richtlijnen
### Titelindeling
### Titel Formaat
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] Update setupinstructies`
- `[Quiz-app] Nieuwe quiz toevoegen voor les X`
- `[Les-3] Typfout in terrarium project corrigeren`
- `[Vertaling] Spaanse vertaling toevoegen voor les 5`
- `[Docs] Setup instructies bijwerken`
### Vereiste Controles
### Vereiste Checks
Voor het indienen van een PR:
1. **Codekwaliteit**:
- Voer `npm run lint` uit in betrokken projectmappen
- Los alle lintfouten en waarschuwingen op
1. **Code Kwaliteit**:
- Voer `npm run lint` uit in getroffen projectmappen
- Los alle linting fouten en waarschuwingen op
2. **Build Verificatie**:
- Voer `npm run build` uit indien van toepassing
- Zorg dat er geen buildfouten zijn
- Voer `npm run build` uit indien toepasbaar
- Zorg voor geen buildfouten
3. **Linkvalidatie**:
- Test alle markdown-links
- Controleer of afbeeldingsreferenties werken
3. **Link Validatie**:
- Test alle markdown links
- Controleer of afbeeldingreferenties werken
4. **Inhoud Review**:
- Controleer spelling en grammatica
- Proeflees op spelling en grammatica
- Zorg dat codevoorbeelden correct en educatief zijn
- Verifieer dat vertalingen de oorspronkelijke betekenis behouden
- Controleer dat vertalingen originele betekenis behouden
### Bijdragereisen
### Bijdrageregels
- 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 Gedragscode](https://opensource.microsoft.com/codeofconduct/)
- Zie [CONTRIBUTING.md](./CONTRIBUTING.md) voor gedetailleerde richtlijnen
- Verwijs indien van toepassing naar issuetitels in PR-beschrijving
- Verwijs naar issue nummers in PR beschrijving indien relevant
### Reviewproces
### Review Proces
- PR's worden beoordeeld door maintainers en de community
- Educatieve duidelijkheid staat voorop
- Codevoorbeelden dienen de huidige best practices te volgen
- Vertalingen worden beoordeeld op nauwkeurigheid en culturele geschiktheid
- PR's worden beoordeeld door maintainers en community
- Educatieve duidelijkheid heeft prioriteit
- Codevoorbeelden moeten huidige best practices volgen
- Vertalingen worden gecontroleerd op nauwkeurigheid en culturele juistheid
## Vertalingssysteem
### Geautomatiseerde Vertaling
- Gebruikt GitHub Actions met co-op-translator workflow
- Vertaalt automatisch naar 50+ talen
- Vertaal naar 50+ talen automatisch
- Bronbestanden in hoofddirectories
- Vertaalde bestanden in `translations/{language-code}/` mappen
- Vertaalde bestanden in `translations/{language-code}/` directories
### Handmatige Verbeteringen Toevoegen
### Handmatige Vertaalverbeteringen Toevoegen
1. Zoek het bestand in `translations/{language-code}/`
2. Breng verbeteringen aan terwijl de structuur behouden blijft
3. Zorg dat codevoorbeelden blijven werken
4. Test eventuele gelokaliseerde quiz-inhoud
1. Zoek bestand in `translations/{language-code}/`
2. Breng verbeteringen aan met behoud van structuur
3. Zorg dat codevoorbeelden functioneel blijven
4. Test eventueel gelokaliseerde quizinhoud
### Vertaalmetadata
### Vertaal Metadata
Vertaalde bestanden bevatten metadatakoppen:
Vertaalde bestanden bevatten metadata header:
```markdown
<!--
CO_OP_TRANSLATOR_METADATA:
@ -289,120 +289,120 @@ CO_OP_TRANSLATOR_METADATA:
-->
```
## Debuggen en Probleemoplossing
## Debuggen en Problemen Oplossen
### Veelvoorkomende Problemen
**Quiz-app start niet**:
- Controleer Node.js-versie (v14+ aanbevolen)
- Verwijder `node_modules` en `package-lock.json`, voer opnieuw `npm install` uit
**Quiz app start niet**:
- Controleer Node.js versie (v14+ aanbevolen)
- Verwijder `node_modules` en `package-lock.json`, voer `npm install` opnieuw uit
- Controleer op poortconflicten (standaard: Vite gebruikt poort 5173)
**API-server start niet**:
- Controleer of Node.js-versie minimaal is (node >=10)
**API server start niet**:
- Controleer Node.js versie voldoet aan minimum (node >=10)
- Controleer of poort al in gebruik is
- Zorg dat alle afhankelijkheden zijn geïnstalleerd met `npm install`
- Zorg dat alle dependencies geïnstalleerd zijn met `npm install`
**Browserextensie laadt niet**:
- Controleer of manifest.json correct is geformatteerd
- Controleer de browserconsole op fouten
- Volg browser-specifieke instructies voor het installeren van extensies
**Browser extensie laadt niet**:
- Controleer of manifest.json correct geformatteerd is
- Bekijk browserconsole op fouten
- Volg browserspecifieke installatie-instructies voor extensies
**Python chatprojectproblemen**:
- Zorg dat het OpenAI pakket is geïnstalleerd: `pip install openai`
- Controleer of de GITHUB_TOKEN omgevingsvariabele is ingesteld
**Python chat project problemen**:
- Zorg dat OpenAI package geïnstalleerd is: `pip install openai`
- Controleer dat GITHUB_TOKEN omgevingsvariabele is ingesteld
- Controleer GitHub Models toegangsrechten
**Docsify serveert geen documentatie**:
**Docsify serveert geen docs**:
- Installeer docsify-cli globaal: `npm install -g docsify-cli`
- Start vanuit de rootmap van de repository
- Start in root directory van repository
- Controleer dat `docs/_sidebar.md` bestaat
### Tips voor Ontwikkelomgeving
### Ontwikkelomgeving Tips
- Gebruik VS Code met de Live Server extensie voor HTML-projecten
- Installeer ESLint en Prettier extensies voor consistente formattering
- Gebruik browser DevTools voor het debuggen van JavaScript
- Voor Vue-projecten, installeer Vue DevTools browser extensie
- Gebruik VS Code met Live Server extensie voor HTML-projecten
- Installeer ESLint en Prettier extensies voor consistente formatting
- Gebruik browser DevTools voor debuggen van JavaScript
- Voor Vue projecten, installeer Vue DevTools browser extensie
### Prestatieoverwegingen
### Prestatie Overwegingen
- Groot aantal vertaalde bestanden (50+ talen) betekent grote volledige clones
- Groot aantal vertaalde bestanden (50+ talen) maakt volledige klonen groot
- Gebruik shallow clone als je alleen aan inhoud werkt: `git clone --depth 1`
- Sluit vertalingen uit van zoekacties bij werken in Engelse inhoud
- Buildprocessen kunnen traag zijn bij eerste run (npm install, Vite build)
- Sluit vertalingen uit van zoekopdrachten wanneer je aan Engels werkt
- Build processen kunnen traag zijn bij eerste run (npm install, Vite build)
## Veiligheidsoverwegingen
## Beveiligingsoverwegingen
### Omgevingsvariabelen
- API-sleutels mogen nooit in de repository worden gecommit
- API sleutels nooit in repository committen
- Gebruik `.env` bestanden (staan al in `.gitignore`)
- Documenteer vereiste omgevingsvariabelen in project-READMEs
- 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 minimaal vereiste permissies hebben
### GitHub Models Toegang
- Persoonlijke toegangstokens (PAT) zijn vereist voor GitHub Models
- Tokens moeten als omgevingsvariabele worden opgeslagen
- Tokens of inloggegevens nooit commiten
- Personal Access Tokens (PAT) vereist voor GitHub Models
- Tokens moeten als omgevingsvariabelen opgeslagen worden
- Tokens of credentials nooit committen
## Aanvullende Aantekeningen
## Aanvullende Notities
### Doelgroep
- Complete beginners in webontwikkeling
- Studenten en zelfstudie-lezers
- Docenten die het curriculum in klassen gebruiken
- Inhoud is ontworpen voor toegankelijkheid en geleidelijke vaardigheidsopbouw
- Studenten en zelflerenden
- Docenten die het curriculum in klaslokalen gebruiken
- Inhoud ontworpen voor toegankelijkheid en geleidelijke vaardigheidsopbouw
### Educatieve Filosofie
- Projectgebaseerde leerbenadering
- Regelmatige kennistoetsen (quizzen)
- Praktische codeeropdrachten
- Voorbeelden van toepassingen in de praktijk
- Focus op basisprincipes vóór frameworks
- Regelmatige kennistests (quizzen)
- Praktische codeeroefeningen
- Praktijkvoorbeelden
- Focus op fundamentals vóór frameworks
### Repository Onderhoud
- Actieve community van leerlingen en bijdragers
- Reguliere updates van dependencies en inhoud
- Regelmatige updates van dependencies en inhoud
- Issues en discussies worden gemonitord door maintainers
- Vertaalupdates geautomatiseerd via GitHub Actions
- Vertaalupdates geautomatiseerd met GitHub Actions
### Gerelateerde Bronnen
- [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: Generative AI, Data Science, ML, IoT curricula beschikbaar
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) aanbevolen voor lerenden
- Extra cursussen: Generative AI, Data Science, ML, IoT curricula beschikbaar
### Werken met Specifieke Projecten
Voor gedetailleerde instructies over individuele projecten, raadpleeg de README-bestanden in:
Voor gedetailleerde instructies per project, zie de README-bestanden in:
- `quiz-app/README.md` - Vue 3 quizapplicatie
- `7-bank-project/README.md` - Bankapplicatie met authenticatie
- `5-browser-extension/README.md` - Browserextensie ontwikkeling
- `6-space-game/README.md` - Canvas-gebaseerd spel
- `9-chat-project/README.md` - AI chatassistent project
- `5-browser-extension/README.md` - Browser extensie ontwikkeling
- `6-space-game/README.md` - Canvas-gebaseerd spelontwikkeling
- `9-chat-project/README.md` - AI chat assistant project
### Monorepo Structuur
Hoewel dit geen traditionele monorepo is, bevat deze repository meerdere onafhankelijke projecten:
Hoewel geen traditionele monorepo, bevat deze repository meerdere onafhankelijke projecten:
- Elke les is zelfstandig
- Projecten delen geen dependencies
- Werk aan individuele projecten zonder de anderen te beïnvloeden
- Clone de gehele repo voor de volledige curriculumervaring
- Werk aan individuele projecten zonder anderen te beïnvloeden
- Clone de volledige repo voor de volledige curriculumervaring
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**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 geautomatiseerde vertalingen fouten of onjuistheden kunnen bevatten. Het oorspronkelijke document in de oorspronkelijke taal dient als de gezaghebbende bron te worden beschouwd. 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.
**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 er rekening mee te houden dat geautomatiseerde vertalingen fouten of onnauwkeurigheden kunnen bevatten. Het oorspronkelijke document in de oorspronkelijke taal moet als de gezaghebbende bron worden beschouwd. 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.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->

2
translations/no/.co-op-translator.json
Unescape View File

@ -493,7 +493,7 @@
},
"AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-02-06T09:06:53+00:00",
"translation_date": "2026-02-06T11:37:20+00:00",
"source_file": "AGENTS.md",
"language_code": "no"
},

276
translations/no/AGENTS.md
Unescape View File

@ -2,29 +2,29 @@
## Prosjektoversikt
Dette er et utdanningskurslager for å lære webutviklingsgrunnlag til nybegynnere. 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 undervisningspensum-repositorium for å lære webutviklingsgrunnleggende til nybegynnere. Pensumet er et omfattende 12-ukers kurs utviklet av Microsoft Cloud Advocates, med 24 praktiske leksjoner som dekker JavaScript, CSS og HTML.
### Viktige komponenter
### Nøkkelkomponenter
- **Utdanningsinnhold**: 24 strukturerte leksjoner organisert i prosjektbaserte moduler
- **Praktiske prosjekter**: Terrarium, Typing Game, Nettleserutvidelse, Space Game, Bank-app, Kodeeditor og AI Chat Assistant
- **Interaktive quizer**: 48 quizer med 3 spørsmål hver (før/etter-leksjon vurderinger)
- **Flerspråklig støtte**: Automatiserte oversettelser til 50+ språk via GitHub Actions
- **Undervisningsinnhold**: 24 strukturerte leksjoner organisert i prosjektbaserte moduler
- **Praktiske Prosjekter**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor og AI Chat Assistant
- **Interaktive Quizer**: 48 quizer med 3 spørsmål hver (før-/etter-leksjonsvurderinger)
- **Flerspråklig Støtte**: Automatiske oversettelser til 50+ språk via GitHub Actions
- **Teknologier**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (for AI-prosjekter)
### Arkitektur
- Utdanningslager med leksjonsbasert struktur
- Undervisningsrepo med leksjonsbasert struktur
- Hver leksjonsmappe inneholder README, kodeeksempler og løsninger
- Selvstendige prosjekter i separate kataloger (quiz-app, diverse leksjonsprosjekter)
- Oversettelsessystem med GitHub Actions (co-op-translator)
- Selvstendige 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
## Oppsettkommandoer
Dette repositoriet er primært for konsumering av utdanningsinnhold. For arbeid med spesifikke prosjekter:
Dette repositoriet er primært for konsumering av undervisningsinnhold. For arbeid med spesifikke prosjekter:
### Hovedrepositorieoppsett
### Hovedrepositorioppsett
```bash
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
@ -51,7 +51,7 @@ npm run lint # Kjør ESLint
npm run format # Formater med Prettier
```
### Nettleserutvidelsesprosjekter
### Browser Extension Prosjekter
```bash
cd 5-browser-extension/solution
@ -67,7 +67,7 @@ npm install
# Å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
@ -76,203 +76,203 @@ pip install openai
python api.py
```
## Utviklingsarbeidsflyt
## Utviklingsflyt
### For innholdsbidragsytere
### For Innholdsbidragsytere
1. **Fork repositoriet** til din GitHub-konto
2. **Klone ditt fork** lokalt
3. **Opprett en ny branch** for dine endringer
1. **Gaffel repositoriet** til din GitHub-konto
2. **Klon din gaffel** lokalt
3. **Opprett en ny gren** for dine endringer
4. Gjør endringer i leksjonsinnhold eller kodeeksempler
5. Test eventuelle kodeendringer i relevante prosjektkataloger
6. Send pull requests i henhold til bidragsretningslinjer
6. Send inn pull requests i henhold til retningslinjene for bidrag
### For lærende
### For Lærende
1. Fork eller klone repositoriet
2. Naviger sekvensielt gjennom leksjonskataloger
1. Gaffel eller klon repositoriet
2. Naviger til leksjonskataloger i rekkefølge
3. Les README-filer for hver leksjon
4. Fullfør pre-leksjonsquizer på https://ff-quizzes.netlify.app/web/
5. Arbeid med kodeeksempler i leksjonsmapper
4. Fullfør pre-leksjonquizer på https://ff-quizzes.netlify.app/web/
5. Arbeid gjennom kodeeksempler i leksjonsmapper
6. Fullfør oppgaver og utfordringer
7. Ta post-leksjonsquizer
7. Ta post-leksjonquizer
### Live utvikling
### Live Utvikling
- **Dokumentasjon**: Kjør `docsify serve` i rot (port 3000)
- **Quiz App**: Kjør `npm run dev` i quiz-app katalog
- **Prosjekter**: Bruk VS Code Live Server extension for HTML-prosjekter
- **API Prosjekter**: Kjør `npm start` i aktuelle API-kataloger
- **Dokumentasjon**: Kjør `docsify serve` i rotmappen (port 3000)
- **Quiz App**: Kjør `npm run dev` i quiz-app katalogen
- **Prosjekter**: Bruk VS Code Live Server-utvidelsen for HTML-prosjekter
- **API Prosjekter**: Kjør `npm start` i respektive API-kataloger
## Testinstruksjoner
### Quiz App testing
### Quiz App Testing
```bash
cd quiz-app
npm run lint # Sjekk for kode stilproblemer
npm run build # Bekreft at byggingen lykkes
npm run lint # Sjekk etter problemer med kodeformat
npm run build # Verifiser at byggingen lykkes
```
### Bank API testing
### Bank API Testing
```bash
cd 7-bank-project/api
npm run lint # Sjekk for kode stilproblemer
npm run lint # Sjekk for problemer med kodesstil
node server.js # Verifiser at serveren starter uten feil
```
### Generell testtilnærming
### Generell Testtilnærming
- Dette er et utdanningslager uten omfattende automatiserte tester
- Dette er et undervisningsrepo uten omfattende automatiserte tester
- Manuell testing fokuserer på:
- Kodeeksempler kjører uten feil
- Lenker i dokumentasjon fungerer korrekt
- Prosjektbygg fullføres uten feil
- Prosjektbuilds fullføres vellykket
- Eksempler følger beste praksis
### Sjekk før innsending
### Sjekkliste før innsending
- Kjør `npm run lint` i kataloger med package.json
- Verifiser at markdown-lenker er gyldige
- Bekreft at markdown-lenker er gyldige
- Test kodeeksempler i nettleser eller Node.js
- Sjekk at oversettelser opprettholder riktig struktur
- Sjekk at oversettelser beholder riktig struktur
## Kodestil retningslinjer
## Retningslinjer for Kodestil
### JavaScript
- Bruk moderne ES6+ syntaks
- Følg standard ESLint-konfigurasjoner gitt i prosjektene
- Bruk meningsfulle variabel- og funksjonsnavn for pedagogisk tydelighet
- Bruk meningsfulle variabel- og funksjonsnavn for undervisningsklarhet
- Legg til kommentarer som forklarer konsepter for lærende
- Formater med Prettier der det er konfigurert
### HTML/CSS
- Semantiske HTML5-elementer
- Responsive designprinsipper
- Klare klassifikasjonsnavnkonvensjoner
- Kommenterer CSS-teknikker for lærende
- Responsivt design-prinsipper
- Klare navnekonvensjoner for klasser
- Kommentarer som forklarer CSS-teknikker for lærende
### Python
- PEP 8 stilretningslinjer
- Klare, pedagogiske kodeeksempler
- Typehinting der det er hjelpsomt for læring
- Typehint der det er nyttig for læring
### Markdown dokumentasjon
### Markdown Dokumentasjon
- Klar overskriftshierarki
- Kodeblokker med språkspecifikasjon
- Lenker til tilleggsressurser
- Skjermbilder og bilder i `images/` kataloger
- Alt-tekst for bilder for tilgjengelighet
- Klar overskriftsstruktur
- Kodeblokker med språkspecificering
- Lenker til tilleggsmateriale
- Skjermbilder og bilder i `images/`-mapper
- Alternativ 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
- Bilder lagret i leksjonsspesifikke `images/`-mapper
- Oversettelser i `translations/{language-code}/` struktur
## Bygging og distribusjon
## Bygg og Distribusjon
### Quiz App distribusjon (Azure Static Web Apps)
### Quiz App Distribusjon (Azure Static Web Apps)
Quiz-app er konfigurert for Azure Static Web Apps distribusjon:
Quiz-appen er konfigurert for Azure Static Web Apps distribusjon:
```bash
cd quiz-app
npm run build # Oppretter dist/-mappe
# Distribuerer via GitHub Actions workflow ved push til main
# Distribuerer via GitHub Actions arbeidsflyt ved push til main
```
Azure Static Web Apps konfigurasjon:
- **App-lokasjon**: `/quiz-app`
- **Output-lokasjon**: `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 PDF-dokumentasjon
### Dokumentasjons-PDF Generering
```bash
npm install # Installer docsify-to-pdf
npm run convert # Generer PDF fra docs
```
### Docsify dokumentasjon
### Docsify Dokumentasjon
```bash
npm install -g docsify-cli # Installer Docsify globalt
docsify serve # Server på localhost:3000
```
### Prosjektspesifikke bygg
### Prosjektspesifikke Builds
Hver prosjektkatalog kan ha egen byggprosess:
- Vue prosjekter: `npm run build` lager produksjonspakker
- Statisk prosjekter: Ingen byggesteg, server filer direkte
Hver prosjektmappe kan ha sin egen byggeprosess:
- Vue-prosjekter: `npm run build` lager produksjonspakker
- Statisk prosjekter: Ingen bygge-steg, filene serveres direkte
## Retningslinjer for pull requests
## Retningslinjer for Pull Requests
### Tittelformat
Bruk klare, beskrivende titler som angir endringsområde:
Bruk klare, beskrivende titler som indikerer endringsområdet:
- `[Quiz-app] Legg til ny quiz for leksjon X`
- `[Lesson-3] Rett skrivefeil i terrarium-prosjekt`
- `[Lesson-3] Rett skrivefeil i terrarium-prosjektet`
- `[Translation] Legg til spansk oversettelse for leksjon 5`
- `[Docs] Oppdater oppsettinstruksjoner`
### Påkrevde sjekker
### Obligatoriske Sjekker
Før innsending av PR:
1. **Kodekvalitet**:
- Kjør `npm run lint` i berørte prosjektkataloger
- Fiks alle linting-feil og advarsler
- Rett opp alle linting-feil og advarsler
2. **Byggverifisering**:
- Kjør `npm run build` hvis aktuelt
2. **Byggeverifisering**:
- Kjør `npm run build` om relevant
- Sørg for ingen byggefeil
3. **Lenkevalidering**:
- Test alle markdown-lenker
- Verifiser bildehenvisninger fungerer
- Sjekk at bildehenvisninger fungerer
4. **Innholdsrevisjon**:
- Korrekturles for rettskrivning og grammatikk
- Sørg for at kodeeksempler er korrekte og pedagogiske
4. **Innholdsgjennomgang**:
- Korrekturles for stave- og grammatikkfeil
- Bekreft at kodeeksempler er korrekte og pedagogiske
- Verifiser at oversettelser bevarer original betydning
### Bidragskrav
- Godta Microsoft CLA (automatisk sjekk ved første PR)
- Følg [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Aksepter Microsoft CLA (automatisk sjekk ved første PR)
- Følg [Microsofts Offentlige Kodeks for Oppførsel](https://opensource.microsoft.com/codeofconduct/)
- Se [CONTRIBUTING.md](./CONTRIBUTING.md) for detaljerte retningslinjer
- Referer til issues i PR-beskrivelsen hvis aktuelt
- Referer til issues i PR-beskrivelse om relevant
### Gjennomgangsprosess
- PR-er vurderes av vedlikeholdere og fellesskap
- PRer gjennomgås av vedlikeholdere og community
- Pedagogisk klarhet prioriteres
- Kodeeksempler bør følge gjeldende beste praksis
- Oversettelser vurderes for nøyaktighet og kulturtilpasning
- Oversettelser gjennomgås for nøyaktighet og kulturell hensiktsmessighet
## Oversettelsessystem
### Automatisert oversettelse
### Automatisk Oversettelse
- Bruker GitHub Actions med co-op-translator arbeidsflyt
- Oversetter automatisk til 50+ språk
- Bruker GitHub Actions med co-op-translator workflow
- Oversetter til 50+ språk automatisk
- Kildefiler i hovedkataloger
- Oversatte filer i `translations/{language-code}/` kataloger
### Legge til manuelle oversettelsesforbedringer
### Legge til Manuelle Oversettelsesforbedringer
1. Finn fil i `translations/{language-code}/`
2. Gjør forbedringer med strukturintakt
2. Gjør forbedringer mens strukturen beholdes
3. Sørg for at kodeeksempler fortsatt fungerer
4. Test eventuelt lokalisert quiz-innhold
4. Test eventuelt lokaliserte quiz-innhold
### Oversettelsesmetadata
@ -289,120 +289,120 @@ CO_OP_TRANSLATOR_METADATA:
-->
```
## Feilsøking og problemløsing
## Feilsøking og Problemløsning
### Vanlige problemer
### Vanlige Problemer
**Quiz app starter ikke**:
**Quiz-appen starter ikke**:
- Sjekk Node.js versjon (v14+ anbefalt)
- Slett `node_modules` og `package-lock.json`, kjør `npm install` på nytt
- Sjekk portkonflikter (standard: Vite bruker port 5173)
- Sjekk for portkonflikter (standard: Vite bruker port 5173)
**API-server starter ikke**:
- Verifiser Node.js versjon oppfyller minimum (node >=10)
- Verifiser at Node.js-versjonen er tilstrekkelig (node >=10)
- Sjekk om port allerede er i bruk
- Sørg for at alle avhengigheter er installert med `npm install`
**Nettleserutvidelse lastes ikke**:
- Sjekk at manifest.json er korrekt formatert
- Se etter feil i nettleserkonsoll
- Følg nettleserspesifikke installasjonsinstruksjoner
**Browser extension lastes ikke**:
- Sjekk at manifest.json er riktig formatert
- Se etter feil i nettleserens konsoll
- Følg nettleserspesifikke instruksjoner for installasjon av utvidelsen
**Python chat-prosjekt problemer**:
- Kontroller at OpenAI-pakken er installert: `pip install openai`
**Problemer med Python chat-prosjektet**:
- Sørg for at OpenAI-pakken er installert: `pip install openai`
- Verifiser at GITHUB_TOKEN miljøvariabel er satt
- Sjekk GitHub Models tilgangstillatelser
**Docsify serverer ikke dokumentasjon**:
**Docsify server ikke dokumentasjonen**:
- Installer docsify-cli globalt: `npm install -g docsify-cli`
- Kjør fra repositories rotkatalog
- Sjekk at `docs/_sidebar.md` eksisterer
- Kjør fra repoets rotkatalog
- Sjekk at `docs/_sidebar.md` finnes
### Tips for utviklingsmiljø
### Utviklingsmiljøtips
- Bruk VS Code med Live Server-extension for HTML-prosjekter
- Installer ESLint og Prettier extensions for jevn formatering
- Bruk nettleserens utviklerverktøy til å feilsøke JavaScript
- For Vue prosjekter, installer Vue DevTools nettleserutvidelse
- Bruk VS Code med Live Server-utvidelsen for HTML-prosjekter
- Installer ESLint og Prettier-utvidelser for konsistent formatering
- Bruk nettleserens DevTools for JavaScript-feilsøking
- For Vue-prosjekter, installer Vue DevTools nettleserutvidelse
### Ytelsesmessige hensyn
### Ytelseshensyn
- Stort antall oversatte filer (50+ språk) gjør hele kloner store
- Bruk grunne kloner hvis du kun skal jobbe med innhold: `git clone --depth 1`
- Ekskluder oversettelser fra søk når du arbeider med engelsk innhold
- Byggeprosesser kan være trege første gang (npm install, Vite build)
- Mange oversatte filer (50+ språk) gjør fullstendige kloner store
- Bruk shallow clone hvis du bare jobber med innhold: `git clone --depth 1`
- Ekskluder oversettelser fra søk når du jobber med engelsk innhold
- Byggeprosesser kan være langsomme første gang (npm install, Vite build)
## Sikkerhetshensyn
### Miljøvariabler
- API-nøkler skal aldri legges i repositoriet
- Bruk `.env` filer (allereie i `.gitignore`)
- Dokumenter nødvendige miljøvariabler i prosjektets README-filer
- Bruk `.env`-filer (allerede i `.gitignore`)
- Dokumenter nødvendige miljøvariabler i prosjektets README
### Python-prosjekter
### Python Prosjekter
- Bruk virtuelle miljøer: `python -m venv venv`
- Hold avhengigheter oppdatert
- GitHub-tokens skal ha minimale nødvendige tillatelser
- GitHub-tokens bør ha minimale nødvendige tillatelser
### GitHub Models tilgang
### GitHub Models Tilgang
- Personlige tilgangstokener (PAT) kreves for GitHub Models
- Tokens skal lagres som miljøvariabler
- Aldri legg tokens eller legitimasjon inn i repositoriet
- Tokens bør lagres som miljøvariabler
- Aldri legg inn tokens eller påloggingsinformasjon i repoet
## Tilleggsnotater
### Målgruppe
- Fullstendige nybegynnere i webutvikling
- Studenter og selvlærende
- Komplett nybegynnere innen webutvikling
- Studenter og selvstudenter
- Lærere som bruker pensum i klasserommet
- Innhold designet for tilgjengelighet og gradvis ferdighetsbygging
- Innholdet er designet for tilgjengelighet og gradvis ferdighetsbygging
### Utdanningsfilosofi
### Pedagogisk Filosofi
- Prosjektbasert læringstilnærming
- Hyppige kunnskapssjekker (quizer)
- Praktiske kodeøvelser
- Eksempler på virkelige bruksområder
- Fokuser på grunnleggende før rammeverk
- Praktiske kodingøvelser
- Virkelige eksempler på anvendelse
- Fokus på grunnleggende før rammeverk
### Vedlikehold av repositoriet
### Vedlikehold av Repositoriet
- Aktivt fellesskap av lærende og bidragsytere
- Aktivt samfunn av lærende og bidragsytere
- Regelmessige oppdateringer av avhengigheter og innhold
- Issues og diskusjoner overvåkes av vedlikeholdere
- Oversettelsesoppdateringer automatisert via GitHub Actions
### Relaterte ressurser
### Relaterte Ressurser
- [Microsoft Learn-moduler](https://docs.microsoft.com/learn/)
- [Student Hub-ressurser](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) anbefalt for lærende
- Tilleggs kurs: Generativ AI, Data Science, ML, IoT pensum tilgjengelig
- Ytterligere kurs: Generative AI, Data Science, ML, IoT pensum tilgjengelig
### Arbeide med spesifikke prosjekter
### Arbeide med Spesifikke Prosjekter
For detaljerte instruksjoner om individuelle prosjekter, se README-filene i:
- `quiz-app/README.md` - Vue 3 quiz-applikasjon
- `7-bank-project/README.md` - Bankapplikasjon med autentisering
- `5-browser-extension/README.md` - Nettleserutvidelsesutvikling
- `5-browser-extension/README.md` - Utvikling av nettleserutvidelse
- `6-space-game/README.md` - Canvas-basert spillutvikling
- `9-chat-project/README.md` - AI chatteassistent-prosjekt
- `9-chat-project/README.md` - AI chat-assistentprosjekt
### Monorepo-struktur
### Monorepo Struktur
Selv om det ikke er et tradisjonelt monorepo, inneholder dette repositoriet flere uavhengige prosjekter:
Selv om dette ikke er et tradisjonelt monorepo, inneholder dette repositoriet flere uavhengige prosjekter:
- Hver leksjon er selvstendig
- Prosjekter deler ikke avhengigheter
- Prosjektene deler ikke avhengigheter
- Arbeid med individuelle prosjekter uten å påvirke andre
- Klon hele repo for full pensumopplevelse
- Klon hele repoet for full pensumopplevelse
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**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å originalsproget bør betraktes 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.
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å morsmålet skal anses som den autoritative kilden. For kritisk informasjon anbefales profesjonell menneskelig oversettelse. Vi er ikke ansvarlige for eventuelle misforståelser eller feiltolkninger som følge av bruk av denne oversettelsen.
<!-- CO-OP TRANSLATOR DISCLAIMER END -->
Write Preview
Loading…
Cancel
Save