diff --git a/translations/da/2-js-basics/2-functions-methods/README.md b/translations/da/2-js-basics/2-functions-methods/README.md index b9e9c387a..6c3927fba 100644 --- a/translations/da/2-js-basics/2-functions-methods/README.md +++ b/translations/da/2-js-basics/2-functions-methods/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript Grundlæggende: Metoder og Funktioner -![JavaScript Basics - Functions](../../../../translated_images/webdev101-js-functions.be049c4726e94f8b.da.png) +![JavaScript Basics - Functions](../../../../translated_images/da/webdev101-js-functions.be049c4726e94f8b.png) > Sketchnote af [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid diff --git a/translations/da/2-js-basics/3-making-decisions/README.md b/translations/da/2-js-basics/3-making-decisions/README.md index 66135f14d..5961f8dcc 100644 --- a/translations/da/2-js-basics/3-making-decisions/README.md +++ b/translations/da/2-js-basics/3-making-decisions/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript Basics: At træffe beslutninger -![JavaScript Basics - Making decisions](../../../../translated_images/webdev101-js-decisions.69e1b20f272dd1f0.da.png) +![JavaScript Basics - Making decisions](../../../../translated_images/da/webdev101-js-decisions.69e1b20f272dd1f0.png) > Sketchnote af [Tomomi Imura](https://twitter.com/girlie_mac) diff --git a/translations/da/2-js-basics/4-arrays-loops/README.md b/translations/da/2-js-basics/4-arrays-loops/README.md index 414a0993f..b1159f901 100644 --- a/translations/da/2-js-basics/4-arrays-loops/README.md +++ b/translations/da/2-js-basics/4-arrays-loops/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript Basics: Arrays and Loops -![JavaScript Basics - Arrays](../../../../translated_images/webdev101-js-arrays.439d7528b8a29455.da.png) +![JavaScript Basics - Arrays](../../../../translated_images/da/webdev101-js-arrays.439d7528b8a29455.png) > Sketchnote af [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid diff --git a/translations/da/3-terrarium/1-intro-to-html/README.md b/translations/da/3-terrarium/1-intro-to-html/README.md index f954972e6..38b13e185 100644 --- a/translations/da/3-terrarium/1-intro-to-html/README.md +++ b/translations/da/3-terrarium/1-intro-to-html/README.md @@ -25,7 +25,7 @@ journey Forbedr tilgængelighed: 5: Student Byg terrarium: 5: Student ``` -![Introduktion til HTML](../../../../translated_images/webdev101-html.4389c2067af68e98.da.png) +![Introduktion til HTML](../../../../translated_images/da/webdev101-html.4389c2067af68e98.png) > Sketchnote af [Tomomi Imura](https://twitter.com/girlie_mac) HTML, eller HyperText Markup Language, er fundamentet for enhver hjemmeside, du nogensinde har besøgt. Tænk på HTML som skelettet, der giver struktur til websider – det definerer, hvor indholdet skal være, hvordan det organiseres, og hvad hvert enkelt element repræsenterer. Mens CSS senere "pynter" din HTML med farver og layouts, og JavaScript bringer det til live med interaktivitet, giver HTML den essentielle struktur, som gør alt andet muligt. @@ -86,7 +86,7 @@ Du skal oprette en dedikeret mappe til dit terrariumprojekt og tilføje din før 4. I Explorer-panelet, klik på ikonet "New File" 5. Navngiv din fil `index.html` -![VS Code Explorer viser oprettelse af ny fil](../../../../translated_images/vs-code-index.e2986cf919471eb9.da.png) +![VS Code Explorer viser oprettelse af ny fil](../../../../translated_images/da/vs-code-index.e2986cf919471eb9.png) **Mulighed 2: Brug af terminalkommandoer** ```bash @@ -236,48 +236,48 @@ Tilføj nu plantebillederne organiseret i to kolonner mellem dine `
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
diff --git a/translations/da/3-terrarium/2-intro-to-css/README.md b/translations/da/3-terrarium/2-intro-to-css/README.md index ede6812b2..12df719a5 100644 --- a/translations/da/3-terrarium/2-intro-to-css/README.md +++ b/translations/da/3-terrarium/2-intro-to-css/README.md @@ -29,7 +29,7 @@ journey Responsivt design: 5: Student Glasreflektioner: 5: Student ``` -![Introduktion til CSS](../../../../translated_images/webdev101-css.3f7af5991bf53a20.da.png) +![Introduktion til CSS](../../../../translated_images/da/webdev101-css.3f7af5991bf53a20.png) > Sketchnote af [Tomomi Imura](https://twitter.com/girlie_mac) Kan du huske, hvordan dit HTML-terrarium så temmelig grundlæggende ud? CSS er stedet, hvor vi forvandler den enkle struktur til noget visuelt tiltalende. @@ -202,7 +202,7 @@ body { Åbn din browsers udviklerværktøjer (F12), gå til Elements fanen, og undersøg dit `

` element. Du vil se, at det arver font-familien fra body: -![arvet font](../../../../translated_images/1.cc07a5cbe114ad1d.da.png) +![arvet font](../../../../translated_images/da/1.cc07a5cbe114ad1d.png) ✅ **Eksperimenter**: Prøv at sætte andre arvelige egenskaber på `` som `color`, `line-height` eller `text-align`. Hvad sker der med din overskrift og andre elementer? @@ -332,7 +332,7 @@ I vores terrarium har hver plante brug for lignende styling, men også individue **Her er HTML-strukturen for hver plante:** ```html
- Decorative plant for terrarium + Decorative plant for terrarium
``` @@ -594,7 +594,7 @@ Klar til at forbedre dit terrarium med realistiske glasreflektioner? Denne tekni Du vil skabe subtile highlights, der simulerer, hvordan lys reflekteres på glasoverflader. Denne metode svarer til, hvordan renæssancens malere som Jan van Eyck brugte lys og refleksion til at få malet glas til at fremstå tredimensionelt. Sådan skal resultatet se ud: -![færdigt terrarium](../../../../translated_images/terrarium-final.2f07047ffc597d0a.da.png) +![færdigt terrarium](../../../../translated_images/da/terrarium-final.2f07047ffc597d0a.png) **Din udfordring:** - **Opret** subtile hvide eller lyse ovale former til glasreflektionerne diff --git a/translations/da/3-terrarium/3-intro-to-DOM-and-closures/README.md b/translations/da/3-terrarium/3-intro-to-DOM-and-closures/README.md index 44853f835..34cc692ec 100644 --- a/translations/da/3-terrarium/3-intro-to-DOM-and-closures/README.md +++ b/translations/da/3-terrarium/3-intro-to-DOM-and-closures/README.md @@ -25,7 +25,7 @@ journey Test funktionalitet: 5: Student Fuldfør terrarium: 5: Student ``` -![DOM og en closure](../../../../translated_images/webdev101-js.10280393044d7eaa.da.png) +![DOM og en closure](../../../../translated_images/da/webdev101-js.10280393044d7eaa.png) > Sketchnote af [Tomomi Imura](https://twitter.com/girlie_mac) Velkommen til en af de mest engagerende aspekter af webudvikling - at gøre ting interaktive! Document Object Model (DOM) er som en bro mellem dit HTML og JavaScript, og i dag bruger vi det til at bringe dit terrarium til live. Da Tim Berners-Lee skabte den første webbrowser, forestillede han sig et web, hvor dokumenter kunne være dynamiske og interaktive - DOM gør denne vision mulig. @@ -102,7 +102,7 @@ flowchart TD style P fill:#ffebee style Q fill:#ffebee ``` -![DOM trærepresentation](../../../../translated_images/dom-tree.7daf0e763cbbba92.da.png) +![DOM trærepresentation](../../../../translated_images/da/dom-tree.7daf0e763cbbba92.png) > En repræsentation af DOM og den HTML markup, som henviser til den. Fra [Olfa Nasraoui](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites) @@ -146,7 +146,7 @@ flowchart LR ``` > 💡 **Forståelse af Closures**: Closures er et væsentligt emne i JavaScript, og mange udviklere bruger år på at forstå alle de teoretiske aspekter fuldt ud. I dag fokuserer vi på praktisk anvendelse – du vil se closures naturligt opstå, når vi bygger vores interaktive funktioner. Forståelsen udvikler sig, når du ser, hvordan de løser virkelige problemer. -![DOM trærepresentation](../../../../translated_images/dom-tree.7daf0e763cbbba92.da.png) +![DOM trærepresentation](../../../../translated_images/da/dom-tree.7daf0e763cbbba92.png) > En repræsentation af DOM og den HTML markup, som henviser til den. Fra [Olfa Nasraoui](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites) @@ -591,7 +591,7 @@ Test nu dit interaktive terrarium! Åbn din `index.html` fil i en webbrowser og - **Tvær-enheds support**: Virker på desktop og mobiler - **Ydelsesbevidsthed**: Ingen hukommelseslækager eller overflødige beregninger -![færdigt terrarium](../../../../translated_images/terrarium-final.0920f16e87c13a84.da.png) +![færdigt terrarium](../../../../translated_images/da/terrarium-final.0920f16e87c13a84.png) --- diff --git a/translations/da/3-terrarium/solution/README.md b/translations/da/3-terrarium/solution/README.md index f334a284d..cdd98172f 100644 --- a/translations/da/3-terrarium/solution/README.md +++ b/translations/da/3-terrarium/solution/README.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: En lille drag-and-drop kode-meditation. Med lidt HTML, JS og CSS kan du bygge en webgrænseflade, style den og tilføje interaktion. -![mit terrarium](../../../../translated_images/screenshot_gray.0c796099a1f9f25e.da.png) +![mit terrarium](../../../../translated_images/da/screenshot_gray.0c796099a1f9f25e.png) ## Krediteringer diff --git a/translations/da/5-browser-extension/1-about-browsers/README.md b/translations/da/5-browser-extension/1-about-browsers/README.md index 127c005f7..0f49c1f75 100644 --- a/translations/da/5-browser-extension/1-about-browsers/README.md +++ b/translations/da/5-browser-extension/1-about-browsers/README.md @@ -25,7 +25,7 @@ journey Fejlret problemer: 4: Student Finpuds oplevelse: 5: Student ``` -![Browser sketchnote](../../../../translated_images/browser.60317c9be8b7f84a.da.jpg) +![Browser sketchnote](../../../../translated_images/da/browser.60317c9be8b7f84a.jpg) > Sketchnote af [Wassim Chegham](https://dev.to/wassimchegham/ever-wondered-what-happens-when-you-type-in-a-url-in-an-address-bar-in-a-browser-3dob) ## Forudgående Quiz @@ -77,7 +77,7 @@ Denne proces afspejler, hvordan den første webbrowser, WorldWideWeb, blev desig ✅ **Lidt historie**: Den første browser hed 'WorldWideWeb' og blev skabt af Sir Timothy Berners-Lee i 1990. -![early browsers](../../../../translated_images/earlybrowsers.d984b711cdf3a42d.da.jpg) +![early browsers](../../../../translated_images/da/earlybrowsers.d984b711cdf3a42d.jpg) > Nogle tidlige browsere, via [Karen McGrane](https://www.slideshare.net/KMcGrane/week-4-ixd-history-personal-computing) ### Hvordan Browsere Behandler Webindhold @@ -194,7 +194,7 @@ quadrantChart At forstå installationsprocessen for udvidelser hjælper dig med at forudse brugeroplevelsen, når folk installerer din udvidelse. Installationsprocessen er standardiseret på tværs af moderne browsere med mindre variationer i grænsefladedesign. -![screenshot of the Edge browser showing the open edge://extensions page and open settings menu](../../../../translated_images/install-on-edge.d68781acaf0b3d3d.da.png) +![screenshot of the Edge browser showing the open edge://extensions page and open settings menu](../../../../translated_images/da/install-on-edge.d68781acaf0b3d3d.png) > **Vigtigt**: Sørg for at slå udviklertilstand til og tillade udvidelser fra andre butikker, når du tester dine egne udvidelser. @@ -308,10 +308,10 @@ Dette følger princippet om gradvis afsløring, brugt i interface design siden d ### Oversigt over Udvidelsesvisninger **Opsætningsvisning** – første gangs bruger-konfiguration: -![screenshot of the completed extension open in a browser, displaying a form with inputs for region name and API key.](../../../../translated_images/1.b6da8c1394b07491.da.png) +![screenshot of the completed extension open in a browser, displaying a form with inputs for region name and API key.](../../../../translated_images/da/1.b6da8c1394b07491.png) **Resultatvisning** – visning af kulstofaftrykdata: -![screenshot of the completed extension displaying values for carbon usage and fossil fuel percentage for the US-NEISO region.](../../../../translated_images/2.1dae52ff08042246.da.png) +![screenshot of the completed extension displaying values for carbon usage and fossil fuel percentage for the US-NEISO region.](../../../../translated_images/da/2.1dae52ff08042246.png) ### Bygning af Konfigurationsformularen diff --git a/translations/da/5-browser-extension/2-forms-browsers-local-storage/README.md b/translations/da/5-browser-extension/2-forms-browsers-local-storage/README.md index 6d6f944b6..31211ff11 100644 --- a/translations/da/5-browser-extension/2-forms-browsers-local-storage/README.md +++ b/translations/da/5-browser-extension/2-forms-browsers-local-storage/README.md @@ -263,7 +263,7 @@ stateDiagram-v2 Reset --> ClearStorage: Fjern gemte data ClearStorage --> FirstTime: Tilbage til opsætning ``` -![Lokal lagringspanel](../../../../translated_images/localstorage.472f8147b6a3f8d1.da.png) +![Lokal lagringspanel](../../../../translated_images/da/localstorage.472f8147b6a3f8d1.png) > ⚠️ **Sikkerhedsovervejelse**: I produktionsapplikationer udgør lagring af API-nøgler i LocalStorage sikkerhedsrisici, da JavaScript kan tilgå disse data. Til læringsformål fungerer dette fint, men rigtige applikationer bør bruge sikker server-side lagring til følsomme oplysninger. diff --git a/translations/da/5-browser-extension/3-background-tasks-and-performance/README.md b/translations/da/5-browser-extension/3-background-tasks-and-performance/README.md index 53cdd545e..f25d7c50e 100644 --- a/translations/da/5-browser-extension/3-background-tasks-and-performance/README.md +++ b/translations/da/5-browser-extension/3-background-tasks-and-performance/README.md @@ -123,7 +123,7 @@ For at åbne Udviklerværktøjer i Edge, klik på de tre prikker øverst til hø Lad os prøve det. Åbn en hjemmeside (Microsoft.com fungerer godt til dette) og klik på 'Optag' knappen. Opdater nu siden, og se profilen fange alt, hvad der sker. Når du stopper optagelsen, får du en detaljeret opdeling af, hvordan browseren ‘script’, ‘renderer’ og ‘maler’ sitet. Det minder mig om, hvordan mission control overvåger hvert system under en raketopsendelse – du får realtime-data om præcis, hvad der sker og hvornår. -![Edge profiler](../../../../translated_images/profiler.5a4a62479c5df01c.da.png) +![Edge profiler](../../../../translated_images/da/profiler.5a4a62479c5df01c.png) ✅ [Microsoft Dokumentationen](https://docs.microsoft.com/microsoft-edge/devtools-guide/performance/?WT.mc_id=academic-77807-sagibbon) har masser af flere detaljer, hvis du vil dykke dybere ned @@ -133,11 +133,11 @@ Vælg elementer i profilens tidslinje for at zoome ind på begivenheder, der ske Få et øjebliksbillede af din sides ydeevne ved at vælge et stykke af profiltidslinjen og kigge på oversigtspanelet: -![Edge profiler snapshot](../../../../translated_images/snapshot.97750180ebcad737.da.png) +![Edge profiler snapshot](../../../../translated_images/da/snapshot.97750180ebcad737.png) Tjek Event Log-panelet for at se, om nogen begivenhed tog længere tid end 15 ms: -![Edge event log](../../../../translated_images/log.804026979f3707e0.da.png) +![Edge event log](../../../../translated_images/da/log.804026979f3707e0.png) ✅ Lær din profiler at kende! Åbn udviklerværktøjerne på denne side og se, om der er nogen flaskehalse. Hvad er det langsomt indlæsende element? Hvad er det hurtigste? diff --git a/translations/da/5-browser-extension/README.md b/translations/da/5-browser-extension/README.md index d8f0534b6..7efcf3c07 100644 --- a/translations/da/5-browser-extension/README.md +++ b/translations/da/5-browser-extension/README.md @@ -23,7 +23,7 @@ Denne udvidelse kan bruges ad hoc af en bruger, når en API-nøgle og regionskod ### Krediteringer -![en grøn browserudvidelse](../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.da.png) +![en grøn browserudvidelse](../../../translated_images/da/extension-screenshot.0e7f5bfa110e92e3.png) ## Krediteringer diff --git a/translations/da/5-browser-extension/solution/README.md b/translations/da/5-browser-extension/solution/README.md index f54b70ac9..88ca27979 100644 --- a/translations/da/5-browser-extension/solution/README.md +++ b/translations/da/5-browser-extension/solution/README.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Ved at bruge tmrow's CO2 Signal API til at spore elforbrug, kan du bygge en browserudvidelse, så du får en påmindelse direkte i din browser om, hvor belastet din regions elforbrug er. Ved at bruge denne udvidelse ad hoc kan du træffe bedre beslutninger om dine aktiviteter baseret på denne information. -![extension screenshot](../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.da.png) +![extension screenshot](../../../../translated_images/da/extension-screenshot.0e7f5bfa110e92e3.png) ## Kom godt i gang @@ -31,7 +31,7 @@ npm run build For at installere på Edge skal du bruge 'tre-punkts'-menuen øverst til højre i browseren for at finde panelet Udvidelser. Derfra vælger du 'Indlæs ikke-pakket' for at indlæse en ny udvidelse. Åbn mappen 'dist', når du bliver bedt om det, og udvidelsen vil blive indlæst. For at bruge den skal du have en API-nøgle til CO2 Signal's API ([få en her via e-mail](https://www.co2signal.com/) - indtast din e-mail i boksen på denne side) og koden for din region ([find den her](http://api.electricitymap.org/v3/zones)) svarende til [Electricity Map](https://www.electricitymap.org/map) (i Boston bruger jeg for eksempel 'US-NEISO'). -![installing](../../../../translated_images/install-on-edge.78634f02842c4828.da.png) +![installing](../../../../translated_images/da/install-on-edge.78634f02842c4828.png) Når API-nøglen og regionen er indtastet i udvidelsens grænseflade, bør den farvede prik i browserens udvidelsesbjælke ændre sig for at afspejle din regions energiforbrug og give dig en indikation af, hvilke energitunge aktiviteter der ville være passende at udføre. Konceptet bag dette 'prik'-system blev inspireret af [Energy Lollipop-udvidelsen](https://energylollipop.com/) for Californiens emissioner. diff --git a/translations/da/5-browser-extension/solution/translation/README.es.md b/translations/da/5-browser-extension/solution/translation/README.es.md index 8c2c2852b..800e85389 100644 --- a/translations/da/5-browser-extension/solution/translation/README.es.md +++ b/translations/da/5-browser-extension/solution/translation/README.es.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Ved at bruge tmrow's CO2-signal API til at spore elforbrug, kan du oprette en browserudvidelse, der giver dig en påmindelse direkte i din browser om elforbruget i din region. Brug af denne ad hoc-udvidelse vil hjælpe dig med at træffe beslutninger om dine aktiviteter baseret på denne information. -![extension screenshot](../../../../../translated_images/extension-screenshot.352c4c3ba54e4041ad2f6af749d562cc5705f527b5826efd53d11c3528f5ae45.da.png) +![extension screenshot](../../../../../translated_images/da/extension-screenshot.352c4c3ba54e4041ad2f6af749d562cc5705f527b5826efd53d11c3528f5ae45.png) ## Kom godt i gang @@ -31,7 +31,7 @@ npm run build For at installere i Edge skal du bruge menuen med 'tre prikker' i øverste højre hjørne af browseren for at finde panelet Udvidelser. Derfra skal du vælge 'Indlæs udpakket' for at tilføje en ny udvidelse. Åbn mappen 'dist', når du bliver bedt om det, og udvidelsen vil blive indlæst. For at bruge den skal du have en API-nøgle til CO2 Signal API ([få en her via e-mail](https://www.co2signal.com/) - indtast din e-mail i feltet på denne side) og koden for din region ([find den her](http://api.electricitymap.org/v3/zones)) svarende til [Electricity Map](https://www.electricitymap.org/map) (i Boston bruger jeg for eksempel 'US-NEISO'). -![installing](../../../../../translated_images/install-on-edge.8bd0ee3ca7dcda1c5334b5195603a43c864e3b38d088b03d57376d25e77b9459.da.png) +![installing](../../../../../translated_images/da/install-on-edge.8bd0ee3ca7dcda1c5334b5195603a43c864e3b38d088b03d57376d25e77b9459.png) Når API-nøglen og regionen er indtastet i udvidelsens grænseflade, bør farvepunktet i browserens udvidelsesbjælke ændre sig for at afspejle energiforbruget i din region og give dig en indikator for, hvilke aktiviteter med højt energiforbrug der ville være passende for dig. Konceptet bag dette "punkt"-system blev inspireret af [Energy Lollipop-udvidelsen](https://energylollipop.com/) for Californiens emissioner. diff --git a/translations/da/5-browser-extension/solution/translation/README.fr.md b/translations/da/5-browser-extension/solution/translation/README.fr.md index 861fc4824..5acf9ee7a 100644 --- a/translations/da/5-browser-extension/solution/translation/README.fr.md +++ b/translations/da/5-browser-extension/solution/translation/README.fr.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Ved hjælp af tmrow's CO2 Signal API til at overvåge elforbrug, kan du oprette en browserudvidelse, der giver dig en påmindelse direkte i din browser om elforbruget i dit område. Brug af denne ad hoc-udvidelse kan hjælpe dig med at træffe beslutninger om dine aktiviteter baseret på disse oplysninger. -![udvidelsesbillede](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.da.png) +![udvidelsesbillede](../../../../../translated_images/da/extension-screenshot.0e7f5bfa110e92e3.png) ## Kom godt i gang @@ -31,7 +31,7 @@ npm run build For at installere på Edge skal du bruge menuen med 'tre prikker' i øverste højre hjørne af browseren for at finde panelet Udvidelser. Derfra vælger du 'Indlæs udvidelse uden komprimering' for at tilføje en ny udvidelse. Åbn mappen 'dist' ved prompten, og udvidelsen vil blive indlæst. For at bruge den skal du have en API-nøgle til CO2 Signal API ([få en her via e-mail](https://www.co2signal.com/) - indtast din e-mail i feltet på denne side) og [koden for din region](http://api.electricitymap.org/v3/zones), som svarer til [Electricity Map](https://www.electricitymap.org/map) (i Boston, for eksempel, bruger jeg 'US-NEISO'). -![installation](../../../../../translated_images/install-on-edge.78634f02842c4828.da.png) +![installation](../../../../../translated_images/da/install-on-edge.78634f02842c4828.png) Når API-nøglen og regionen er indtastet i udvidelsens interface, bør den farvede prik i browserens udvidelsesbjælke ændre sig for at afspejle energiforbruget i dit område og give dig en indikator for, hvilke energikrævende aktiviteter det ville være passende at udføre. Konceptet bag dette 'prik'-system blev inspireret af [Energy Lollipop-udvidelsen](https://energylollipop.com/) for californiske emissioner. diff --git a/translations/da/5-browser-extension/solution/translation/README.hi.md b/translations/da/5-browser-extension/solution/translation/README.hi.md index 04b835d77..17d8dbab6 100644 --- a/translations/da/5-browser-extension/solution/translation/README.hi.md +++ b/translations/da/5-browser-extension/solution/translation/README.hi.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Ved at bruge tmrow's CO2 Signal API til at spore elforbrug, bygger vi en browserudvidelse, der kan minde dig om, hvor belastet strømforbruget i dit område er. Ved at bruge denne udvidelse kan du træffe beslutninger om dine aktiviteter baseret på denne information. -![Udvidelse skærmbillede](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.da.png) +![Udvidelse skærmbillede](../../../../../translated_images/da/extension-screenshot.0e7f5bfa110e92e3.png) ## Kom godt i gang @@ -31,7 +31,7 @@ npm run build For at installere på Edge skal du bruge 'tre prikker'-menuen øverst til højre i browseren for at finde udvidelsespanelet. Derfra skal du vælge 'Load unpacked' for at indlæse en ny udvidelse. Når du bliver bedt om det, skal du åbne 'dist'-mappen, og udvidelsen vil blive indlæst. For at bruge den skal du have en API-nøgle til CO2 Signal ([fås her via e-mail](https://www.co2signal.com/) - indtast din e-mail i boksen på denne side) og [koden for dit område](http://api.electricitymap.org/v3/zones) fra [Electricity Map](https://www.electricitymap.org/map) (for eksempel bruger jeg 'US-NEISO' for Boston). -![installering](../../../../../translated_images/install-on-edge.78634f02842c4828.da.png) +![installering](../../../../../translated_images/da/install-on-edge.78634f02842c4828.png) Når API-nøglen og området er indtastet i udvidelsens interface, bør den farvede prik i browserens udvidelsesbjælke ændre sig for at afspejle energiforbruget i dit område og give dig en indikator for, hvilke energiintensive aktiviteter der er passende. Konceptet bag dette 'prik'-system blev inspireret af [Energy Lollipop Extension](https://energylollipop.com/) for Californiske emissioner. diff --git a/translations/da/5-browser-extension/solution/translation/README.it.md b/translations/da/5-browser-extension/solution/translation/README.it.md index c0533b431..cc3688b53 100644 --- a/translations/da/5-browser-extension/solution/translation/README.it.md +++ b/translations/da/5-browser-extension/solution/translation/README.it.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Du vil bruge tmrow's Signal CO2 API til at overvåge elforbruget og oprette en browserudvidelse, så du kan få en påmindelse direkte i din browser om, hvor tungt elforbruget er i din region. Brug af denne ad hoc-udvidelse vil hjælpe dig med at vurdere dine aktiviteter baseret på disse oplysninger. -![skærmbillede af udvidelsen](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.da.png) +![skærmbillede af udvidelsen](../../../../../translated_images/da/extension-screenshot.0e7f5bfa110e92e3.png) ## Kom godt i gang @@ -31,7 +31,7 @@ npm run build For at installere på Edge skal du bruge "tre prikker"-menuen i øverste højre hjørne af browseren for at finde panelet Udvidelser. Hvis det ikke allerede er aktiveret, skal du aktivere Udviklertilstand (nederst til venstre). Vælg "Indlæs pakket udvidelse" for at tilføje en ny udvidelse. Åbn mappen "dist" ved prompten, og udvidelsen vil blive indlæst. For at bruge den skal du have en API-nøgle til CO2 Signal API'en (du kan [få den her via e-mail](https://www.co2signal.com/) - indtast din e-mail i feltet på denne side) og [koden for din region](http://api.electricitymap.org/v3/zones), som svarer til [elektricitetskortet](https://www.electricitymap.org/map) (for eksempel er koden for Boston "US-NEISO"). -![installation](../../../../../translated_images/install-on-edge.78634f02842c4828.da.png) +![installation](../../../../../translated_images/da/install-on-edge.78634f02842c4828.png) Når API-nøglen og regionen er indtastet i udvidelsens interface, bør den farvede prik i browserens udvidelsesbjælke ændre sig for at afspejle regionens energiforbrug og give en indikation af, hvilke aktiviteter med højt energiforbrug der ville være passende at udføre. Konceptet bag dette "prik"-system er inspireret af [Energy Lollipop-udvidelsen](https://energylollipop.com/) for Californiens emissioner. diff --git a/translations/da/5-browser-extension/solution/translation/README.ja.md b/translations/da/5-browser-extension/solution/translation/README.ja.md index 173284c07..81dea74c1 100644 --- a/translations/da/5-browser-extension/solution/translation/README.ja.md +++ b/translations/da/5-browser-extension/solution/translation/README.ja.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Byg en browser-udvidelse, der fungerer som en påmindelse om, hvor meget energi der bruges i dit område, ved at spore strømforbruget med tmrow's CO2 Signal API. Ved at bruge denne udvidelse ad hoc kan du træffe beslutninger om dine aktiviteter baseret på denne information. -![extension screenshot](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.da.png) +![extension screenshot](../../../../../translated_images/da/extension-screenshot.0e7f5bfa110e92e3.png) ## Kom godt i gang @@ -31,7 +31,7 @@ npm run build For at installere på Edge skal du finde "Udvidelser"-panelet via "tre prikker"-menuen øverst til højre i browseren. Derfra vælger du "Load Unpacked" og indlæser den nye udvidelse. Når du bliver bedt om det, skal du åbne "dist"-mappen, og udvidelsen vil blive indlæst. For at bruge den skal du have en API-nøgle til CO2 Signal API ([få en her via e-mail](https://www.co2signal.com/) - indtast din e-mail i boksen på siden) og en [kode for din region](http://api.electricitymap.org/v3/zones), som er kompatibel med [Electricity Map](https://www.electricitymap.org/map) (for eksempel bruges 'US-NEISO' i Boston). -![installing](../../../../../translated_images/install-on-edge.78634f02842c4828.da.png) +![installing](../../../../../translated_images/da/install-on-edge.78634f02842c4828.png) Når du har indtastet API-nøglen og din region i udvidelsens interface, vil en farvet prik vises i browserens udvidelsesbjælke. Denne prik ændrer farve for at afspejle energiforbruget i dit område og hjælper dig med at vurdere, hvilke aktiviteter der kræver energi, der er passende at udføre. Konceptet med dette "prik"-system blev inspireret af [Energy Lollipop extension](https://energylollipop.com/) for emissioner i Californien. diff --git a/translations/da/5-browser-extension/solution/translation/README.ms.md b/translations/da/5-browser-extension/solution/translation/README.ms.md index 99c6130f4..19f21cfcf 100644 --- a/translations/da/5-browser-extension/solution/translation/README.ms.md +++ b/translations/da/5-browser-extension/solution/translation/README.ms.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Ved at bruge CO2 Signal API fra tmrow til at overvåge elforbrug, kan du bygge en browserudvidelse, der giver dig advarsler i din browser om, hvor belastet dit områdes elforbrug er. Denne udvidelse kan hjælpe dig med at tage beslutninger om dine aktiviteter baseret på disse oplysninger. -![skærmbillede af browserudvidelse](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.da.png) +![skærmbillede af browserudvidelse](../../../../../translated_images/da/extension-screenshot.0e7f5bfa110e92e3.png) ## Kom godt i gang @@ -31,7 +31,7 @@ npm run build For at installere i Edge skal du bruge menuen med 'tre prikker' i øverste højre hjørne af browseren for at finde panelet Udvidelser. Derfra vælger du 'Load Unpacked' for at indlæse den nye udvidelse. Åbn mappen 'dist', når du bliver bedt om det, og udvidelsen vil blive indlæst. For at bruge den skal du have en API-nøgle til CO2 Signal API ([få en her via e-mail](https://www.co2signal.com/) - indtast din e-mail i boksen på denne side) og [koden for dit område](http://api.electricitymap.org/v3/zones), som svarer til [Electricity Map](https://www.electricitymap.org/map) (i Boston bruger jeg for eksempel 'US-NEISO'). -![downloader](../../../../../translated_images/install-on-edge.78634f02842c4828.da.png) +![downloader](../../../../../translated_images/da/install-on-edge.78634f02842c4828.png) Når API-nøglen og området er indtastet i udvidelsens interface, vil en farvet prik i browserens udvidelsesbjælke ændre sig for at afspejle dit områdes energiforbrug og give dig anbefalinger om passende aktiviteter baseret på belastningen. Konceptet bag dette 'prik'-system blev inspireret af [Energy Lollipop browserudvidelsen](https://energylollipop.com/) for Californiens emissioner. diff --git a/translations/da/5-browser-extension/start/README.md b/translations/da/5-browser-extension/start/README.md index 80c0eeb7b..4fe7cccef 100644 --- a/translations/da/5-browser-extension/start/README.md +++ b/translations/da/5-browser-extension/start/README.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Ved at bruge tmrow's CO2 Signal API til at spore elforbrug, kan du bygge en browserudvidelse, så du får en påmindelse direkte i din browser om, hvor belastet din regions elforbrug er. Ved at bruge denne udvidelse ad hoc kan du træffe beslutninger om dine aktiviteter baseret på denne information. -![udvidelsesskærmbillede](../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.da.png) +![udvidelsesskærmbillede](../../../../translated_images/da/extension-screenshot.0e7f5bfa110e92e3.png) ## Kom godt i gang @@ -31,7 +31,7 @@ npm run build For at installere på Edge skal du bruge menuen med de 'tre prikker' øverst til højre i browseren for at finde panelet Udvidelser. Derfra skal du vælge 'Indlæs upakket' for at indlæse en ny udvidelse. Åbn mappen 'dist', når du bliver bedt om det, og udvidelsen vil blive indlæst. For at bruge den skal du have en API-nøgle til CO2 Signal's API ([få en her via e-mail](https://www.co2signal.com/) - indtast din e-mail i boksen på denne side) og koden for din region ([find den her](http://api.electricitymap.org/v3/zones)) svarende til [Electricity Map](https://www.electricitymap.org/map) (i Boston bruger jeg for eksempel 'US-NEISO'). -![installation](../../../../translated_images/install-on-edge.78634f02842c4828.da.png) +![installation](../../../../translated_images/da/install-on-edge.78634f02842c4828.png) Når API-nøglen og regionen er indtastet i udvidelsens grænseflade, bør den farvede prik i browserens udvidelsesbjælke ændre sig for at afspejle din regions energiforbrug og give dig en indikation af, hvilke energitunge aktiviteter der ville være passende at udføre. Konceptet bag dette 'prik'-system blev givet til mig af [Energy Lollipop-udvidelsen](https://energylollipop.com/) for Californiens emissioner. diff --git a/translations/da/6-space-game/2-drawing-to-canvas/README.md b/translations/da/6-space-game/2-drawing-to-canvas/README.md index 2ab898b3e..677fd8f11 100644 --- a/translations/da/6-space-game/2-drawing-to-canvas/README.md +++ b/translations/da/6-space-game/2-drawing-to-canvas/README.md @@ -105,7 +105,7 @@ quadrantChart Power-up: [0.7, 0.6] UI Elements: [0.9, 0.1] ``` -![canvas gitteret](../../../../translated_images/canvas_grid.5f209da785ded492.da.png) +![canvas gitteret](../../../../translated_images/da/canvas_grid.5f209da785ded492.png) > Billede fra [MDN](https://developer.mozilla.org/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes) For at tegne på canvas-elementet følger du den samme tre-trins proces, som udgør fundamentet for al canvas grafik. Når du har gjort det et par gange, bliver det anden natur: @@ -323,11 +323,11 @@ Du skal bygge en webside med et Canvas-element. Det skal gengive en sort skærm - Helteskib - ![Helteskib](../../../../translated_images/player.dd24c1afa8c71e9b.da.png) + ![Helteskib](../../../../translated_images/da/player.dd24c1afa8c71e9b.png) - 5*5 monstre - ![Monster skib](../../../../translated_images/enemyShip.5df2a822c16650c2.da.png) + ![Monster skib](../../../../translated_images/da/enemyShip.5df2a822c16650c2.png) ### Anbefalede trin for at starte udviklingen @@ -463,7 +463,7 @@ for (let x = START_X; x < STOP_X; x += ENEMY_SPACING) { Det færdige resultat burde se sådan ud: -![Black screen with a hero and 5*5 monsters](../../../../translated_images/partI-solution.36c53b48c9ffae2a.da.png) +![Black screen with a hero and 5*5 monsters](../../../../translated_images/da/partI-solution.36c53b48c9ffae2a.png) ## Løsning diff --git a/translations/da/6-space-game/5-keeping-score/README.md b/translations/da/6-space-game/5-keeping-score/README.md index 3b9efe33d..b6d2f70bc 100644 --- a/translations/da/6-space-game/5-keeping-score/README.md +++ b/translations/da/6-space-game/5-keeping-score/README.md @@ -155,7 +155,7 @@ sequenceDiagram end ``` - **Pointsystem**: Hver ødelagt fjendtlige skib giver 100 point (runde tal er lettere for spillere at regne mentalt). Scoren vises i nederste venstre hjørne. -- **Livstæller**: Din helt starter med tre liv - en standard etableret af tidlige arkadespil for at balancere udfordring med spilbarhed. Hver kollision med en fjende koster et liv. Vi viser resterende liv nederst til højre med skibsikoner ![liv billede](../../../../translated_images/life.6fb9f50d53ee0413.da.png). +- **Livstæller**: Din helt starter med tre liv - en standard etableret af tidlige arkadespil for at balancere udfordring med spilbarhed. Hver kollision med en fjende koster et liv. Vi viser resterende liv nederst til højre med skibsikoner ![liv billede](../../../../translated_images/da/life.6fb9f50d53ee0413.png). ## Lad os komme i gang! diff --git a/translations/da/7-bank-project/1-template-route/README.md b/translations/da/7-bank-project/1-template-route/README.md index 3a19772cc..1e60e7477 100644 --- a/translations/da/7-bank-project/1-template-route/README.md +++ b/translations/da/7-bank-project/1-template-route/README.md @@ -644,7 +644,7 @@ sequenceDiagram Brug af `history.pushState` skaber nye poster i browserens navigationshistorik. Du kan tjekke det ved at holde *tilbage-knappen* på din browser nede; den skulle vise noget som dette: -![Screenshot of navigation history](../../../../translated_images/history.7fdabbafa521e064.da.png) +![Screenshot of navigation history](../../../../translated_images/da/history.7fdabbafa521e064.png) Hvis du prøver at klikke tilbage-knappen et par gange, vil du se, at den aktuelle URL ændres, og historikken opdateres, men den samme template bliver ved med at blive vist. diff --git a/translations/da/7-bank-project/2-forms/README.md b/translations/da/7-bank-project/2-forms/README.md index c0b30f56a..3805de04d 100644 --- a/translations/da/7-bank-project/2-forms/README.md +++ b/translations/da/7-bank-project/2-forms/README.md @@ -292,7 +292,7 @@ Først, lad os observere hvad der sker ved basal formularafsendelse: 2. Observer ændringerne i din browsers adressebjælke 3. Læg mærke til, hvordan siden genindlæses og data vises i URL’en -![Skærmbillede af browserens URL-ændring efter klik på Registrer-knappen](../../../../translated_images/click-register.e89a30bf0d4bc9ca.da.png) +![Skærmbillede af browserens URL-ændring efter klik på Registrer-knappen](../../../../translated_images/da/click-register.e89a30bf0d4bc9ca.png) ### HTTP Metoder Sammenligning @@ -346,7 +346,7 @@ Lad os sætte din registreringsformular til at kommunikere korrekt med backend A 2. **Klik** på "Opret Konto" knappen 3. **Observer** serverens svar i din browser -![Et browservindue på adressen localhost:5000/api/accounts, der viser en JSON streng med brugerdata](../../../../translated_images/form-post.61de4ca1b964d91a.da.png) +![Et browservindue på adressen localhost:5000/api/accounts, der viser en JSON streng med brugerdata](../../../../translated_images/da/form-post.61de4ca1b964d91a.png) **Det du bør se:** - **Browseren omdirigerer** til API endpoint URL’en @@ -609,7 +609,7 @@ async function register() { 3. **Klik** på "Opret konto" 4. **Observer** konsolmeddelelser og brugerfeedback -![Screenshot showing log message in the browser console](../../../../translated_images/browser-console.efaf0b51aaaf6778.da.png) +![Screenshot showing log message in the browser console](../../../../translated_images/da/browser-console.efaf0b51aaaf6778.png) **Det du bør se:** - **Indlæsningsstatus** vises på submit-knappen @@ -783,7 +783,7 @@ Lad os forbedre din registreringsformular med robust validering, der giver fremr 3. **Prøv** specialtegn i brugernavnfeltet 4. **Indtast** et negativt beløb i saldo-feltet -![Screenshot showing the validation error when trying to submit the form](../../../../translated_images/validation-error.8bd23e98d416c22f.da.png) +![Screenshot showing the validation error when trying to submit the form](../../../../translated_images/da/validation-error.8bd23e98d416c22f.png) **Det du vil observere:** - **Browseren viser** native valideringsmeddelelser @@ -943,7 +943,7 @@ Vis en fejlmeddelelse i HTML, hvis brugeren allerede eksisterer. Her er et eksempel på, hvordan den endelige login-side kan se ud efter lidt styling: -![Screenshot of the login page after adding CSS styles](../../../../translated_images/result.96ef01f607bf856a.da.png) +![Screenshot of the login page after adding CSS styles](../../../../translated_images/da/result.96ef01f607bf856a.png) ## Post-Lecture Quiz diff --git a/translations/da/7-bank-project/3-data/README.md b/translations/da/7-bank-project/3-data/README.md index 7901cdf0c..26c27c78d 100644 --- a/translations/da/7-bank-project/3-data/README.md +++ b/translations/da/7-bank-project/3-data/README.md @@ -156,7 +156,7 @@ sequenceDiagram Server->>Browser: Returnerer komplet HTML-side Browser->>User: Viser ny side (flash/genindlæsning) ``` -![Opdateringsworkflow i en multi-side applikation](../../../../translated_images/mpa.7f7375a1a2d4aa77.da.png) +![Opdateringsworkflow i en multi-side applikation](../../../../translated_images/da/mpa.7f7375a1a2d4aa77.png) **Hvorfor denne tilgang føltes klodset:** - Hvert klik betød, at hele siden skulle bygges op fra bunden @@ -182,7 +182,7 @@ sequenceDiagram JavaScript->>Browser: Opdaterer specifikke sideelementer Browser->>User: Viser opdateret indhold (ingen genindlæsning) ``` -![Opdateringsworkflow i en single-page applikation](../../../../translated_images/spa.268ec73b41f992c2.da.png) +![Opdateringsworkflow i en single-page applikation](../../../../translated_images/da/spa.268ec73b41f992c2.png) **Hvorfor SPAs føles meget bedre:** - Kun de dele, der rent faktisk ændrer sig, opdateres (smart, ikke?) @@ -516,7 +516,7 @@ if (data.error) { Når du nu tester med en ugyldig konto, vil du se en hjælpsom fejlmeddelelse direkte på siden! -![Screenshot showing the error message displayed during login](../../../../translated_images/login-error.416fe019b36a6327.da.png) +![Screenshot showing the error message displayed during login](../../../../translated_images/da/login-error.416fe019b36a6327.png) #### Trin 4: Vær inkluderende med tilgængelighed @@ -950,7 +950,7 @@ Klar til at tage din bankapp til næste niveau? Lad os få den til at se ud og f Sådan kunne et poleret dashboard se ud: -![Screenshot of an example result of the dashboard after styling](../../../../translated_images/screen2.123c82a831a1d14a.da.png) +![Screenshot of an example result of the dashboard after styling](../../../../translated_images/da/screen2.123c82a831a1d14a.png) Føl dig ikke forpligtet til at matche det præcist – brug det som inspiration og gør det til dit eget! diff --git a/translations/da/7-bank-project/4-state-management/README.md b/translations/da/7-bank-project/4-state-management/README.md index f98676aa9..ccf42e95b 100644 --- a/translations/da/7-bank-project/4-state-management/README.md +++ b/translations/da/7-bank-project/4-state-management/README.md @@ -187,7 +187,7 @@ Som Titanics afdelingsopdeling, der virkede robust indtil flere skibsrum pludsel I stedet for at løbe i ring, vil vi skabe et **centraliseret tilstandsstyringssystem**. Tænk på det som én virkelig organiseret person, der har ansvaret for alt det vigtige: -![Schema showing the data flows between the HTML, user actions and state](../../../../translated_images/data-flow.fa2354e0908fecc8.da.png) +![Schema showing the data flows between the HTML, user actions and state](../../../../translated_images/da/data-flow.fa2354e0908fecc8.png) ```mermaid flowchart TD @@ -798,7 +798,7 @@ Denne udfordring hjælper dig med at tænke som en professionel udvikler, som b Her er et eksempel på resultat efter opgaven er gennemført: -![Screenshot viser et eksempel på dialogen "Tilføj transaktion"](../../../../translated_images/dialog.93bba104afeb79f1.da.png) +![Screenshot viser et eksempel på dialogen "Tilføj transaktion"](../../../../translated_images/da/dialog.93bba104afeb79f1.png) --- diff --git a/translations/da/7-bank-project/4-state-management/assignment.md b/translations/da/7-bank-project/4-state-management/assignment.md index 9e13ad1cb..3875ff42d 100644 --- a/translations/da/7-bank-project/4-state-management/assignment.md +++ b/translations/da/7-bank-project/4-state-management/assignment.md @@ -112,7 +112,7 @@ Se [server-API-dokumentationen](../api/README.md) for: **Forventet resultat:** Efter at have fuldført denne opgave, bør din bankapp have en fuldt funktionel "Tilføj Transaktion"-funktion, der ser professionel ud og fungerer perfekt: -![Skærmbillede, der viser et eksempel på "Tilføj transaktion"-dialog](../../../../translated_images/dialog.93bba104afeb79f1.da.png) +![Skærmbillede, der viser et eksempel på "Tilføj transaktion"-dialog](../../../../translated_images/da/dialog.93bba104afeb79f1.png) ## Test af din implementering diff --git a/translations/da/7-bank-project/README.md b/translations/da/7-bank-project/README.md index ac56bb021..f44812ac3 100644 --- a/translations/da/7-bank-project/README.md +++ b/translations/da/7-bank-project/README.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: I dette projekt lærer du, hvordan du bygger en fiktiv bank. Disse lektioner inkluderer instruktioner om, hvordan du opbygger en webapp med layout og ruter, bygger formularer, håndterer tilstand og henter data fra en API, hvorfra du kan hente bankens data. -| ![Screen1](../../../translated_images/screen1.baccbba0f1f93364.da.png) | ![Screen2](../../../translated_images/screen2.123c82a831a1d14a.da.png) | +| ![Screen1](../../../translated_images/da/screen1.baccbba0f1f93364.png) | ![Screen2](../../../translated_images/da/screen2.123c82a831a1d14a.png) | |--------------------------------|--------------------------------| ## Lektioner diff --git a/translations/da/8-code-editor/1-using-a-code-editor/README.md b/translations/da/8-code-editor/1-using-a-code-editor/README.md index fe4aa11fd..c372b5872 100644 --- a/translations/da/8-code-editor/1-using-a-code-editor/README.md +++ b/translations/da/8-code-editor/1-using-a-code-editor/README.md @@ -182,7 +182,7 @@ Ligesom Alexander Graham Bells telefon forbandt fjerne steder, forbinder det at Når alt er indlæst, vil du se et smukt rent arbejdsområde designet til at holde dig fokuseret på det, der betyder noget – din kode! -![Default VSCode.dev interface](../../../../translated_images/default-vscode-dev.5d06881d65c1b323.da.png) +![Default VSCode.dev interface](../../../../translated_images/da/default-vscode-dev.5d06881d65c1b323.png) **Her er din rundvisning i nabolaget:** - **Aktivitetslinje** (den stribe til venstre): Din primære navigation med Explorer 📁, Søg 🔍, Kildekontrol 🌿, Extensions 🧩 og Indstillinger ⚙️ @@ -229,7 +229,7 @@ Den er perfekt, når du starter frisk i VSCode.dev og vil åbne et specifikt rep 1. Gå til [vscode.dev](https://vscode.dev), hvis du ikke allerede er der 2. Find knappen "Open Remote Repository" på velkomstskærmen og klik på den - ![Open remote repository](../../../../translated_images/open-remote-repository.bd9c2598b8949e7f.da.png) + ![Open remote repository](../../../../translated_images/da/open-remote-repository.bd9c2598b8949e7f.png) 3. Indsæt en hvilken som helst GitHub repository URL (prøv denne: `https://github.com/microsoft/Web-Dev-For-Beginners`) 4. Tryk Enter og se magien ske! @@ -238,7 +238,7 @@ Den er perfekt, når du starter frisk i VSCode.dev og vil åbne et specifikt rep Vil du føle dig som en kode-troldmand? Prøv denne tastaturgenvej: Ctrl+Shift+P (eller Cmd+Shift+P på Mac) for at åbne Kommandopalletten: -![Command Palette](../../../../translated_images/palette-menu.4946174e07f42622.da.png) +![Command Palette](../../../../translated_images/da/palette-menu.4946174e07f42622.png) **Kommandopalletten er som en søgemaskine til alt, hvad du kan gøre:** - Skriv "open remote" og den finder repository-åbneren for dig @@ -300,7 +300,7 @@ Ligesom at organisere blåtryk på en arkitekts kontor følger filoprettelse i V 3. Indtast filnavnet inklusive den korrekte filendelse (`style.css`, `script.js`, `index.html`) 4. Tryk Enter for at oprette filen -![Creating a new file](../../../../translated_images/create-new-file.2814e609c2af9aeb.da.png) +![Creating a new file](../../../../translated_images/da/create-new-file.2814e609c2af9aeb.png) **Navngivningskonventioner:** - Brug beskrivende navne, der angiver filens formål @@ -318,7 +318,7 @@ Her begynder det sjove! VSCode.dev’s editor er fyldt med hjælpsomme funktione 2. Begynd at skrive og se, hvordan VSCode.dev hjælper dig med farver, forslag og fejlregistrering 3. Gem dit arbejde med Ctrl+S (Windows/Linux) eller Cmd+S (Mac) – selvom det også autosaves! -![Editing files in VSCode.dev](../../../../translated_images/edit-a-file.52c0ee665ef19f08.da.png) +![Editing files in VSCode.dev](../../../../translated_images/da/edit-a-file.52c0ee665ef19f08.png) **De seje ting, der sker under kodning:** - Din kode bliver smukt farvekodet, så den er nem at læse @@ -339,7 +339,7 @@ Ligesom arkæologer laver detaljerede optegnelser over udgravningslag, sporer Gi 2. Ændrede filer vises i sektionen "Ændringer" 3. Farvekodning angiver ændringstyper: grøn for tilføjelser, rød for sletninger -![Viewing changes in Source Control](../../../../translated_images/working-tree.c58eec08e6335c79.da.png) +![Viewing changes in Source Control](../../../../translated_images/da/working-tree.c58eec08e6335c79.png) **Gem dit arbejde (commit-arbejdsgang):** @@ -431,7 +431,7 @@ Udvidelsesmarkedspladsen er virkelig godt organiseret, så du ikke mister overbl 2. Gå på opdagelse eller søg efter noget specifikt 3. Klik på alt, der ser interessant ud for at lære mere om det -![Extension marketplace interface](../../../../translated_images/extensions.eca0e0c7f59a10b5.da.png) +![Extension marketplace interface](../../../../translated_images/da/extensions.eca0e0c7f59a10b5.png) **Det vil du se derinde:** @@ -484,7 +484,7 @@ De fleste udvidelser kommer med indstillinger, som du kan justere, så de funger 3. Vælg "Extension Settings" i dropdown-menuen 4. Juster ting, indtil det passer perfekt til dit workflow -![Customizing extension settings](../../../../translated_images/extension-settings.21c752ae4f4cdb78.da.png) +![Customizing extension settings](../../../../translated_images/da/extension-settings.21c752ae4f4cdb78.png) **Almindelige ting, du måske vil justere:** - Hvordan din kode formateres (tabs vs mellemrum, linjelængde osv.) diff --git a/translations/da/8-code-editor/1-using-a-code-editor/assignment.md b/translations/da/8-code-editor/1-using-a-code-editor/assignment.md index e7f287144..de48d4fb1 100644 --- a/translations/da/8-code-editor/1-using-a-code-editor/assignment.md +++ b/translations/da/8-code-editor/1-using-a-code-editor/assignment.md @@ -78,7 +78,7 @@ Da VSCode.dev kræver mindst én fil for at åbne et repository, opretter vi vor 4. **Skriv** en commit-besked: "Tilføj indledende HTML-struktur" 5. **Klik** på "Commit new file" for at gemme dine ændringer -![Oprettelse af indledende fil på GitHub](../../../../translated_images/new-file-github.com.c886796d800e8056.da.png) +![Oprettelse af indledende fil på GitHub](../../../../translated_images/da/new-file-github.com.c886796d800e8056.png) **Dette opnår den indledende opsætning:** - **Etablerer** korrekt HTML5-dokumentstruktur med semantiske elementer @@ -104,7 +104,7 @@ Nu hvor fundamentet for dit repository er etableret, lad os skifte til VSCode.de ✅ **Succesindikator**: Du bør se dine projektfiler i Explorer-sidepanelet og `index.html` tilgængelig for redigering i hovededitorområdet. -![Projekt indlæst i VSCode.dev](../../../../translated_images/project-on-vscode.dev.e79815a9a95ee7fe.da.png) +![Projekt indlæst i VSCode.dev](../../../../translated_images/da/project-on-vscode.dev.e79815a9a95ee7fe.png) **Hvad du vil se i grænsefladen:** - **Explorer-sidepanel**: **Viser** dine repository-filer og mappestruktur @@ -448,7 +448,7 @@ Udvidelser forbedrer din udviklingsoplevelse ved at give live preview-muligheder **Umiddelbare resultater efter installation:** Når CodeSwing er installeret, vil du se et live preview af din CV-hjemmeside vises i editoren. Dette giver dig mulighed for at se præcis, hvordan din side ser ud, mens du foretager ændringer. -![CodeSwing-udvidelse viser live preview](../../../../translated_images/after-codeswing-extension-pb.0ebddddcf73b5509.da.png) +![CodeSwing-udvidelse viser live preview](../../../../translated_images/da/after-codeswing-extension-pb.0ebddddcf73b5509.png) **Forstå den forbedrede grænseflade:** - **Split view**: **Viser** din kode på den ene side og live preview på den anden diff --git a/translations/da/9-chat-project/README.md b/translations/da/9-chat-project/README.md index a2a9fa456..6f8eb9c71 100644 --- a/translations/da/9-chat-project/README.md +++ b/translations/da/9-chat-project/README.md @@ -60,7 +60,7 @@ print(response.choices[0].message.content) Sådan vil dit færdige projekt se ud: -![Chat app interface showing conversation between user and AI assistant](../../../translated_images/screenshot.0a1ee0d123df681b.da.png) +![Chat app interface showing conversation between user and AI assistant](../../../translated_images/da/screenshot.0a1ee0d123df681b.png) ## 🗺️ Din Læringsrejse Gennem AI-applikationsudvikling @@ -189,7 +189,7 @@ mindmap ``` **Kerneprincip**: AI-applikationsudvikling kombinerer traditionelle webudviklingsfærdigheder med AI-tjenesteintegration for at skabe intelligente applikationer, der føles naturlige og responsive for brugerne. -![GitHub Models AI Playground interface with model selection and testing area](../../../translated_images/playground.d2b927122224ff8f.da.png) +![GitHub Models AI Playground interface with model selection and testing area](../../../translated_images/da/playground.d2b927122224ff8f.png) **Det der gør playground så nyttig:** - **Prøv** forskellige AI-modeller som GPT-4o-mini, Claude og andre (alle gratis!) @@ -199,7 +199,7 @@ mindmap Når du har prøvet lidt, klik bare på fanen "Code" og vælg dit programmersprog for at få den nødvendige implementeringskode. -![Playground choice showing code generation options for different programming languages](../../../translated_images/playground-choice.1d23ba7d407f4758.da.png) +![Playground choice showing code generation options for different programming languages](../../../translated_images/da/playground-choice.1d23ba7d407f4758.png) ## Opsætning af Python Backend Integration @@ -2352,14 +2352,14 @@ Vil du prøve dette projekt i et cloud-udviklingsmiljø? GitHub Codespaces lever - **Naviger** til [Web Dev For Beginners repository](https://github.com/microsoft/Web-Dev-For-Beginners) - **Klik** på "Use this template" i øverste højre hjørne (sørg for at være logget ind på GitHub) -![Create from template interface showing the green "Use this template" button](../../../translated_images/template.67ad477109d29a2b.da.png) +![Create from template interface showing the green "Use this template" button](../../../translated_images/da/template.67ad477109d29a2b.png) **Trin 2: Start Codespaces** - **Åbn** dit nyoprettede repository - **Klik** på den grønne "Code" knap, og vælg "Codespaces" - **Vælg** "Create codespace on main" for at starte dit udviklingsmiljø -![Create codespace interface with options for launching cloud development environment](../../../translated_images/codespace.bcecbdf5d2747d3d.da.png) +![Create codespace interface with options for launching cloud development environment](../../../translated_images/da/codespace.bcecbdf5d2747d3d.png) **Trin 3: Miljøkonfiguration** Når din Codespace indlæses, får du adgang til: diff --git a/translations/da/README.md b/translations/da/README.md index 4c1354407..22aacb6d6 100644 --- a/translations/da/README.md +++ b/translations/da/README.md @@ -72,13 +72,13 @@ Gå ikke glip af vores nye Generativ AI-læseplan! Besøg [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) for at komme i gang! -![Background](../../translated_images/background.148a8d43afde5730.da.png) +![Background](../../translated_images/da/background.148a8d43afde5730.png) - Lektioner der dækker alt fra grundlæggende til RAG. - Interager med historiske personer ved hjælp af GenAI og vores ledsagerapp. - Sjov og engagerende fortælling, du kommer til at tidsrejse! -![character](../../translated_images/character.5c0dd8e067ffd693.da.png) +![character](../../translated_images/da/character.5c0dd8e067ffd693.png) Hver lektion inkluderer en opgave, en vidensprøve og en udfordring, der guider dig gennem læring af emner som: @@ -115,7 +115,7 @@ Følg disse trin: I din kopi af dette repository som du har oprettet, klik på **Code** knappen og vælg **Open with Codespaces**. Det vil oprette en ny Codespace til dig at arbejde i. -![Codespace](../../translated_images/createcodespace.0238bbf4d7a8d955.da.png) +![Codespace](../../translated_images/da/createcodespace.0238bbf4d7a8d955.png) #### Kør læseplanen lokalt på din computer diff --git a/translations/da/for-teachers.md b/translations/da/for-teachers.md index 8f009bb10..60108e264 100644 --- a/translations/da/for-teachers.md +++ b/translations/da/for-teachers.md @@ -42,10 +42,10 @@ Dette pensum inkluderer importbare pakker til almindelige LMS-arbejdsgange. - Moodle Cloud har begrænset Common Cartridge-support. Foretræk Moodle-filen ovenfor, som også kan uploades til Canvas. - Efter import, gennemgå moduler, deadlines og quizindstillinger for at matche din terminsplan. -![Moodle](../../translated_images/moodle.94eb93d714a50cb2.da.png) +![Moodle](../../translated_images/da/moodle.94eb93d714a50cb2.png) > Pensum i et Moodle-klasselokale -![Canvas](../../translated_images/canvas.fbd605ff8e5b8aff.da.png) +![Canvas](../../translated_images/da/canvas.fbd605ff8e5b8aff.png) > Pensum i Canvas ### Brug repoet direkte (uden Classroom) diff --git a/translations/de/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/de/1-getting-started-lessons/1-intro-to-programming-languages/README.md index f2d2c9279..954534792 100644 --- a/translations/de/1-getting-started-lessons/1-intro-to-programming-languages/README.md +++ b/translations/de/1-getting-started-lessons/1-intro-to-programming-languages/README.md @@ -17,7 +17,7 @@ Schau mal, ich kann total nachvollziehen, wenn Programmieren gerade einschüchte Heute werden wir die unglaublichen Werkzeuge erkunden, die moderne Webentwicklung nicht nur möglich, sondern richtig süchtig machend machen. Ich spreche von genau denselben Editoren, Browsern und Workflows, die Entwickler bei Netflix, Spotify und deinem Lieblings-Indie-App-Studio jeden einzelnen Tag verwenden. Und hier kommt der Teil, der dich einen Freudentanz machen lässt: Die meisten dieser professionellen, industrieweiten Werkzeuge sind komplett kostenlos! -![Intro Programming](../../../../translated_images/webdev101-programming.d6e3f98e61ac4bff.de.png) +![Intro Programming](../../../../translated_images/de/webdev101-programming.d6e3f98e61ac4bff.webp) > Sketchnote von [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid diff --git a/translations/de/1-getting-started-lessons/2-github-basics/README.md b/translations/de/1-getting-started-lessons/2-github-basics/README.md index 2df1bc25b..57317faed 100644 --- a/translations/de/1-getting-started-lessons/2-github-basics/README.md +++ b/translations/de/1-getting-started-lessons/2-github-basics/README.md @@ -17,7 +17,7 @@ Ich weiß, das fühlt sich am Anfang vielleicht nach viel an – ich erinnere mi Wir werden diese Reise zusammen gehen, Schritt für Schritt. Kein Stress, kein Druck – nur du, ich und ein paar wirklich coole Tools, die deine neuen besten Freunde werden! -![Intro to GitHub](../../../../translated_images/webdev101-github.8846d7971abef6f9.de.png) +![Intro to GitHub](../../../../translated_images/de/webdev101-github.8846d7971abef6f9.webp) > Sketchnote von [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid @@ -604,7 +604,7 @@ Finde zunächst ein Repository (oder **Repo**) auf GitHub, das dich interessiert ✅ Eine gute Möglichkeit, 'anfängerfreundliche' Repos zu finden, ist die [Suche nach dem Label 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/). -![Kopiere ein Repository lokal](../../../../translated_images/clone_repo.5085c48d666ead57.de.png) +![Kopiere ein Repository lokal](../../../../translated_images/de/clone_repo.5085c48d666ead57.webp) Es gibt verschiedene Wege, um Code zu kopieren. Eine Möglichkeit ist, die Inhalte des Repositories zu "klonen", per HTTPS, SSH oder mit der GitHub CLI (Command Line Interface). diff --git a/translations/de/1-getting-started-lessons/3-accessibility/README.md b/translations/de/1-getting-started-lessons/3-accessibility/README.md index 4088178f4..ca3105ad5 100644 --- a/translations/de/1-getting-started-lessons/3-accessibility/README.md +++ b/translations/de/1-getting-started-lessons/3-accessibility/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # Erstellen barrierefreier Webseiten -![Alles über Barrierefreiheit](../../../../translated_images/webdev101-a11y.8ef3025c858d897a.de.png) +![Alles über Barrierefreiheit](../../../../translated_images/de/webdev101-a11y.8ef3025c858d897a.webp) > Sketchnote von [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid @@ -1049,12 +1049,12 @@ Jedes Bild auf Ihrer Website erfüllt einen Zweck. Die Kenntnis dieses Zwecks hi **Informative Bilder** – vermitteln wichtige Informationen: ```html -Sales increased 25% from Q1 to Q2 2024 +Sales increased 25% from Q1 to Q2 2024 ``` **Dekorative Bilder** – rein visuell ohne Informationswert: ```html - + ``` **Funktionale Bilder** – dienen als Schaltflächen oder Steuerungen: @@ -1066,7 +1066,7 @@ Jedes Bild auf Ihrer Website erfüllt einen Zweck. Die Kenntnis dieses Zwecks hi **Komplexe Bilder** – Diagramme, Grafiken, Infografiken: ```html -Quarterly sales data +Quarterly sales data

Detailed description: Sales data shows a steady increase across all quarters...

@@ -1106,7 +1106,7 @@ Jedes Bild auf Ihrer Website erfüllt einen Zweck. Die Kenntnis dieses Zwecks hi - Website traffic increased 40% after accessibility improvements + Website traffic increased 40% after accessibility improvements ``` diff --git a/translations/de/2-js-basics/1-data-types/README.md b/translations/de/2-js-basics/1-data-types/README.md index c596e40f7..df7282bca 100644 --- a/translations/de/2-js-basics/1-data-types/README.md +++ b/translations/de/2-js-basics/1-data-types/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript Grundlagen: Datentypen -![JavaScript Grundlagen - Datentypen](../../../../translated_images/webdev101-js-datatypes.4cc470179730702c.de.png) +![JavaScript Grundlagen - Datentypen](../../../../translated_images/de/webdev101-js-datatypes.4cc470179730702c.webp) > Sketchnote von [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid diff --git a/translations/de/2-js-basics/2-functions-methods/README.md b/translations/de/2-js-basics/2-functions-methods/README.md index bbf260c3d..1a75ff1c0 100644 --- a/translations/de/2-js-basics/2-functions-methods/README.md +++ b/translations/de/2-js-basics/2-functions-methods/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript-Grundlagen: Methoden und Funktionen -![JavaScript Basics - Functions](../../../../translated_images/webdev101-js-functions.be049c4726e94f8b.de.png) +![JavaScript Basics - Functions](../../../../translated_images/de/webdev101-js-functions.be049c4726e94f8b.webp) > Sketchnote von [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid diff --git a/translations/de/2-js-basics/3-making-decisions/README.md b/translations/de/2-js-basics/3-making-decisions/README.md index 15878463f..864eb817c 100644 --- a/translations/de/2-js-basics/3-making-decisions/README.md +++ b/translations/de/2-js-basics/3-making-decisions/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript-Grundlagen: Treffen von Entscheidungen -![JavaScript Basics - Entscheidungen treffen](../../../../translated_images/webdev101-js-decisions.69e1b20f272dd1f0.de.png) +![JavaScript Basics - Entscheidungen treffen](../../../../translated_images/de/webdev101-js-decisions.69e1b20f272dd1f0.webp) > Sketchnote von [Tomomi Imura](https://twitter.com/girlie_mac) diff --git a/translations/de/2-js-basics/4-arrays-loops/README.md b/translations/de/2-js-basics/4-arrays-loops/README.md index a7a2adb2f..7a39c9812 100644 --- a/translations/de/2-js-basics/4-arrays-loops/README.md +++ b/translations/de/2-js-basics/4-arrays-loops/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript Grundlagen: Arrays und Schleifen -![JavaScript Basics - Arrays](../../../../translated_images/webdev101-js-arrays.439d7528b8a29455.de.png) +![JavaScript Basics - Arrays](../../../../translated_images/de/webdev101-js-arrays.439d7528b8a29455.webp) > Sketchnote von [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid diff --git a/translations/de/3-terrarium/1-intro-to-html/README.md b/translations/de/3-terrarium/1-intro-to-html/README.md index 9124b1bd3..10910a3fa 100644 --- a/translations/de/3-terrarium/1-intro-to-html/README.md +++ b/translations/de/3-terrarium/1-intro-to-html/README.md @@ -25,7 +25,7 @@ journey Barrierefreiheit verbessern: 5: Student Terrarium bauen: 5: Student ``` -![Einführung in HTML](../../../../translated_images/webdev101-html.4389c2067af68e98.de.png) +![Einführung in HTML](../../../../translated_images/de/webdev101-html.4389c2067af68e98.webp) > Sketchnote von [Tomomi Imura](https://twitter.com/girlie_mac) HTML, oder HyperText Markup Language, ist die Grundlage jeder Website, die du je besucht hast. Betrachte HTML als das Skelett, das Webseiten Struktur verleiht – es definiert, wo Inhalte platziert werden, wie sie organisiert sind und was jeder Abschnitt repräsentiert. Während CSS später dein HTML mit Farben und Layouts „einkleidet“ und JavaScript es mit Interaktivität zum Leben erweckt, liefert HTML die wesentliche Struktur, die alles andere möglich macht. @@ -86,7 +86,7 @@ Du legst einen dedizierten Ordner für dein Terrarium-Projekt an und fügst dein 4. Klicke im Explorer-Bereich auf das Symbol „Neue Datei“ 5. Benenne deine Datei `index.html` -![VS Code Explorer zeigt Neuerstellung Datei](../../../../translated_images/vs-code-index.e2986cf919471eb9.de.png) +![VS Code Explorer zeigt Neuerstellung Datei](../../../../translated_images/de/vs-code-index.e2986cf919471eb9.webp) **Option 2: Mit Terminal-Befehlen** ```bash @@ -236,48 +236,48 @@ Füge jetzt die Pflanzenbilder, organisiert in zwei Spalten, zwischen deine `
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
diff --git a/translations/de/3-terrarium/2-intro-to-css/README.md b/translations/de/3-terrarium/2-intro-to-css/README.md index 25f1406e0..fc7353134 100644 --- a/translations/de/3-terrarium/2-intro-to-css/README.md +++ b/translations/de/3-terrarium/2-intro-to-css/README.md @@ -29,7 +29,7 @@ journey Responsives Design: 5: Student Glasreflexionen: 5: Student ``` -![Einführung in CSS](../../../../translated_images/webdev101-css.3f7af5991bf53a20.de.png) +![Einführung in CSS](../../../../translated_images/de/webdev101-css.3f7af5991bf53a20.webp) > Sketchnote von [Tomomi Imura](https://twitter.com/girlie_mac) Erinnere dich daran, wie dein HTML-Terrarium ziemlich einfach aussah? CSS ist der Bereich, in dem wir diese schlichte Struktur in etwas Visuell Ansprechendes verwandeln. @@ -202,7 +202,7 @@ body { Öffne die Entwickler-Tools deines Browsers (F12), gehe zum Tab „Elemente“ und inspiziere dein `

`-Element. Du wirst sehen, dass es die Schriftfamilie vom Body erbt: -![inherente Schrift](../../../../translated_images/1.cc07a5cbe114ad1d.de.png) +![inherente Schrift](../../../../translated_images/de/1.cc07a5cbe114ad1d.webp) ✅ **Experimentierzeit**: Versuche andere vererbbare Eigenschaften auf dem `` wie `color`, `line-height` oder `text-align` zu setzen. Was passiert mit deiner Überschrift und anderen Elementen? @@ -332,7 +332,7 @@ In unserem Terrarium braucht jede Pflanze ein ähnliches Styling, aber auch indi **Hier ist die HTML-Struktur für jede Pflanze:** ```html
- Decorative plant for terrarium + Decorative plant for terrarium
``` @@ -594,7 +594,7 @@ Bereit, dein Terrarium mit realistischen Glasreflexen aufzuwerten? Diese Technik Du erzeugst subtile Highlights, die simulieren, wie Licht auf Glasflächen reflektiert wird. Dieser Ansatz ähnelt Renaissance-Malern wie Jan van Eyck, die Licht und Reflexion nutzten, um gemaltes Glas dreidimensional wirken zu lassen. Hier ist dein Ziel: -![fertiges Terrarium](../../../../translated_images/terrarium-final.2f07047ffc597d0a.de.png) +![fertiges Terrarium](../../../../translated_images/de/terrarium-final.2f07047ffc597d0a.webp) **Deine Aufgabe:** - **Erstelle** dezente weiße oder hellfarbige ovale Formen für die Glasreflexe diff --git a/translations/de/3-terrarium/3-intro-to-DOM-and-closures/README.md b/translations/de/3-terrarium/3-intro-to-DOM-and-closures/README.md index b76be84db..a528dab6c 100644 --- a/translations/de/3-terrarium/3-intro-to-DOM-and-closures/README.md +++ b/translations/de/3-terrarium/3-intro-to-DOM-and-closures/README.md @@ -25,7 +25,7 @@ journey Funktionalität testen: 5: Student Terrarium abschließen: 5: Student ``` -![DOM und eine Closure](../../../../translated_images/webdev101-js.10280393044d7eaa.de.png) +![DOM und eine Closure](../../../../translated_images/de/webdev101-js.10280393044d7eaa.webp) > Sketchnote von [Tomomi Imura](https://twitter.com/girlie_mac) Willkommen zu einem der faszinierendsten Aspekte der Webentwicklung – Dinge interaktiv zu machen! Das Document Object Model (DOM) ist wie eine Brücke zwischen deinem HTML und JavaScript, und heute werden wir es nutzen, um dein Terrarium zum Leben zu erwecken. Als Tim Berners-Lee den ersten Webbrowser entwickelte, stellte er sich ein Web vor, in dem Dokumente dynamisch und interaktiv sein könnten – das DOM macht diese Vision möglich. @@ -102,7 +102,7 @@ flowchart TD style P fill:#ffebee style Q fill:#ffebee ``` -![DOM-Baum-Darstellung](../../../../translated_images/dom-tree.7daf0e763cbbba92.de.png) +![DOM-Baum-Darstellung](../../../../translated_images/de/dom-tree.7daf0e763cbbba92.webp) > Eine Darstellung des DOM und des HTML-Markups, das darauf verweist. Von [Olfa Nasraoui](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites) @@ -146,7 +146,7 @@ flowchart LR ``` > 💡 **Closures verstehen**: Closures sind ein bedeutendes Thema in JavaScript, und viele Entwickler nutzen sie jahrelang, bevor sie alle theoretischen Aspekte vollständig verstehen. Heute konzentrieren wir uns auf die praktische Anwendung – du wirst sehen, wie Closures ganz natürlich entstehen, während wir unsere interaktiven Funktionen bauen. Das Verständnis wird sich vertiefen, wenn du siehst, wie sie echte Probleme lösen. -![DOM-Baum-Darstellung](../../../../translated_images/dom-tree.7daf0e763cbbba92.de.png) +![DOM-Baum-Darstellung](../../../../translated_images/de/dom-tree.7daf0e763cbbba92.webp) > Eine Darstellung des DOM und des HTML-Markups, das darauf verweist. Von [Olfa Nasraoui](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites) @@ -591,7 +591,7 @@ Teste jetzt dein interaktives Terrarium! Öffne deine `index.html` Datei in eine - **Geräteübergreifende Unterstützung**: Funktioniert auf Desktop und Mobilgeräten - **Leistungsbewusstsein**: Keine Speicherlecks oder redundante Berechnungen -![fertiges Terrarium](../../../../translated_images/terrarium-final.0920f16e87c13a84.de.png) +![fertiges Terrarium](../../../../translated_images/de/terrarium-final.0920f16e87c13a84.webp) --- diff --git a/translations/de/5-browser-extension/1-about-browsers/README.md b/translations/de/5-browser-extension/1-about-browsers/README.md index 44de028e5..dfa1fa52e 100644 --- a/translations/de/5-browser-extension/1-about-browsers/README.md +++ b/translations/de/5-browser-extension/1-about-browsers/README.md @@ -25,7 +25,7 @@ journey Probleme debuggen: 4: Student Benutzererlebnis optimieren: 5: Student ``` -![Browser sketchnote](../../../../translated_images/browser.60317c9be8b7f84a.de.jpg) +![Browser sketchnote](../../../../translated_images/de/browser.60317c9be8b7f84a.webp) > Sketchnote von [Wassim Chegham](https://dev.to/wassimchegham/ever-wondered-what-happens-when-you-type-in-a-url-in-an-address-bar-in-a-browser-3dob) ## Pre-Lecture Quiz @@ -77,7 +77,7 @@ Dieser Prozess spiegelt wider, wie der erste Webbrowser, WorldWideWeb, von Tim B ✅ **Ein wenig Geschichte**: Der erste Browser hieß 'WorldWideWeb' und wurde 1990 von Sir Timothy Berners-Lee geschaffen. -![early browsers](../../../../translated_images/earlybrowsers.d984b711cdf3a42d.de.jpg) +![early browsers](../../../../translated_images/de/earlybrowsers.d984b711cdf3a42d.webp) > Einige frühe Browser, via [Karen McGrane](https://www.slideshare.net/KMcGrane/week-4-ixd-history-personal-computing) ### Wie Browser Webinhalte verarbeiten @@ -194,7 +194,7 @@ quadrantChart Das Verständnis des Installationsprozesses von Erweiterungen hilft Ihnen, die Nutzererfahrung beim Installieren Ihrer Erweiterung besser zu verstehen. Der Installationsprozess ist bei modernen Browsern standardisiert, mit geringfügigen Unterschieden im Interface-Design. -![Screenshot des Edge-Browsers, der die geöffnete Seite edge://extensions und das geöffnete Einstellungsmenü zeigt](../../../../translated_images/install-on-edge.d68781acaf0b3d3d.de.png) +![Screenshot des Edge-Browsers, der die geöffnete Seite edge://extensions und das geöffnete Einstellungsmenü zeigt](../../../../translated_images/de/install-on-edge.d68781acaf0b3d3d.webp) > **Wichtig**: Aktivieren Sie beim Testen eigener Erweiterungen unbedingt den Entwicklermodus und erlauben Sie Erweiterungen aus anderen Stores. @@ -308,10 +308,10 @@ Dies folgt dem Prinzip der progressiven Offenbarung, das seit den Anfängen der ### Überblick über Erweiterungsansichten **Setup-Ansicht** – Ersteinrichtung für Nutzer: -![Screenshot der fertigen Erweiterung, geöffnet im Browser, zeigt ein Formular mit Eingaben für Regionsname und API-Schlüssel.](../../../../translated_images/1.b6da8c1394b07491.de.png) +![Screenshot der fertigen Erweiterung, geöffnet im Browser, zeigt ein Formular mit Eingaben für Regionsname und API-Schlüssel.](../../../../translated_images/de/1.b6da8c1394b07491.webp) **Ergebnis-Ansicht** – Anzeige der CO2-Fußabdruckdaten: -![Screenshot der fertigen Erweiterung, zeigt Werte für CO2-Verbrauch und fossilen Brennstoffanteil für die Region US-NEISO.](../../../../translated_images/2.1dae52ff08042246.de.png) +![Screenshot der fertigen Erweiterung, zeigt Werte für CO2-Verbrauch und fossilen Brennstoffanteil für die Region US-NEISO.](../../../../translated_images/de/2.1dae52ff08042246.webp) ### Aufbau des Konfigurationsformulars diff --git a/translations/de/5-browser-extension/2-forms-browsers-local-storage/README.md b/translations/de/5-browser-extension/2-forms-browsers-local-storage/README.md index d27a255d7..a02078753 100644 --- a/translations/de/5-browser-extension/2-forms-browsers-local-storage/README.md +++ b/translations/de/5-browser-extension/2-forms-browsers-local-storage/README.md @@ -263,7 +263,7 @@ stateDiagram-v2 Reset --> ClearStorage: Gespeicherte Daten entfernen ClearStorage --> FirstTime: Zur Einrichtung zurück ``` -![Local storage pane](../../../../translated_images/localstorage.472f8147b6a3f8d1.de.png) +![Local storage pane](../../../../translated_images/de/localstorage.472f8147b6a3f8d1.webp) > ⚠️ **Sicherheitsaspekt**: In produktiven Anwendungen birgt das Speichern von API-Schlüsseln im LocalStorage Sicherheitsrisiken, da JavaScript diese Daten auslesen kann. Für Lernzwecke ist dieser Ansatz in Ordnung, echte Anwendungen sollten sensible Zugangsdaten sicher serverseitig speichern. diff --git a/translations/de/5-browser-extension/3-background-tasks-and-performance/README.md b/translations/de/5-browser-extension/3-background-tasks-and-performance/README.md index 05a9445b3..55e840695 100644 --- a/translations/de/5-browser-extension/3-background-tasks-and-performance/README.md +++ b/translations/de/5-browser-extension/3-background-tasks-and-performance/README.md @@ -123,7 +123,7 @@ Um die Entwicklertools in Edge zu öffnen, klicken Sie auf die drei Punkte oben Probieren wir das aus. Öffnen Sie eine Webseite (Microsoft.com eignet sich gut dafür) und klicken Sie auf die Schaltfläche „Aufzeichnen“. Laden Sie nun die Seite neu und beobachten Sie, wie der Profiler alles erfasst, was passiert. Wenn Sie die Aufnahme stoppen, sehen Sie eine detaillierte Aufschlüsselung, wie der Browser die Seite „scriptet“, „rendert“ und „zeichnet“. Das erinnert mich daran, wie die Missionskontrolle bei einem Raketenstart jedes System überwacht – Sie erhalten Echtzeitdaten, was wann passiert. -![Edge profiler](../../../../translated_images/profiler.5a4a62479c5df01c.de.png) +![Edge profiler](../../../../translated_images/de/profiler.5a4a62479c5df01c.webp) ✅ Die [Microsoft-Dokumentation](https://docs.microsoft.com/microsoft-edge/devtools-guide/performance/?WT.mc_id=academic-77807-sagibbon) bietet noch viele weitere Details, wenn Sie tiefer einsteigen möchten @@ -133,11 +133,11 @@ Wählen Sie Elemente des Profilzeitstrahls aus, um in Ereignisse hineinzuzoomen, Erhalten Sie eine Momentaufnahme der Performance Ihrer Seite, indem Sie einen Abschnitt des Profilzeitstrahls auswählen und sich die Zusammenfassung anschauen: -![Edge profiler snapshot](../../../../translated_images/snapshot.97750180ebcad737.de.png) +![Edge profiler snapshot](../../../../translated_images/de/snapshot.97750180ebcad737.webp) Überprüfen Sie das Ereignisprotokoll, um zu sehen, ob ein Ereignis länger als 15 ms gedauert hat: -![Edge event log](../../../../translated_images/log.804026979f3707e0.de.png) +![Edge event log](../../../../translated_images/de/log.804026979f3707e0.webp) ✅ Lernen Sie Ihren Profiler kennen! Öffnen Sie die Entwicklertools auf dieser Seite und prüfen Sie, ob es Engpässe gibt. Welches Asset lädt am langsamsten? Welches am schnellsten? diff --git a/translations/de/6-space-game/2-drawing-to-canvas/README.md b/translations/de/6-space-game/2-drawing-to-canvas/README.md index 4a2eddc7c..0bc7a11c4 100644 --- a/translations/de/6-space-game/2-drawing-to-canvas/README.md +++ b/translations/de/6-space-game/2-drawing-to-canvas/README.md @@ -105,7 +105,7 @@ quadrantChart Power-up: [0.7, 0.6] UI Elements: [0.9, 0.1] ``` -![das Raster des Canvas](../../../../translated_images/canvas_grid.5f209da785ded492.de.png) +![das Raster des Canvas](../../../../translated_images/de/canvas_grid.5f209da785ded492.webp) > Bild von [MDN](https://developer.mozilla.org/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes) Um auf das Canvas-Element zu zeichnen, folgst du dem gleichen dreistufigen Prozess, der die Grundlage aller Canvas-Grafiken bildet. Nachdem du das ein paar Mal gemacht hast, geht es in Fleisch und Blut über: @@ -323,11 +323,11 @@ Du erstellst eine Webseite mit einem Canvas-Element. Es soll einen schwarzen Bil - Helden-Raumschiff - ![Heldenschiff](../../../../translated_images/player.dd24c1afa8c71e9b.de.png) + ![Heldenschiff](../../../../translated_images/de/player.dd24c1afa8c71e9b.webp) - 5×5 Monster - ![Monsterschiff](../../../../translated_images/enemyShip.5df2a822c16650c2.de.png) + ![Monsterschiff](../../../../translated_images/de/enemyShip.5df2a822c16650c2.webp) ### Empfohlene Schritte für den Entwicklungsstart @@ -463,7 +463,7 @@ for (let x = START_X; x < STOP_X; x += ENEMY_SPACING) { Das fertige Ergebnis sollte so aussehen: -![Schwarzer Bildschirm mit einem Helden und 5*5 Monstern](../../../../translated_images/partI-solution.36c53b48c9ffae2a.de.png) +![Schwarzer Bildschirm mit einem Helden und 5*5 Monstern](../../../../translated_images/de/partI-solution.36c53b48c9ffae2a.webp) ## Lösung diff --git a/translations/de/6-space-game/5-keeping-score/README.md b/translations/de/6-space-game/5-keeping-score/README.md index 51c4dec2e..482be4dab 100644 --- a/translations/de/6-space-game/5-keeping-score/README.md +++ b/translations/de/6-space-game/5-keeping-score/README.md @@ -155,7 +155,7 @@ sequenceDiagram end ``` - **Punktesystem**: Jedes zerstörte feindliche Schiff bringt 100 Punkte (runde Zahlen sind für Spieler leichter mental zu berechnen). Die Punktzahl wird unten links angezeigt. -- **Lebenszähler**: Dein Held startet mit drei Leben – ein Standard, der von frühen Arcade-Spielen etabliert wurde, um Herausforderung mit Spielbarkeit auszubalancieren. Jede Kollision mit einem Feind kostet ein Leben. Die verbleibenden Leben zeigen wir unten rechts mit Schiffs-Icons an ![life image](../../../../translated_images/life.6fb9f50d53ee0413.de.png). +- **Lebenszähler**: Dein Held startet mit drei Leben – ein Standard, der von frühen Arcade-Spielen etabliert wurde, um Herausforderung mit Spielbarkeit auszubalancieren. Jede Kollision mit einem Feind kostet ein Leben. Die verbleibenden Leben zeigen wir unten rechts mit Schiffs-Icons an ![life image](../../../../translated_images/de/life.6fb9f50d53ee0413.webp). ## Lass uns anfangen zu bauen! diff --git a/translations/de/7-bank-project/1-template-route/README.md b/translations/de/7-bank-project/1-template-route/README.md index c6c889ed8..a3a2885c5 100644 --- a/translations/de/7-bank-project/1-template-route/README.md +++ b/translations/de/7-bank-project/1-template-route/README.md @@ -644,7 +644,7 @@ sequenceDiagram Der Aufruf von `history.pushState` erzeugt neue Einträge im Browser-Verlauf. Du kannst das überprüfen, indem du den *Zurück-Button* im Browser gedrückt hältst – es wird so etwas angezeigt wie: -![Screenshot des Navigationsverlaufs](../../../../translated_images/history.7fdabbafa521e064.de.png) +![Screenshot des Navigationsverlaufs](../../../../translated_images/de/history.7fdabbafa521e064.webp) Wenn du mehrmals auf den Zurück-Button klickst, siehst du, dass sich die aktuelle URL ändert und der Verlauf aktualisiert wird, aber immer das gleiche Template bleibt angezeigt. diff --git a/translations/de/7-bank-project/2-forms/README.md b/translations/de/7-bank-project/2-forms/README.md index 7778cacfb..1b67b810c 100644 --- a/translations/de/7-bank-project/2-forms/README.md +++ b/translations/de/7-bank-project/2-forms/README.md @@ -292,7 +292,7 @@ Schauen wir uns an, was bei der einfachen Formularübergabe passiert: 2. Beobachte die Veränderungen in der Adresszeile deines Browsers 3. Sieh, wie die Seite neu lädt und Daten in der URL erscheinen -![Screenshot der URL-Änderung im Browser nach Klick auf die „Registrieren“-Taste](../../../../translated_images/click-register.e89a30bf0d4bc9ca.de.png) +![Screenshot der URL-Änderung im Browser nach Klick auf die „Registrieren“-Taste](../../../../translated_images/de/click-register.e89a30bf0d4bc9ca.webp) ### Vergleich der HTTP-Methoden @@ -346,7 +346,7 @@ Konfigurieren wir dein Registrierungsformular, um mit der Backend-API sicher per 2. **Klicke** den Button „Konto erstellen“ 3. **Beobachte** die Antwort des Servers in deinem Browser -![Ein Browserfenster an Adresse localhost:5000/api/accounts mit einer JSON-Zeichenkette der Benutzerdaten](../../../../translated_images/form-post.61de4ca1b964d91a.de.png) +![Ein Browserfenster an Adresse localhost:5000/api/accounts mit einer JSON-Zeichenkette der Benutzerdaten](../../../../translated_images/de/form-post.61de4ca1b964d91a.webp) **Das solltest du sehen:** - **Browser leitet** zur API-Endpunkt-URL weiter @@ -609,7 +609,7 @@ async function register() { 3. **Klicke** auf "Account erstellen" 4. **Beobachte** die Konsolenmeldungen und das Nutzerfeedback -![Screenshot zeigt Logmeldung in der Browser-Konsole](../../../../translated_images/browser-console.efaf0b51aaaf6778.de.png) +![Screenshot zeigt Logmeldung in der Browser-Konsole](../../../../translated_images/de/browser-console.efaf0b51aaaf6778.webp) **Das solltest du sehen:** - **Ladezustand** erscheint auf dem Absende-Button @@ -783,7 +783,7 @@ Verbessern wir dein Registrierungsformular mit robuster Validierung, die hervorr 3. **Probiere** Sonderzeichen im Benutzername-Feld 4. **Gib** eine negative Guthaben-Summe ein -![Screenshot zeigt Validierungsfehler beim Versuch, das Formular abzusenden](../../../../translated_images/validation-error.8bd23e98d416c22f.de.png) +![Screenshot zeigt Validierungsfehler beim Versuch, das Formular abzusenden](../../../../translated_images/de/validation-error.8bd23e98d416c22f.webp) **Das wirst du beobachten:** - **Browser zeigt** native Validierungsnachrichten an @@ -943,7 +943,7 @@ Zeigen Sie eine Fehlermeldung im HTML an, wenn der Benutzer bereits existiert. Hier ist ein Beispiel, wie die finale Anmeldeseite nach ein wenig Styling aussehen kann: -![Screenshot der Anmeldeseite nach Hinzufügen von CSS-Stilen](../../../../translated_images/result.96ef01f607bf856a.de.png) +![Screenshot der Anmeldeseite nach Hinzufügen von CSS-Stilen](../../../../translated_images/de/result.96ef01f607bf856a.webp) ## Post-Vorlesungs-Quiz diff --git a/translations/de/7-bank-project/3-data/README.md b/translations/de/7-bank-project/3-data/README.md index 82fdc5e2f..b078bbed2 100644 --- a/translations/de/7-bank-project/3-data/README.md +++ b/translations/de/7-bank-project/3-data/README.md @@ -156,7 +156,7 @@ sequenceDiagram Server->>Browser: Gibt komplette HTML-Seite zurück Browser->>User: Zeigt neue Seite an (Blitz/Neuladen) ``` -![Aktualisierungsworkflow in einer Mehrseitenanwendung](../../../../translated_images/mpa.7f7375a1a2d4aa77.de.png) +![Aktualisierungsworkflow in einer Mehrseitenanwendung](../../../../translated_images/de/mpa.7f7375a1a2d4aa77.webp) **Warum sich dieser Ansatz schwerfällig anfühlte:** - Jeder Klick bedeutete, die gesamte Seite neu zu laden @@ -182,7 +182,7 @@ sequenceDiagram JavaScript->>Browser: Aktualisiert spezifische Seitenelemente Browser->>User: Zeigt aktualisierten Inhalt (kein Neuladen) ``` -![Aktualisierungsworkflow in einer Single-Page-Anwendung](../../../../translated_images/spa.268ec73b41f992c2.de.png) +![Aktualisierungsworkflow in einer Single-Page-Anwendung](../../../../translated_images/de/spa.268ec73b41f992c2.webp) **Warum SPAs sich so viel besser anfühlen:** - Nur die tatsächlich geänderten Bereiche werden aktualisiert (clever, oder?) @@ -516,7 +516,7 @@ if (data.error) { Wenn du jetzt mit einem ungültigen Konto testest, siehst du eine hilfreiche Fehlermeldung direkt auf der Seite! -![Screenshot zeigt die während des Logins angezeigte Fehlermeldung](../../../../translated_images/login-error.416fe019b36a6327.de.png) +![Screenshot zeigt die während des Logins angezeigte Fehlermeldung](../../../../translated_images/de/login-error.416fe019b36a6327.webp) #### Schritt 4: Zugänglichkeit und Inklusion fördern @@ -950,7 +950,7 @@ Bereit, Ihre Banking-App auf die nächste Stufe zu heben? Machen wir sie so sch So könnte ein ausgefeiltes Dashboard aussehen: -![Screenshot eines Beispielergebnisses des Dashboards nach Styling](../../../../translated_images/screen2.123c82a831a1d14a.de.png) +![Screenshot eines Beispielergebnisses des Dashboards nach Styling](../../../../translated_images/de/screen2.123c82a831a1d14a.webp) Fühlen Sie sich nicht gezwungen, es exakt nachzumachen – nutzen Sie es als Inspiration und machen Sie es zu Ihrem eigenen! diff --git a/translations/de/7-bank-project/4-state-management/README.md b/translations/de/7-bank-project/4-state-management/README.md index eecb1b216..9d0334d86 100644 --- a/translations/de/7-bank-project/4-state-management/README.md +++ b/translations/de/7-bank-project/4-state-management/README.md @@ -187,7 +187,7 @@ Wie beim aufgeteilten Design der Titanic, das robust schien, bis mehrere Abteile Anstatt uns im Kreis zu drehen, schaffen wir ein **zentralisiertes State-Management**. Stellen Sie sich das vor wie eine wirklich organisierte Person, die für alle wichtigen Dinge verantwortlich ist: -![Schema zeigt die Datenflüsse zwischen HTML, Benutzeraktionen und State](../../../../translated_images/data-flow.fa2354e0908fecc8.de.png) +![Schema zeigt die Datenflüsse zwischen HTML, Benutzeraktionen und State](../../../../translated_images/de/data-flow.fa2354e0908fecc8.webp) ```mermaid flowchart TD @@ -798,7 +798,7 @@ Diese Herausforderung hilft Ihnen, wie ein professioneller Entwickler zu denken, Hier ein Beispielergebnis nach Abschluss der Aufgabe: -![Screenshot zeigt einen Beispiel-Dialog zum "Transaktion hinzufügen"](../../../../translated_images/dialog.93bba104afeb79f1.de.png) +![Screenshot zeigt einen Beispiel-Dialog zum "Transaktion hinzufügen"](../../../../translated_images/de/dialog.93bba104afeb79f1.webp) --- diff --git a/translations/de/7-bank-project/4-state-management/assignment.md b/translations/de/7-bank-project/4-state-management/assignment.md index 4f7a64b37..edf282de6 100644 --- a/translations/de/7-bank-project/4-state-management/assignment.md +++ b/translations/de/7-bank-project/4-state-management/assignment.md @@ -112,7 +112,7 @@ Siehe die [Server-API-Dokumentation](../api/README.md) für: **Erwartetes Ergebnis:** Nach Abschluss dieser Aufgabe verfügt deine Banking-App über eine voll funktionsfähige "Transaktion hinzufügen"-Funktion, die professionell aussieht und funktioniert: -![Screenshot showing an example "Add transaction" dialog](../../../../translated_images/dialog.93bba104afeb79f1.de.png) +![Screenshot showing an example "Add transaction" dialog](../../../../translated_images/de/dialog.93bba104afeb79f1.webp) ## Testen deiner Implementierung diff --git a/translations/de/8-code-editor/1-using-a-code-editor/README.md b/translations/de/8-code-editor/1-using-a-code-editor/README.md index c9a08cc63..d9af1a59f 100644 --- a/translations/de/8-code-editor/1-using-a-code-editor/README.md +++ b/translations/de/8-code-editor/1-using-a-code-editor/README.md @@ -182,7 +182,7 @@ Wie Alexander Graham Bells Telefon entfernte Orte verband, verbindet dein GitHub Sobald alles geladen ist, siehst du einen schön aufgeräumten Arbeitsbereich, der dich auf das Wesentliche – deinen Code – fokussieren lässt! -![Standard VSCode.dev-Oberfläche](../../../../translated_images/default-vscode-dev.5d06881d65c1b323.de.png) +![Standard VSCode.dev-Oberfläche](../../../../translated_images/de/default-vscode-dev.5d06881d65c1b323.webp) **Hier deine Tour durch die Nachbarschaft:** - **Activity Bar** (die Leiste links): Deine Hauptnavigation mit Explorer 📁, Suche 🔍, Source Control 🌿, Erweiterungen 🧩 und Einstellungen ⚙️ @@ -229,7 +229,7 @@ Perfekt, wenn du frisch mit VSCode.dev startest und ein bestimmtes Repository ö 1. Gehe zu [vscode.dev](https://vscode.dev), falls du nicht schon dort bist 2. Suche auf dem Willkommensbildschirm die Schaltfläche „Open Remote Repository“ und klicke sie an - ![Remote-Repository öffnen](../../../../translated_images/open-remote-repository.bd9c2598b8949e7f.de.png) + ![Remote-Repository öffnen](../../../../translated_images/de/open-remote-repository.bd9c2598b8949e7f.webp) 3. Füge eine beliebige GitHub-Repository-URL ein (probier diese: `https://github.com/microsoft/Web-Dev-For-Beginners`) 4. Drücke Enter und sieh zu, wie die Magie passiert! @@ -238,7 +238,7 @@ Perfekt, wenn du frisch mit VSCode.dev startest und ein bestimmtes Repository ö Willst du dich wie ein Programmierzauberer fühlen? Probiere diese Tastenkombination: Ctrl+Shift+P (oder Cmd+Shift+P auf Mac), um die Kommando-Palette zu öffnen: -![Kommando-Palette](../../../../translated_images/palette-menu.4946174e07f42622.de.png) +![Kommando-Palette](../../../../translated_images/de/palette-menu.4946174e07f42622.webp) **Die Kommando-Palette ist wie eine Suchmaschine für alles, was du tun kannst:** - Tippe „open remote“ und sie findet den Repository-Öffner für dich @@ -300,7 +300,7 @@ Wie Architekten ihre Pläne organisieren, folgt das Erstellen von Dateien in VSC 3. Gib den Dateinamen einschließlich der passenden Endung ein (`style.css`, `script.js`, `index.html`) 4. Drücke Enter, um die Datei zu erstellen -![Neue Datei erstellen](../../../../translated_images/create-new-file.2814e609c2af9aeb.de.png) +![Neue Datei erstellen](../../../../translated_images/de/create-new-file.2814e609c2af9aeb.webp) **Benennungskonventionen:** - Verwende aussagekräftige Namen, die den Zweck der Datei anzeigen @@ -318,7 +318,7 @@ Jetzt beginnt der richtige Spaß! Der Editor von VSCode.dev ist vollgepackt mit 2. Fang an zu tippen und sieh zu, wie VSCode.dev dich mit Farben, Vorschlägen und Fehlererkennung unterstützt 3. Speichere deine Arbeit mit Ctrl+S (Windows/Linux) oder Cmd+S (Mac) – allerdings gibt es auch eine Auto-Save-Funktion! -![Dateien in VSCode.dev bearbeiten](../../../../translated_images/edit-a-file.52c0ee665ef19f08.de.png) +![Dateien in VSCode.dev bearbeiten](../../../../translated_images/de/edit-a-file.52c0ee665ef19f08.webp) **Coole Dinge, die beim Coden passieren:** - Dein Code wird farblich ansprechend hervorgehoben und ist dadurch leichter lesbar @@ -339,7 +339,7 @@ Wie Archäologen sorgfältige Aufzeichnungen von Ausgrabungsschichten anlegen, v 2. Geänderte Dateien erscheinen im Bereich „Changes“ 3. Farblich gekennzeichnete Änderungstypen: grün für Hinzufügungen, rot für Löschungen -![Changes im Source Control ansehen](../../../../translated_images/working-tree.c58eec08e6335c79.de.png) +![Changes im Source Control ansehen](../../../../translated_images/de/working-tree.c58eec08e6335c79.webp) **So speicherst du deine Arbeit (Commit-Workflow):** @@ -431,7 +431,7 @@ Der Erweiterungs-Marktplatz ist wirklich gut organisiert, so dass Sie sich nicht 2. Stöbern Sie oder suchen Sie gezielt nach etwas 3. Klicken Sie auf alles, was interessant aussieht, um mehr darüber zu erfahren -![Extension marketplace interface](../../../../translated_images/extensions.eca0e0c7f59a10b5.de.png) +![Extension marketplace interface](../../../../translated_images/de/extensions.eca0e0c7f59a10b5.webp) **Das finden Sie dort:** @@ -484,7 +484,7 @@ Die meisten Erweiterungen besitzen Einstellungen, die Sie anpassen können, dami 3. Wählen Sie im Dropdown „Erweiterungseinstellungen“ 4. Passen Sie alles an, bis es perfekt zu Ihrem Arbeitsablauf passt -![Customizing extension settings](../../../../translated_images/extension-settings.21c752ae4f4cdb78.de.png) +![Customizing extension settings](../../../../translated_images/de/extension-settings.21c752ae4f4cdb78.webp) **Häufige Dinge, die Sie anpassen möchten:** - Wie Ihr Code formatiert wird (Tabs vs. Leerzeichen, Zeilenlänge, etc.) diff --git a/translations/de/8-code-editor/1-using-a-code-editor/assignment.md b/translations/de/8-code-editor/1-using-a-code-editor/assignment.md index 444f62aea..1d1b0e204 100644 --- a/translations/de/8-code-editor/1-using-a-code-editor/assignment.md +++ b/translations/de/8-code-editor/1-using-a-code-editor/assignment.md @@ -78,7 +78,7 @@ Da VSCode.dev mindestens eine Datei im Repository zum Öffnen benötigt, erstell 4. **Schreibe** eine Commit-Botschaft: "Add initial HTML structure" 5. **Klicke** auf "Commit new file", um deine Änderungen zu speichern -![Erstellung der initialen Datei auf GitHub](../../../../translated_images/new-file-github.com.c886796d800e8056.de.png) +![Erstellung der initialen Datei auf GitHub](../../../../translated_images/de/new-file-github.com.c886796d800e8056.webp) **Folgendes erreicht diese initiale Einrichtung:** - **Stellt** eine korrekte HTML5-Dokumentenstruktur mit semantischen Elementen bereit @@ -105,7 +105,7 @@ Jetzt, wo dein Repository-Grundgerüst steht, wechseln wir zu VSCode.dev für di ✅ **Erfolgsanzeige**: Du solltest deine Projektdateien in der Explorer-Seitenleiste sehen und `index.html` im Haupteditor-Bereich zur Bearbeitung verfügbar haben. -![Projekt geladen in VSCode.dev](../../../../translated_images/project-on-vscode.dev.e79815a9a95ee7fe.de.png) +![Projekt geladen in VSCode.dev](../../../../translated_images/de/project-on-vscode.dev.e79815a9a95ee7fe.webp) **Das siehst du in der Benutzeroberfläche:** - **Explorer-Seitenleiste**: Zeigt deine Repository-Dateien und Ordnerstruktur an @@ -450,7 +450,7 @@ Erweiterungen verbessern dein Entwicklungserlebnis, indem sie Live-Preview-Funkt **Sofortige Ergebnisse nach Installation:** Sobald CodeSwing installiert ist, erscheint eine Live-Vorschau deiner Lebenslauf-Website im Editor. So siehst du genau, wie deine Seite während der Bearbeitung aussieht. -![CodeSwing-Erweiterung zeigt Livevorschau](../../../../translated_images/after-codeswing-extension-pb.0ebddddcf73b5509.de.png) +![CodeSwing-Erweiterung zeigt Livevorschau](../../../../translated_images/de/after-codeswing-extension-pb.0ebddddcf73b5509.webp) **Verständnis der erweiterten Oberfläche:** - **Split-Ansicht**: Zeigt deinen Code auf einer Seite und die Live-Vorschau auf der anderen diff --git a/translations/de/9-chat-project/README.md b/translations/de/9-chat-project/README.md index 024a43a13..ed7943bc5 100644 --- a/translations/de/9-chat-project/README.md +++ b/translations/de/9-chat-project/README.md @@ -60,7 +60,7 @@ print(response.choices[0].message.content) So sieht dein fertiges Projekt aus: -![Chat-App-Oberfläche mit Konversation zwischen Nutzer und KI-Assistent](../../../translated_images/screenshot.0a1ee0d123df681b.de.png) +![Chat-App-Oberfläche mit Konversation zwischen Nutzer und KI-Assistent](../../../translated_images/de/screenshot.0a1ee0d123df681b.webp) ## 🗺️ Deine Lernreise durch die KI-Anwendungsentwicklung @@ -189,7 +189,7 @@ mindmap ``` **Kernprinzip**: Die Entwicklung von KI-Anwendungen kombiniert traditionelle Webentwicklungsfähigkeiten mit KI-Dienstintegrationen und erschafft intelligente Anwendungen, die sich natürlich und reaktionsfreudig für Nutzer anfühlen. -![GitHub Models KI Playground-Oberfläche mit Modellauswahl und Testbereich](../../../translated_images/playground.d2b927122224ff8f.de.png) +![GitHub Models KI Playground-Oberfläche mit Modellauswahl und Testbereich](../../../translated_images/de/playground.d2b927122224ff8f.webp) **Das macht den Playground so nützlich:** - **Teste** verschiedene KI-Modelle wie GPT-4o-mini, Claude und andere (alles kostenlos!) @@ -199,7 +199,7 @@ mindmap Wenn du ein wenig gespielt hast, klick einfach auf den Reiter „Code“ und wähle deine Programmiersprache, um den Implementierungscode zu erhalten, den du brauchst. -![Playground-Auswahl zeigt Code-Generierungsoptionen für verschiedene Programmiersprachen](../../../translated_images/playground-choice.1d23ba7d407f4758.de.png) +![Playground-Auswahl zeigt Code-Generierungsoptionen für verschiedene Programmiersprachen](../../../translated_images/de/playground-choice.1d23ba7d407f4758.webp) ## Einrichtung der Python-Backend-Integration @@ -2349,14 +2349,14 @@ Möchten Sie dieses Projekt in einer Cloud-Entwicklungsumgebung ausprobieren? Gi - **Navigieren** Sie zum [Web Dev For Beginners repository](https://github.com/microsoft/Web-Dev-For-Beginners) - **Klicken** Sie oben rechts auf „Use this template“ (stellen Sie sicher, dass Sie bei GitHub angemeldet sind) -![Create from template interface showing the green "Use this template" button](../../../translated_images/template.67ad477109d29a2b.de.png) +![Create from template interface showing the green "Use this template" button](../../../translated_images/de/template.67ad477109d29a2b.webp) **Schritt 2: Codespaces starten** - **Öffnen** Sie Ihr neu erstelltes Repository - **Klicken** Sie den grünen „Code“-Button und wählen Sie „Codespaces“ - **Wählen** Sie „Create codespace on main“, um Ihre Entwicklungsumgebung zu starten -![Create codespace interface with options for launching cloud development environment](../../../translated_images/codespace.bcecbdf5d2747d3d.de.png) +![Create codespace interface with options for launching cloud development environment](../../../translated_images/de/codespace.bcecbdf5d2747d3d.webp) **Schritt 3: Konfiguration der Umgebung** Sobald Ihr Codespace geladen ist, haben Sie Zugriff auf: diff --git a/translations/de/README.md b/translations/de/README.md index c3977f537..5efbfd1d9 100644 --- a/translations/de/README.md +++ b/translations/de/README.md @@ -72,13 +72,13 @@ Verpasse nicht unseren neuen Lehrplan zur Generativen KI! Besuche [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course), um zu starten! -![Background](../../translated_images/background.148a8d43afde5730.de.png) +![Background](../../translated_images/de/background.148a8d43afde5730.webp) - Lektionen, die alles von den Grundlagen bis zu RAG abdecken. - Interagiere mit historischen Figuren mithilfe von GenAI und unserer Begleit-App. - Spannende und unterhaltsame Erzählung, du wirst durch die Zeit reisen! -![character](../../translated_images/character.5c0dd8e067ffd693.de.png) +![character](../../translated_images/de/character.5c0dd8e067ffd693.webp) Jede Lektion beinhaltet eine Aufgabe, einen Wissenstest und eine Herausforderung, die dich beim Lernen von Themen wie: @@ -115,7 +115,7 @@ Folge diesen Schritten: In deiner erstellten Kopie dieses Repositories, klicke auf die **Code**-Schaltfläche und wähle **Open with Codespaces**. Dies erstellt einen neuen Codespace für dich. -![Codespace](../../translated_images/createcodespace.0238bbf4d7a8d955.de.png) +![Codespace](../../translated_images/de/createcodespace.0238bbf4d7a8d955.webp) #### Ausführen des Lehrplans lokal auf deinem Computer diff --git a/translations/de/for-teachers.md b/translations/de/for-teachers.md index 32193b5f8..6b8b50c54 100644 --- a/translations/de/for-teachers.md +++ b/translations/de/for-teachers.md @@ -42,10 +42,10 @@ Dieses Curriculum enthält importierbare Pakete für gängige LMS-Workflows. - Moodle Cloud unterstützt Common Cartridge nur eingeschränkt. Bevorzugen Sie die oben genannte Moodle-Datei, die auch in Canvas hochgeladen werden kann. - Überprüfen Sie nach dem Import die Module, Fälligkeitsdaten und Quiz-Einstellungen, um sie an Ihren Semesterplan anzupassen. -![Moodle](../../translated_images/moodle.94eb93d714a50cb2.de.png) +![Moodle](../../translated_images/de/moodle.94eb93d714a50cb2.webp) > Das Curriculum in einem Moodle-Klassenzimmer -![Canvas](../../translated_images/canvas.fbd605ff8e5b8aff.de.png) +![Canvas](../../translated_images/de/canvas.fbd605ff8e5b8aff.webp) > Das Curriculum in Canvas ### Direkte Nutzung des Repositories (ohne Classroom) diff --git a/translations/el/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/el/1-getting-started-lessons/1-intro-to-programming-languages/README.md index 890062577..253813498 100644 --- a/translations/el/1-getting-started-lessons/1-intro-to-programming-languages/README.md +++ b/translations/el/1-getting-started-lessons/1-intro-to-programming-languages/README.md @@ -17,7 +17,7 @@ CO_OP_TRANSLATOR_METADATA: Σήμερα, θα εξερευνήσουμε τα απίστευτα εργαλεία που κάνουν την σύγχρονη ανάπτυξη ιστοσελίδων όχι μόνο δυνατή, αλλά και σοβαρά εθιστική. Μιλάω για τους ίδιους ακριβώς επεξεργαστές, προγράμματα περιήγησης και ροές εργασίας που χρησιμοποιούν οι προγραμματιστές στη Netflix, Spotify και το αγαπημένο σου indie studio εφαρμογών κάθε μέρα. Και να το μέρος που θα σε κάνει να χορέψεις από χαρά: τα περισσότερα από αυτά τα επαγγελματικά, βιομηχανικά πρότυπα εργαλεία είναι εντελώς δωρεάν! -![Intro Programming](../../../../translated_images/webdev101-programming.d6e3f98e61ac4bff.el.png) +![Intro Programming](../../../../translated_images/el/webdev101-programming.d6e3f98e61ac4bff.png) > Σκέτς από [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid diff --git a/translations/el/1-getting-started-lessons/2-github-basics/README.md b/translations/el/1-getting-started-lessons/2-github-basics/README.md index 6c0fc70e4..bc841c248 100644 --- a/translations/el/1-getting-started-lessons/2-github-basics/README.md +++ b/translations/el/1-getting-started-lessons/2-github-basics/README.md @@ -17,7 +17,7 @@ CO_OP_TRANSLATOR_METADATA: Θα κάνουμε αυτό το ταξίδι μαζί, βήμα-βήμα. Χωρίς βιασύνη, χωρίς πίεση – απλά εσύ, εγώ, και κάποια πολύ ωραία εργαλεία που σύντομα θα γίνουν οι νέοι σου καλύτεροι φίλοι! -![Intro to GitHub](../../../../translated_images/webdev101-github.8846d7971abef6f9.el.png) +![Intro to GitHub](../../../../translated_images/el/webdev101-github.8846d7971abef6f9.png) > Σκιτσάκι από [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid @@ -606,7 +606,7 @@ flowchart TD ✅ Ένας καλός τρόπος να βρείτε repos φιλικά για αρχάριους είναι να [αναζητήσετε με την ετικέτα 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/). -![Αντιγραφή αποθετηρίου τοπικά](../../../../translated_images/clone_repo.5085c48d666ead57.el.png) +![Αντιγραφή αποθετηρίου τοπικά](../../../../translated_images/el/clone_repo.5085c48d666ead57.png) Υπάρχουν διάφοροι τρόποι για να αντιγράψετε κώδικα. Ένας τρόπος είναι να "κλωνοποιήσετε" τα περιεχόμενα του αποθετηρίου, χρησιμοποιώντας HTTPS, SSH ή το GitHub CLI (Διεπαφή Γραμμής Εντολών). diff --git a/translations/el/1-getting-started-lessons/3-accessibility/README.md b/translations/el/1-getting-started-lessons/3-accessibility/README.md index 42e341607..e8a79df18 100644 --- a/translations/el/1-getting-started-lessons/3-accessibility/README.md +++ b/translations/el/1-getting-started-lessons/3-accessibility/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # Δημιουργία Προσβάσιμων Ιστοσελίδων -![Όλα για την Προσβασιμότητα](../../../../translated_images/webdev101-a11y.8ef3025c858d897a.el.png) +![Όλα για την Προσβασιμότητα](../../../../translated_images/el/webdev101-a11y.8ef3025c858d897a.png) > Σχεδιάγραμμα από [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid @@ -1049,12 +1049,12 @@ pie title "Συνηθισμένα πρότυπα χρήσης ARIA" **Ενημερωτικές εικόνες** - μεταφέρουν σημαντικές πληροφορίες: ```html -Sales increased 25% from Q1 to Q2 2024 +Sales increased 25% from Q1 to Q2 2024 ``` **Διακοσμητικές εικόνες** - καθαρά οπτικές χωρίς πληροφοριακή αξία: ```html - + ``` **Λειτουργικές εικόνες** - λειτουργούν ως κουμπιά ή ελεγκτικά: @@ -1066,7 +1066,7 @@ pie title "Συνηθισμένα πρότυπα χρήσης ARIA" **Πολύπλοκες εικόνες** - διαγράμματα, γραφήματα, ενημερωτικά γραφικά: ```html -Quarterly sales data +Quarterly sales data

Detailed description: Sales data shows a steady increase across all quarters...

@@ -1106,7 +1106,7 @@ pie title "Συνηθισμένα πρότυπα χρήσης ARIA" - Website traffic increased 40% after accessibility improvements + Website traffic increased 40% after accessibility improvements ``` diff --git a/translations/el/2-js-basics/1-data-types/README.md b/translations/el/2-js-basics/1-data-types/README.md index 86ca47885..6ccf1bb0e 100644 --- a/translations/el/2-js-basics/1-data-types/README.md +++ b/translations/el/2-js-basics/1-data-types/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # Βασικά στοιχεία JavaScript: Τύποι Δεδομένων -![JavaScript Basics - Data types](../../../../translated_images/webdev101-js-datatypes.4cc470179730702c.el.png) +![JavaScript Basics - Data types](../../../../translated_images/el/webdev101-js-datatypes.4cc470179730702c.png) > Σημείωση από [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid diff --git a/translations/el/2-js-basics/2-functions-methods/README.md b/translations/el/2-js-basics/2-functions-methods/README.md index 808b00174..85eea499d 100644 --- a/translations/el/2-js-basics/2-functions-methods/README.md +++ b/translations/el/2-js-basics/2-functions-methods/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript Basics: Μέθοδοι και Συναρτήσεις -![JavaScript Basics - Functions](../../../../translated_images/webdev101-js-functions.be049c4726e94f8b.el.png) +![JavaScript Basics - Functions](../../../../translated_images/el/webdev101-js-functions.be049c4726e94f8b.png) > Σημείωση από [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid diff --git a/translations/el/2-js-basics/3-making-decisions/README.md b/translations/el/2-js-basics/3-making-decisions/README.md index 482f1859a..2753ca257 100644 --- a/translations/el/2-js-basics/3-making-decisions/README.md +++ b/translations/el/2-js-basics/3-making-decisions/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # Βασικά JavaScript: Λήψη Αποφάσεων -![JavaScript Basics - Making decisions](../../../../translated_images/webdev101-js-decisions.69e1b20f272dd1f0.el.png) +![JavaScript Basics - Making decisions](../../../../translated_images/el/webdev101-js-decisions.69e1b20f272dd1f0.png) > Σκέτς από [Tomomi Imura](https://twitter.com/girlie_mac) diff --git a/translations/el/2-js-basics/4-arrays-loops/README.md b/translations/el/2-js-basics/4-arrays-loops/README.md index 325ac44c2..0982ced23 100644 --- a/translations/el/2-js-basics/4-arrays-loops/README.md +++ b/translations/el/2-js-basics/4-arrays-loops/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # Βασικά JavaScript: Πίνακες και Βρόχοι -![Βασικά JavaScript - Πίνακες](../../../../translated_images/webdev101-js-arrays.439d7528b8a29455.el.png) +![Βασικά JavaScript - Πίνακες](../../../../translated_images/el/webdev101-js-arrays.439d7528b8a29455.png) > Σκέτς από τον/την [Tomomi Imura](https://twitter.com/girlie_mac) ```mermaid diff --git a/translations/el/3-terrarium/1-intro-to-html/README.md b/translations/el/3-terrarium/1-intro-to-html/README.md index 0661755a3..c06462315 100644 --- a/translations/el/3-terrarium/1-intro-to-html/README.md +++ b/translations/el/3-terrarium/1-intro-to-html/README.md @@ -25,7 +25,7 @@ journey Βελτίωση προσβασιμότητας: 5: Student Δημιουργία τεραρίου: 5: Student ``` -![Εισαγωγή στο HTML](../../../../translated_images/webdev101-html.4389c2067af68e98.el.png) +![Εισαγωγή στο HTML](../../../../translated_images/el/webdev101-html.4389c2067af68e98.png) > Σημείωση σκίτσου από την [Tomomi Imura](https://twitter.com/girlie_mac) Το HTML, ή HyperText Markup Language, είναι το θεμέλιο κάθε ιστότοπου που έχετε επισκεφθεί ποτέ. Σκεφτείτε το HTML ως το σκελετό που δίνει δομή στις ιστοσελίδες – καθορίζει πού πάει το περιεχόμενο, πώς οργανώνεται και τι αντιπροσωπεύει κάθε κομμάτι. Ενώ το CSS αργότερα θα "ντύσει" το HTML σας με χρώματα και διατάξεις, και η JavaScript θα του δώσει ζωή με διαδραστικότητα, το HTML παρέχει την ουσιαστική δομή που κάνει τα πάντα δυνατά. @@ -86,7 +86,7 @@ mindmap 4. Στο παράθυρο Explorer, κάνε κλικ στο εικονίδιο "New File" 5. Ονόμασε το αρχείο σου `index.html` -![VS Code Explorer showing new file creation](../../../../translated_images/vs-code-index.e2986cf919471eb9.el.png) +![VS Code Explorer showing new file creation](../../../../translated_images/el/vs-code-index.e2986cf919471eb9.png) **Επιλογή 2: Χρήση Εντολών Τερματικού** ```bash @@ -236,48 +236,48 @@ flowchart TD
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
- plant + plant
diff --git a/translations/el/3-terrarium/2-intro-to-css/README.md b/translations/el/3-terrarium/2-intro-to-css/README.md index 8aece3533..512968dec 100644 --- a/translations/el/3-terrarium/2-intro-to-css/README.md +++ b/translations/el/3-terrarium/2-intro-to-css/README.md @@ -29,7 +29,7 @@ journey Ανταποκρινόμενος σχεδιασμός: 5: Student Αντανακλάσεις γυαλιού: 5: Student ``` -![Εισαγωγή στο CSS](../../../../translated_images/webdev101-css.3f7af5991bf53a20.el.png) +![Εισαγωγή στο CSS](../../../../translated_images/el/webdev101-css.3f7af5991bf53a20.png) > Σχεδιοσημείωση από την [Τομομι Ιμούρα](https://twitter.com/girlie_mac) Θυμάστε πώς φαινόταν το HTML terrarium σας αρκετά βασικό; Το CSS είναι το εργαλείο όπου μετατρέπουμε αυτήν την απλή δομή σε κάτι οπτικά ελκυστικό. @@ -202,7 +202,7 @@ body { Ανοίξτε τα εργαλεία ανάπτυξης του περιηγητή σας (F12), πηγαίνετε στην καρτέλα Elements και επιθεωρήστε το στοιχείο `

`. Θα δείτε ότι κληρονομεί την οικογένεια γραμματοσειράς από το `body`: -![inherited font](../../../../translated_images/1.cc07a5cbe114ad1d.el.png) +![inherited font](../../../../translated_images/el/1.cc07a5cbe114ad1d.png) ✅ **Δοκιμή Πειράματος**: Δοκιμάστε να ορίσετε άλλες κληρονομούμενες ιδιότητες στο `` όπως `color`, `line-height` ή `text-align`. Τι συμβαίνει με τον τίτλο σας και άλλα στοιχεία; @@ -332,7 +332,7 @@ h1 { **Αυτή είναι η δομή HTML για κάθε φυτό:** ```html
- Decorative plant for terrarium + Decorative plant for terrarium
``` @@ -594,7 +594,7 @@ flowchart LR Θα δημιουργήσετε διακριτικά φωτεινά σημεία που προσομοιώνουν πώς το φως αντανακλάται στις γυάλινες επιφάνειες. Αυτή η προσέγγιση είναι παρόμοια με το πώς οι ζωγράφοι της Αναγέννησης όπως ο Jan van Eyck χρησιμοποιούσαν το φως και την αντανάκλαση για να κάνουν το ζωγραφισμένο γυαλί να φαίνεται τρισδιάστατο. Αυτό στοχεύετε: -![finished terrarium](../../../../translated_images/terrarium-final.2f07047ffc597d0a.el.png) +![finished terrarium](../../../../translated_images/el/terrarium-final.2f07047ffc597d0a.png) **Η πρόκλησή σας:** - **Δημιουργήστε** διακριτικούς λευκούς ή ανοιχτόχρωμους οβάλ σχηματισμούς για τις αντανακλάσεις του γυαλιού diff --git a/translations/el/3-terrarium/3-intro-to-DOM-and-closures/README.md b/translations/el/3-terrarium/3-intro-to-DOM-and-closures/README.md index bb8925488..257e37eb0 100644 --- a/translations/el/3-terrarium/3-intro-to-DOM-and-closures/README.md +++ b/translations/el/3-terrarium/3-intro-to-DOM-and-closures/README.md @@ -25,7 +25,7 @@ journey Δοκιμάστε τη λειτουργικότητα: 5: Student Ολοκληρώστε το terrarium: 5: Student ``` -![DOM και ένα closure](../../../../translated_images/webdev101-js.10280393044d7eaa.el.png) +![DOM και ένα closure](../../../../translated_images/el/webdev101-js.10280393044d7eaa.png) > Σχεδιάγραμμα από [Tomomi Imura](https://twitter.com/girlie_mac) Καλώς ήρθατε σε μία από τις πιο συναρπαστικές πτυχές της ανάπτυξης ιστοσελίδων - το να κάνουμε τα πράγματα διαδραστικά! Το Document Object Model (DOM) είναι σαν μια γέφυρα ανάμεσα στο HTML και το JavaScript σας, και σήμερα θα το χρησιμοποιήσουμε για να δώσουμε ζωή στο terrarium σας. Όταν ο Tim Berners-Lee δημιούργησε τον πρώτο περιηγητή διαδικτύου, οραματίστηκε έναν ιστό όπου τα έγγραφα μπορούν να είναι δυναμικά και διαδραστικά - το DOM καθιστά αυτό το όραμα εφικτό. @@ -102,7 +102,7 @@ flowchart TD style P fill:#ffebee style Q fill:#ffebee ``` -![Αναπαράσταση δέντρου DOM](../../../../translated_images/dom-tree.7daf0e763cbbba92.el.png) +![Αναπαράσταση δέντρου DOM](../../../../translated_images/el/dom-tree.7daf0e763cbbba92.png) > Αναπαράσταση του DOM και του HTML markup που το αναφέρεται. Από [Olfa Nasraoui](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites) @@ -146,7 +146,7 @@ flowchart LR ``` > 💡 **Κατανόηση των Closures**: Τα closures είναι ένα σημαντικό θέμα στην JavaScript, και πολλοί προγραμματιστές τα χρησιμοποιούν χρόνια πριν κατανοήσουν πλήρως όλες τις θεωρητικές πτυχές. Σήμερα, εστιάζουμε στην πρακτική εφαρμογή - θα δείτε τα closures να προκύπτουν φυσικά καθώς χτίζουμε τις διαδραστικές λειτουργίες μας. Η κατανόηση θα αναπτυχθεί καθώς βλέπετε πώς λύνουν πραγματικά προβλήματα. -![Αναπαράσταση δέντρου DOM](../../../../translated_images/dom-tree.7daf0e763cbbba92.el.png) +![Αναπαράσταση δέντρου DOM](../../../../translated_images/el/dom-tree.7daf0e763cbbba92.png) > Αναπαράσταση του DOM και του HTML markup που το αναφέρεται. Από [Olfa Nasraoui](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites) @@ -591,7 +591,7 @@ function stopElementDrag() { - **Διαλειτουργικότητα**: Λειτουργεί σε desktop και κινητά - **Επίγνωση Απόδοσης**: Χωρίς διαρροές μνήμης ή περιττούς υπολογισμούς -![φινιρισμένο τεράριουμ](../../../../translated_images/terrarium-final.0920f16e87c13a84.el.png) +![φινιρισμένο τεράριουμ](../../../../translated_images/el/terrarium-final.0920f16e87c13a84.png) --- diff --git a/translations/el/3-terrarium/solution/README.md b/translations/el/3-terrarium/solution/README.md index 05c80a092..30a8ee41d 100644 --- a/translations/el/3-terrarium/solution/README.md +++ b/translations/el/3-terrarium/solution/README.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Μια μικρή άσκηση drag and drop. Με λίγη HTML, JS και CSS, μπορείτε να δημιουργήσετε μια διαδικτυακή διεπαφή, να την διαμορφώσετε και να προσθέσετε αλληλεπίδραση. -![το τεραριούμ μου](../../../../translated_images/screenshot_gray.0c796099a1f9f25e.el.png) +![το τεραριούμ μου](../../../../translated_images/el/screenshot_gray.0c796099a1f9f25e.png) ## Πιστώσεις diff --git a/translations/el/5-browser-extension/1-about-browsers/README.md b/translations/el/5-browser-extension/1-about-browsers/README.md index befefd5d1..3efb15546 100644 --- a/translations/el/5-browser-extension/1-about-browsers/README.md +++ b/translations/el/5-browser-extension/1-about-browsers/README.md @@ -25,7 +25,7 @@ journey Εντοπισμός σφαλμάτων: 4: Student Βελτίωση εμπειρίας: 5: Student ``` -![Σημειώσεις σκίτσου περιηγητή](../../../../translated_images/browser.60317c9be8b7f84a.el.jpg) +![Σημειώσεις σκίτσου περιηγητή](../../../../translated_images/el/browser.60317c9be8b7f84a.jpg) > Σημειώσεις σκίτσου από τον [Wassim Chegham](https://dev.to/wassimchegham/ever-wondered-what-happens-when-you-type-in-a-url-in-an-address-bar-in-a-browser-3dob) ## Προ-Διάλεξη Κουίζ @@ -77,7 +77,7 @@ mindmap ✅ **Λίγη ιστορία**: Ο πρώτος περιηγητής ονομαζόταν 'WorldWideWeb' και δημιουργήθηκε από τον Sir Timothy Berners-Lee το 1990. -![πρώιμοι περιηγητές](../../../../translated_images/earlybrowsers.d984b711cdf3a42d.el.jpg) +![πρώιμοι περιηγητές](../../../../translated_images/el/earlybrowsers.d984b711cdf3a42d.jpg) > Μερικοί πρώιμοι περιηγητές, μέσω της [Karen McGrane](https://www.slideshare.net/KMcGrane/week-4-ixd-history-personal-computing) ### Πώς οι Περιηγητές Επεξεργάζονται Περιεχόμενο Ιστού @@ -194,7 +194,7 @@ quadrantChart Η κατανόηση της διαδικασίας εγκατάστασης επέκτασης σας βοηθά να προβλέψετε την εμπειρία του χρήστη όταν κάποιος εγκαθιστά την επέκτασή σας. Η διαδικασία εγκατάστασης είναι στάνταρ για τους σύγχρονους περιηγητές, με μικρές διαφοροποιήσεις στο σχεδιασμό διεπαφής. -![στιγμιότυπο οθόνης του περιηγητή Edge που δείχνει τη σελίδα open edge://extensions και το ανοιχτό μενού ρυθμίσεων](../../../../translated_images/install-on-edge.d68781acaf0b3d3d.el.png) +![στιγμιότυπο οθόνης του περιηγητή Edge που δείχνει τη σελίδα open edge://extensions και το ανοιχτό μενού ρυθμίσεων](../../../../translated_images/el/install-on-edge.d68781acaf0b3d3d.png) > **Σημαντικό**: Φροντίστε να ενεργοποιήσετε τη λειτουργία προγραμματιστή και να επιτρέψετε επεκτάσεις από άλλα καταστήματα όταν δοκιμάζετε τις δικές σας επεκτάσεις. @@ -308,10 +308,10 @@ project-root/ ### Επισκόπηση Προβολών Επέκτασης **Προβολή Ρυθμίσεων** - Ρύθμιση χρήστη για πρώτη φορά: -![στιγμιότυπο οθόνης της ολοκληρωμένης επέκτασης ανοιχτής σε περιηγητή, εμφανίζοντας μια φόρμα με πεδία για όνομα περιοχής και κλειδί API.](../../../../translated_images/1.b6da8c1394b07491.el.png) +![στιγμιότυπο οθόνης της ολοκληρωμένης επέκτασης ανοιχτής σε περιηγητή, εμφανίζοντας μια φόρμα με πεδία για όνομα περιοχής και κλειδί API.](../../../../translated_images/el/1.b6da8c1394b07491.png) **Προβολή Αποτελεσμάτων** - Εμφάνιση δεδομένων ανθρακικού αποτυπώματος: -![στιγμιότυπο οθόνης της ολοκληρωμένης επέκτασης που εμφανίζει τιμές για χρήση άνθρακα και ποσοστό ορυκτών καυσίμων για την περιοχή US-NEISO.](../../../../translated_images/2.1dae52ff08042246.el.png) +![στιγμιότυπο οθόνης της ολοκληρωμένης επέκτασης που εμφανίζει τιμές για χρήση άνθρακα και ποσοστό ορυκτών καυσίμων για την περιοχή US-NEISO.](../../../../translated_images/el/2.1dae52ff08042246.png) ### Κατασκευή της Φόρμας Ρυθμίσεων diff --git a/translations/el/5-browser-extension/2-forms-browsers-local-storage/README.md b/translations/el/5-browser-extension/2-forms-browsers-local-storage/README.md index 27b35e6aa..7146766e9 100644 --- a/translations/el/5-browser-extension/2-forms-browsers-local-storage/README.md +++ b/translations/el/5-browser-extension/2-forms-browsers-local-storage/README.md @@ -263,7 +263,7 @@ stateDiagram-v2 Reset --> ClearStorage: Αφαίρεση αποθηκευμένων δεδομένων ClearStorage --> FirstTime: Επιστροφή στις ρυθμίσεις ``` -![Πεδίο τοπικής αποθήκευσης](../../../../translated_images/localstorage.472f8147b6a3f8d1.el.png) +![Πεδίο τοπικής αποθήκευσης](../../../../translated_images/el/localstorage.472f8147b6a3f8d1.png) > ⚠️ **Ασφαλής Εξέταση**: Σε παραγωγικές εφαρμογές, η αποθήκευση κλειδιών API στο LocalStorage εγκυμονεί κινδύνους ασφάλειας αφού ο JavaScript μπορεί να αποκτήσει πρόσβαση σε αυτά τα δεδομένα. Για εκπαιδευτικούς σκοπούς, αυτή η προσέγγιση λειτουργεί καλά, αλλά πραγματικές εφαρμογές πρέπει να χρησιμοποιούν ασφαλή αποθήκευση στον server για ευαίσθητα διαπιστευτήρια. diff --git a/translations/el/5-browser-extension/3-background-tasks-and-performance/README.md b/translations/el/5-browser-extension/3-background-tasks-and-performance/README.md index d9a1de524..87972d7d6 100644 --- a/translations/el/5-browser-extension/3-background-tasks-and-performance/README.md +++ b/translations/el/5-browser-extension/3-background-tasks-and-performance/README.md @@ -123,7 +123,7 @@ flowchart LR Ας το δοκιμάσουμε. Ανοίξτε μια ιστοσελίδα (το Microsoft.com λειτουργεί καλά για αυτό) και κάντε κλικ στο κουμπί 'Εγγραφή'. Τώρα ανανεώστε τη σελίδα και παρακολουθήστε τον προφίλ να καταγράφει όσα συμβαίνουν. Όταν σταματήσετε την εγγραφή, θα δείτε μια λεπτομερή ανάλυση του πώς ο περιηγητής «γράφει σενάρια», «αποδίδει» και «ζωγραφίζει» τη σελίδα. Μου θυμίζει πώς ο κεντρικός έλεγχος αποστολής παρακολουθεί κάθε σύστημα κατά την εκτόξευση πυραύλου - λαμβάνετε δεδομένα σε πραγματικό χρόνο για το τι συμβαίνει και πότε. -![Edge profiler](../../../../translated_images/profiler.5a4a62479c5df01c.el.png) +![Edge profiler](../../../../translated_images/el/profiler.5a4a62479c5df01c.png) ✅ Το [Τεκμηρίωση της Microsoft](https://docs.microsoft.com/microsoft-edge/devtools-guide/performance/?WT.mc_id=academic-77807-sagibbon) έχει πολλές περισσότερες λεπτομέρειες αν θέλετε να εμβαθύνετε @@ -133,11 +133,11 @@ flowchart LR Πάρτε ένα στιγμιότυπο της απόδοσης της σελίδας σας επιλέγοντας ένα τμήμα της χρονογραμμής και κοιτάζοντας τον πίνακα περίληψης: -![Edge profiler snapshot](../../../../translated_images/snapshot.97750180ebcad737.el.png) +![Edge profiler snapshot](../../../../translated_images/el/snapshot.97750180ebcad737.png) Ελέγξτε τον πίνακα του Ημερολογίου Γεγονότων για να δείτε αν κάποιο γεγονός κράτησε πάνω από 15 ms: -![Edge event log](../../../../translated_images/log.804026979f3707e0.el.png) +![Edge event log](../../../../translated_images/el/log.804026979f3707e0.png) ✅ Γνωρίστε τον προφίλ σας! Ανοίξτε τα εργαλεία προγραμματιστή σε αυτή την ιστοσελίδα και δείτε αν υπάρχουν στενώσεις. Ποιο είναι το πιο αργό στοιχείο στην φόρτωση; Το πιο γρήγορο; diff --git a/translations/el/5-browser-extension/README.md b/translations/el/5-browser-extension/README.md index d4dc54bfa..ed360e851 100644 --- a/translations/el/5-browser-extension/README.md +++ b/translations/el/5-browser-extension/README.md @@ -23,7 +23,7 @@ CO_OP_TRANSLATOR_METADATA: ### Ευχαριστίες -![μια πράσινη επέκταση προγράμματος περιήγησης](../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.el.png) +![μια πράσινη επέκταση προγράμματος περιήγησης](../../../translated_images/el/extension-screenshot.0e7f5bfa110e92e3.png) ## Ευχαριστίες diff --git a/translations/el/5-browser-extension/solution/README.md b/translations/el/5-browser-extension/solution/README.md index c80ec67ac..712abad78 100644 --- a/translations/el/5-browser-extension/solution/README.md +++ b/translations/el/5-browser-extension/solution/README.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Χρησιμοποιώντας το API C02 Signal της tmrow για την παρακολούθηση της χρήσης ηλεκτρικής ενέργειας, δημιουργήστε μια επέκταση περιηγητή ώστε να έχετε μια υπενθύμιση απευθείας στον περιηγητή σας σχετικά με το πόσο έντονη είναι η χρήση ηλεκτρικής ενέργειας στην περιοχή σας. Η χρήση αυτής της επέκτασης κατά περίπτωση θα σας βοηθήσει να λαμβάνετε αποφάσεις για τις δραστηριότητές σας βάσει αυτών των πληροφοριών. -![στιγμιότυπο οθόνης επέκτασης](../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.el.png) +![στιγμιότυπο οθόνης επέκτασης](../../../../translated_images/el/extension-screenshot.0e7f5bfa110e92e3.png) ## Ξεκινώντας @@ -31,7 +31,7 @@ npm run build Για να εγκαταστήσετε την επέκταση στον Edge, χρησιμοποιήστε το μενού με τις 'τρεις τελείες' στην επάνω δεξιά γωνία του περιηγητή για να βρείτε τον πίνακα Επεκτάσεων. Από εκεί, επιλέξτε 'Φόρτωση μη συσκευασμένης' για να φορτώσετε μια νέα επέκταση. Ανοίξτε τον φάκελο 'dist' όταν σας ζητηθεί και η επέκταση θα φορτωθεί. Για να τη χρησιμοποιήσετε, θα χρειαστείτε ένα API key για το API του CO2 Signal ([αποκτήστε ένα εδώ μέσω email](https://www.co2signal.com/) - εισάγετε το email σας στο πλαίσιο αυτής της σελίδας) και τον [κωδικό για την περιοχή σας](http://api.electricitymap.org/v3/zones) που αντιστοιχεί στον [Electricity Map](https://www.electricitymap.org/map) (στη Βοστώνη, για παράδειγμα, χρησιμοποιώ 'US-NEISO'). -![εγκατάσταση](../../../../translated_images/install-on-edge.78634f02842c4828.el.png) +![εγκατάσταση](../../../../translated_images/el/install-on-edge.78634f02842c4828.png) Μόλις εισαχθούν το API key και η περιοχή στη διεπαφή της επέκτασης, η χρωματιστή κουκκίδα στη γραμμή επέκτασης του περιηγητή θα πρέπει να αλλάξει ώστε να αντικατοπτρίζει τη χρήση ενέργειας της περιοχής σας και να σας δώσει μια ένδειξη για το ποιες δραστηριότητες με υψηλή κατανάλωση ενέργειας θα ήταν κατάλληλες να εκτελέσετε. Η ιδέα πίσω από αυτό το σύστημα 'κουκκίδας' μου δόθηκε από την επέκταση [Energy Lollipop](https://energylollipop.com/) για τις εκπομπές της Καλιφόρνιας. diff --git a/translations/el/5-browser-extension/solution/translation/README.es.md b/translations/el/5-browser-extension/solution/translation/README.es.md index cbbeed713..4697e2023 100644 --- a/translations/el/5-browser-extension/solution/translation/README.es.md +++ b/translations/el/5-browser-extension/solution/translation/README.es.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Χρησιμοποιώντας το API σήματος CO2 της tmrow για την παρακολούθηση της χρήσης ηλεκτρικής ενέργειας, δημιουργήστε μια επέκταση προγράμματος περιήγησης ώστε να έχετε μια υπενθύμιση απευθείας στο πρόγραμμα περιήγησής σας σχετικά με την κατανάλωση ηλεκτρικής ενέργειας στην περιοχή σας. Η χρήση αυτής της ad hoc επέκτασης θα σας βοηθήσει να λαμβάνετε αποφάσεις για τις δραστηριότητές σας με βάση αυτές τις πληροφορίες. -![extension screenshot](../../../../../translated_images/extension-screenshot.352c4c3ba54e4041ad2f6af749d562cc5705f527b5826efd53d11c3528f5ae45.el.png) +![extension screenshot](../../../../../translated_images/el/extension-screenshot.352c4c3ba54e4041ad2f6af749d562cc5705f527b5826efd53d11c3528f5ae45.png) ## Ξεκινώντας @@ -31,7 +31,7 @@ npm run build Για να εγκαταστήσετε στον Edge, χρησιμοποιήστε το μενού με τις 'τρεις τελείες' στην επάνω δεξιά γωνία του προγράμματος περιήγησης για να βρείτε τον πίνακα Επεκτάσεις. Από εκεί, επιλέξτε 'Φόρτωση μη συσκευασμένης' για να φορτώσετε μια νέα επέκταση. Ανοίξτε τον φάκελο 'dist' όταν σας ζητηθεί και η επέκταση θα φορτωθεί. Για να τη χρησιμοποιήσετε, θα χρειαστείτε ένα API key για το API του CO2 Signal ([αποκτήστε ένα εδώ μέσω email](https://www.co2signal.com/) - εισάγετε το email σας στο πλαίσιο αυτής της σελίδας) και τον [κωδικό για την περιοχή σας](http://api.electricitymap.org/v3/zones) που αντιστοιχεί στον [Χάρτη Ηλεκτρικής Ενέργειας](https://www.electricitymap.org/map) (στη Βοστώνη, για παράδειγμα, χρησιμοποιώ 'US-NEISO'). -![installing](../../../../../translated_images/install-on-edge.8bd0ee3ca7dcda1c5334b5195603a43c864e3b38d088b03d57376d25e77b9459.el.png) +![installing](../../../../../translated_images/el/install-on-edge.8bd0ee3ca7dcda1c5334b5195603a43c864e3b38d088b03d57376d25e77b9459.png) Μόλις εισαχθεί το API key και η περιοχή στη διεπαφή της επέκτασης, το χρωματιστό σημείο στη γραμμή επέκτασης του προγράμματος περιήγησης θα πρέπει να αλλάξει ώστε να αντικατοπτρίζει τη χρήση ενέργειας της περιοχής σας και να σας δώσει μια ένδειξη για δραστηριότητες υψηλής κατανάλωσης ενέργειας που θα ήταν κατάλληλες για εσάς. Η ιδέα πίσω από αυτό το σύστημα "σημείων" μου δόθηκε από την [επέκταση Energy Lollipop](https://energylollipop.com/) για τις εκπομπές της Καλιφόρνιας. diff --git a/translations/el/5-browser-extension/solution/translation/README.fr.md b/translations/el/5-browser-extension/solution/translation/README.fr.md index b5f31f662..2a85bfe12 100644 --- a/translations/el/5-browser-extension/solution/translation/README.fr.md +++ b/translations/el/5-browser-extension/solution/translation/README.fr.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Χρησιμοποιώντας το API C02 Signal της tmrow για την παρακολούθηση της κατανάλωσης ηλεκτρικής ενέργειας, δημιουργήστε μια επέκταση περιηγητή ώστε να έχετε μια υπενθύμιση απευθείας στον περιηγητή σας σχετικά με την κατανάλωση ηλεκτρικής ενέργειας στην περιοχή σας. Η χρήση αυτής της ειδικής επέκτασης θα σας βοηθήσει να κρίνετε τις δραστηριότητές σας με βάση αυτές τις πληροφορίες. -![στιγμιότυπο της επέκτασης](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.el.png) +![στιγμιότυπο της επέκτασης](../../../../../translated_images/el/extension-screenshot.0e7f5bfa110e92e3.png) ## Ξεκινώντας @@ -31,7 +31,7 @@ npm run build Για να την εγκαταστήσετε στον Edge, χρησιμοποιήστε το μενού με τις 'τρεις τελείες' στην επάνω δεξιά γωνία του περιηγητή για να βρείτε τον πίνακα Επεκτάσεων. Από εκεί, επιλέξτε 'Φόρτωση αποσυμπιεσμένης επέκτασης' για να φορτώσετε μια νέα επέκταση. Ανοίξτε τον φάκελο 'dist' όταν σας ζητηθεί και η επέκταση θα φορτωθεί. Για να τη χρησιμοποιήσετε, θα χρειαστείτε ένα API key για το API του CO2 Signal ([αποκτήστε ένα εδώ μέσω email](https://www.co2signal.com/) - εισάγετε το email σας στο πεδίο αυτής της σελίδας) και τον [κωδικό για την περιοχή σας](http://api.electricitymap.org/v3/zones) που αντιστοιχεί στον [Χάρτη Ηλεκτρικής Ενέργειας](https://www.electricitymap.org/map) (για παράδειγμα, στη Βοστώνη χρησιμοποιώ τον 'US-NEISO'). -![εγκατάσταση](../../../../../translated_images/install-on-edge.78634f02842c4828.el.png) +![εγκατάσταση](../../../../../translated_images/el/install-on-edge.78634f02842c4828.png) Αφού εισάγετε το API key και την περιοχή στη διεπαφή της επέκτασης, η χρωματιστή κουκκίδα στη γραμμή επέκτασης του περιηγητή θα πρέπει να αλλάζει για να αντικατοπτρίζει την κατανάλωση ενέργειας της περιοχής σας και να σας δίνει μια ένδειξη για τις ενεργοβόρες δραστηριότητες που θα ήταν κατάλληλο να εκτελέσετε. Η ιδέα πίσω από αυτό το σύστημα 'κουκκίδων' μου δόθηκε από την [επέκταση Energy Lollipop](https://energylollipop.com/) για τις εκπομπές στην Καλιφόρνια. diff --git a/translations/el/5-browser-extension/solution/translation/README.hi.md b/translations/el/5-browser-extension/solution/translation/README.hi.md index b2a3fb871..9adbe34ce 100644 --- a/translations/el/5-browser-extension/solution/translation/README.hi.md +++ b/translations/el/5-browser-extension/solution/translation/README.hi.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Χρησιμοποιώντας το API CO2 Signal της tmrow για την παρακολούθηση της χρήσης ηλεκτρικής ενέργειας, δημιουργήθηκε μια επέκταση περιηγητή που σας υπενθυμίζει πόσο έντονη είναι η χρήση ηλεκτρικής ενέργειας στην περιοχή σας μέσω του περιηγητή σας. Η χρήση αυτής της επέκτασης μπορεί να σας βοηθήσει να λαμβάνετε αποφάσεις για τις δραστηριότητές σας με βάση αυτές τις πληροφορίες. -![Στιγμιότυπο Επέκτασης](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.el.png) +![Στιγμιότυπο Επέκτασης](../../../../../translated_images/el/extension-screenshot.0e7f5bfa110e92e3.png) ## Ξεκινώντας @@ -31,7 +31,7 @@ npm run build Για να εγκαταστήσετε στον Edge, χρησιμοποιήστε το μενού "τρεις τελείες" στην επάνω δεξιά γωνία του περιηγητή για να βρείτε το πάνελ επεκτάσεων. Από εκεί, επιλέξτε "Φόρτωση μη συσκευασμένης επέκτασης". Στο προτρεπτικό μήνυμα, ανοίξτε τον φάκελο 'dist' και η επέκταση θα φορτωθεί. Για να τη χρησιμοποιήσετε, θα χρειαστείτε ένα API key από το CO2 Signal ([λάβετε το μέσω email εδώ](https://www.co2signal.com/) - εισάγετε το email σας στο κουτί αυτής της σελίδας) και [τον κωδικό της περιοχής σας](http://api.electricitymap.org/v3/zones) από τον [χάρτη ηλεκτρικής ενέργειας](https://www.electricitymap.org/map) (για παράδειγμα, στη Βοστώνη, χρησιμοποιώ το 'US-NEISO'). -![Εγκατάσταση](../../../../../translated_images/install-on-edge.78634f02842c4828.el.png) +![Εγκατάσταση](../../../../../translated_images/el/install-on-edge.78634f02842c4828.png) Μόλις εισαχθούν το API key και η περιοχή στη διεπαφή της επέκτασης, η χρωματιστή κουκκίδα στη γραμμή επέκτασης του περιηγητή θα πρέπει να αλλάξει ώστε να αντικατοπτρίζει τη χρήση ενέργειας της περιοχής σας και να σας δώσει έναν δείκτη για το ποιες δραστηριότητες έντονης ενέργειας είναι κατάλληλες για την απόδοσή σας. Η ιδέα πίσω από αυτό το σύστημα "κουκκίδας" μου δόθηκε από την επέκταση [Energy Lollipop](https://energylollipop.com/) για τις εκπομπές της Καλιφόρνιας. diff --git a/translations/el/5-browser-extension/solution/translation/README.it.md b/translations/el/5-browser-extension/solution/translation/README.it.md index cac6d73df..657e25e63 100644 --- a/translations/el/5-browser-extension/solution/translation/README.it.md +++ b/translations/el/5-browser-extension/solution/translation/README.it.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Θα χρησιμοποιηθεί το API Signal CO2 της tmrow για την παρακολούθηση της χρήσης ηλεκτρικής ενέργειας, ώστε να δημιουργηθεί μια επέκταση για το πρόγραμμα περιήγησης που θα παρέχει υπενθυμίσεις απευθείας στον περιηγητή σας σχετικά με το πόσο επιβαρυμένη είναι η χρήση ηλεκτρικής ενέργειας στην περιοχή σας. Η χρήση αυτής της ειδικής επέκτασης θα βοηθήσει στην αξιολόγηση των δραστηριοτήτων σας με βάση αυτές τις πληροφορίες. -![στιγμιότυπο οθόνης της επέκτασης](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.el.png) +![στιγμιότυπο οθόνης της επέκτασης](../../../../../translated_images/el/extension-screenshot.0e7f5bfa110e92e3.png) ## Ξεκινώντας @@ -31,7 +31,7 @@ npm run build Για εγκατάσταση στον Edge, χρησιμοποιήστε το μενού "τρεις τελείες" στην επάνω δεξιά γωνία του προγράμματος περιήγησης για να βρείτε τον πίνακα Επεκτάσεις. Εάν δεν είναι ήδη ενεργοποιημένη, ενεργοποιήστε τη Λειτουργία προγραμματιστή (κάτω αριστερά). Επιλέξτε "Φόρτωση μη συμπιεσμένου" για να φορτώσετε μια νέα επέκταση. Ανοίξτε τον φάκελο "dist" στο prompt και η επέκταση θα φορτωθεί. Για να τη χρησιμοποιήσετε, θα χρειαστείτε ένα API key για το API του CO2 Signal (μπορείτε [να το αποκτήσετε μέσω email εδώ](https://www.co2signal.com/) - εισάγετε το email σας στο πεδίο αυτής της σελίδας) και τον [κωδικό για την περιοχή σας](http://api.electricitymap.org/v3/zones) που αντιστοιχεί στον [ηλεκτρικό χάρτη](https://www.electricitymap.org/map) (για παράδειγμα, στη Βοστώνη, "US-NEISO"). -![εγκατάσταση](../../../../../translated_images/install-on-edge.78634f02842c4828.el.png) +![εγκατάσταση](../../../../../translated_images/el/install-on-edge.78634f02842c4828.png) Μόλις εισαχθούν το API key και η περιοχή στη διεπαφή της επέκτασης, το χρωματιστό σημείο στη γραμμή της επέκτασης του προγράμματος περιήγησης θα πρέπει να αλλάξει για να αντικατοπτρίζει τη χρήση ενέργειας της περιοχής και να παρέχει μια ένδειξη για το ποιες δραστηριότητες υψηλής κατανάλωσης ενέργειας θα ήταν κατάλληλες να εκτελεστούν. Η ιδέα πίσω από αυτό το σύστημα "σημείων" έχει εμπνευστεί από την [επέκταση Energy Lollipop](https://energylollipop.com/) για τις εκπομπές της Καλιφόρνιας. diff --git a/translations/el/5-browser-extension/solution/translation/README.ja.md b/translations/el/5-browser-extension/solution/translation/README.ja.md index 39dfd8069..9eb1106de 100644 --- a/translations/el/5-browser-extension/solution/translation/README.ja.md +++ b/translations/el/5-browser-extension/solution/translation/README.ja.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Χρησιμοποιώντας το API CO2 Signal της tmrow, θα δημιουργήσουμε μια επέκταση περιηγητή που εμφανίζει υπενθυμίσεις σχετικά με το πόση ενέργεια καταναλώνεται στην περιοχή σας. Αυτή η πληροφορία θα σας βοηθήσει να λαμβάνετε αποφάσεις για τις δραστηριότητές σας με βάση την κατανάλωση ενέργειας. -![extension screenshot](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.el.png) +![extension screenshot](../../../../../translated_images/el/extension-screenshot.0e7f5bfa110e92e3.png) ## Εισαγωγή @@ -31,7 +31,7 @@ npm run build Για να την εγκαταστήσετε στον Edge, βρείτε το πάνελ "Επεκτάσεις" από το μενού με τις "τρεις τελείες" στην επάνω δεξιά γωνία του περιηγητή. Από εκεί, επιλέξτε "Load Unpacked" και φορτώστε τη νέα επέκταση. Όταν σας ζητηθεί, ανοίξτε τον φάκελο "dist" και η επέκταση θα φορτωθεί. Για να τη χρησιμοποιήσετε, θα χρειαστείτε ένα API Key για το CO2 Signal ([αποκτήστε ένα εδώ μέσω email](https://www.co2signal.com/) - εισάγετε το email σας στο πλαίσιο αυτής της σελίδας) και τον [κωδικό για την περιοχή σας](http://api.electricitymap.org/v3/zones) από τον [Electricity Map](https://www.electricitymap.org/map) (για παράδειγμα, για τη Βοστώνη χρησιμοποιείται το 'US-NEISO'). -![installing](../../../../../translated_images/install-on-edge.78634f02842c4828.el.png) +![installing](../../../../../translated_images/el/install-on-edge.78634f02842c4828.png) Αφού εισαγάγετε το API Key και την περιοχή στη διεπαφή της επέκτασης, μια χρωματιστή κουκκίδα θα εμφανιστεί στη γραμμή επέκτασης του περιηγητή σας. Η κουκκίδα αυτή θα αλλάζει χρώμα, αντικατοπτρίζοντας την κατανάλωση ενέργειας στην περιοχή σας, και θα σας βοηθά να αποφασίσετε ποιες δραστηριότητες που απαιτούν ενέργεια είναι κατάλληλες να πραγματοποιηθούν. Η ιδέα αυτού του "συστήματος κουκκίδας" προέρχεται από την επέκταση [Energy Lollipop](https://energylollipop.com/) για τις εκπομπές στην Καλιφόρνια. diff --git a/translations/el/5-browser-extension/solution/translation/README.ms.md b/translations/el/5-browser-extension/solution/translation/README.ms.md index 9ba1c1784..1c5cf5160 100644 --- a/translations/el/5-browser-extension/solution/translation/README.ms.md +++ b/translations/el/5-browser-extension/solution/translation/README.ms.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Χρησιμοποιώντας το API CO2 Signal της tmrow για την παρακολούθηση της κατανάλωσης ηλεκτρικής ενέργειας, δημιουργήστε μια επέκταση περιηγητή ώστε να λαμβάνετε ειδοποιήσεις στον περιηγητή σας σχετικά με το πόσο έντονη είναι η κατανάλωση ηλεκτρικής ενέργειας στην περιοχή σας. Η χρήση αυτής της επέκτασης μπορεί να σας βοηθήσει να λαμβάνετε αποφάσεις για τις δραστηριότητές σας με βάση αυτές τις πληροφορίες. -![στιγμιότυπο οθόνης της επέκτασης περιηγητή](../../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.el.png) +![στιγμιότυπο οθόνης της επέκτασης περιηγητή](../../../../../translated_images/el/extension-screenshot.0e7f5bfa110e92e3.png) ## Ξεκινώντας @@ -31,7 +31,7 @@ npm run build Για να την εγκαταστήσετε στον Edge, χρησιμοποιήστε το μενού με τις 'τρεις τελείες' στην επάνω δεξιά γωνία του περιηγητή για να βρείτε τον πίνακα Επεκτάσεων. Από εκεί, επιλέξτε 'Load Unpacked' για να φορτώσετε τη νέα επέκταση. Ανοίξτε τον φάκελο 'dist' όταν σας ζητηθεί και η επέκταση θα φορτωθεί. Για να τη χρησιμοποιήσετε, θα χρειαστείτε ένα API key για το API CO2 Signal ([αποκτήστε ένα εδώ μέσω email](https://www.co2signal.com/) - εισάγετε το email σας στο πεδίο της σελίδας) και [έναν κωδικό για την περιοχή σας](http://api.electricitymap.org/v3/zones) που αντιστοιχεί στον [Χάρτη Ηλεκτρικής Ενέργειας](https://www.electricitymap.org/map) (για παράδειγμα, στη Βοστώνη, χρησιμοποιώ το 'US-NEISO'). -![κατέβασμα](../../../../../translated_images/install-on-edge.78634f02842c4828.el.png) +![κατέβασμα](../../../../../translated_images/el/install-on-edge.78634f02842c4828.png) Αφού εισαγάγετε το API key και την περιοχή στη διεπαφή της επέκτασης, η χρωματιστή κουκκίδα στη γραμμή της επέκτασης του περιηγητή θα αλλάζει για να αντικατοπτρίζει την κατανάλωση ενέργειας της περιοχής σας και θα σας δίνει ενδείξεις για το ποιες δραστηριότητες είναι κατάλληλες να κάνετε. Η ιδέα πίσω από αυτό το σύστημα 'κουκκίδων' μου δόθηκε από την [ενεργειακή επέκταση περιηγητή Lollipop](https://energylollipop.com/) για τις εκπομπές στην Καλιφόρνια. diff --git a/translations/el/5-browser-extension/start/README.md b/translations/el/5-browser-extension/start/README.md index e8357d560..6ef5e041c 100644 --- a/translations/el/5-browser-extension/start/README.md +++ b/translations/el/5-browser-extension/start/README.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Χρησιμοποιώντας το API C02 Signal της tmrow για την παρακολούθηση της κατανάλωσης ηλεκτρικής ενέργειας, δημιουργήστε μια επέκταση περιηγητή ώστε να έχετε μια υπενθύμιση απευθείας στον περιηγητή σας σχετικά με το πόσο βαριά είναι η κατανάλωση ηλεκτρικής ενέργειας στην περιοχή σας. Η περιστασιακή χρήση αυτής της επέκτασης θα σας βοηθήσει να λαμβάνετε αποφάσεις για τις δραστηριότητές σας με βάση αυτές τις πληροφορίες. -![screenshot επέκτασης](../../../../translated_images/extension-screenshot.0e7f5bfa110e92e3.el.png) +![screenshot επέκτασης](../../../../translated_images/el/extension-screenshot.0e7f5bfa110e92e3.png) ## Ξεκινώντας @@ -31,7 +31,7 @@ npm run build Για να εγκαταστήσετε την επέκταση στον Edge, χρησιμοποιήστε το μενού με τις 'τρεις τελείες' στην επάνω δεξιά γωνία του περιηγητή για να βρείτε τον πίνακα Επεκτάσεων. Από εκεί, επιλέξτε 'Φόρτωση μη συσκευασμένης' για να φορτώσετε μια νέα επέκταση. Ανοίξτε τον φάκελο 'dist' όταν σας ζητηθεί και η επέκταση θα φορτωθεί. Για να τη χρησιμοποιήσετε, θα χρειαστείτε ένα API key για το API του CO2 Signal ([αποκτήστε ένα εδώ μέσω email](https://www.co2signal.com/) - εισάγετε το email σας στο πλαίσιο αυτής της σελίδας) και τον [κωδικό για την περιοχή σας](http://api.electricitymap.org/v3/zones) που αντιστοιχεί στον [Χάρτη Ηλεκτρικής Ενέργειας](https://www.electricitymap.org/map) (για παράδειγμα, στη Βοστώνη χρησιμοποιώ τον 'US-NEISO'). -![εγκατάσταση](../../../../translated_images/install-on-edge.78634f02842c4828.el.png) +![εγκατάσταση](../../../../translated_images/el/install-on-edge.78634f02842c4828.png) Μόλις εισάγετε το API key και την περιοχή στη διεπαφή της επέκτασης, η χρωματιστή κουκκίδα στη γραμμή εργαλείων της επέκτασης του περιηγητή θα αλλάξει για να αντικατοπτρίζει την κατανάλωση ενέργειας της περιοχής σας και να σας δώσει μια ένδειξη για το ποιες δραστηριότητες με υψηλή κατανάλωση ενέργειας είναι κατάλληλες να εκτελέσετε. Η ιδέα πίσω από αυτό το σύστημα 'κουκκίδας' μου δόθηκε από την [επέκταση Energy Lollipop](https://energylollipop.com/) για τις εκπομπές της Καλιφόρνια. diff --git a/translations/el/6-space-game/2-drawing-to-canvas/README.md b/translations/el/6-space-game/2-drawing-to-canvas/README.md index 645302059..3cebda6a2 100644 --- a/translations/el/6-space-game/2-drawing-to-canvas/README.md +++ b/translations/el/6-space-game/2-drawing-to-canvas/README.md @@ -105,7 +105,7 @@ quadrantChart Power-up: [0.7, 0.6] UI Elements: [0.9, 0.1] ``` -![το πλέγμα του καμβά](../../../../translated_images/canvas_grid.5f209da785ded492.el.png) +![το πλέγμα του καμβά](../../../../translated_images/el/canvas_grid.5f209da785ded492.png) > Εικόνα από [MDN](https://developer.mozilla.org/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes) Για να σχεδιάσετε στο στοιχείο καμβά, θα ακολουθήσετε την ίδια διαδικασία τριών βημάτων που αποτελεί τη βάση όλων των γραφικών καμβά. Μόλις το κάνετε μερικές φορές, γίνεται δεύτερη φύση: @@ -323,11 +323,11 @@ flowchart TD - Πλοίο ήρωα - ![Πλοίο ήρωα](../../../../translated_images/player.dd24c1afa8c71e9b.el.png) + ![Πλοίο ήρωα](../../../../translated_images/el/player.dd24c1afa8c71e9b.png) - Μονάδα 5*5 τεράτων - ![Πλοίο τέρατος](../../../../translated_images/enemyShip.5df2a822c16650c2.el.png) + ![Πλοίο τέρατος](../../../../translated_images/el/enemyShip.5df2a822c16650c2.png) ### Προτεινόμενα βήματα για να ξεκινήσετε την ανάπτυξη @@ -463,7 +463,7 @@ for (let x = START_X; x < STOP_X; x += ENEMY_SPACING) { Το τελικό αποτέλεσμα θα πρέπει να μοιάζει ως εξής: -![Black screen with a hero and 5*5 monsters](../../../../translated_images/partI-solution.36c53b48c9ffae2a.el.png) +![Black screen with a hero and 5*5 monsters](../../../../translated_images/el/partI-solution.36c53b48c9ffae2a.png) ## Λύση diff --git a/translations/el/6-space-game/5-keeping-score/README.md b/translations/el/6-space-game/5-keeping-score/README.md index 04e002805..92825578d 100644 --- a/translations/el/6-space-game/5-keeping-score/README.md +++ b/translations/el/6-space-game/5-keeping-score/README.md @@ -155,7 +155,7 @@ sequenceDiagram end ``` - **Σύστημα σκοραρίσματος**: Κάθε εχθρικό πλοίο που καταστρέφεται δίνει 100 πόντους (οι στρογγυλοί αριθμοί είναι πιο εύκολοι για τον παίκτη να υπολογίζει νοητικά). Το σκορ εμφανίζεται στην κάτω αριστερή γωνία. -- **Μετρητής ζωών**: Ο ήρωάς σου ξεκινά με τρεις ζωές - ένα πρότυπο που καθιερώθηκε από τα πρώιμα arcade παιχνίδια για να ισορροπήσει την πρόκληση με το παικτικό ενδιαφέρον. Κάθε σύγκρουση με εχθρό κοστίζει μια ζωή. Οι εναπομείνασες ζωές εμφανίζονται κάτω δεξιά με εικονίδια πλοίων ![life image](../../../../translated_images/life.6fb9f50d53ee0413.el.png). +- **Μετρητής ζωών**: Ο ήρωάς σου ξεκινά με τρεις ζωές - ένα πρότυπο που καθιερώθηκε από τα πρώιμα arcade παιχνίδια για να ισορροπήσει την πρόκληση με το παικτικό ενδιαφέρον. Κάθε σύγκρουση με εχθρό κοστίζει μια ζωή. Οι εναπομείνασες ζωές εμφανίζονται κάτω δεξιά με εικονίδια πλοίων ![life image](../../../../translated_images/el/life.6fb9f50d53ee0413.png). ## Ας Ξεκινήσουμε! diff --git a/translations/el/7-bank-project/1-template-route/README.md b/translations/el/7-bank-project/1-template-route/README.md index 9c88b917e..5bad54661 100644 --- a/translations/el/7-bank-project/1-template-route/README.md +++ b/translations/el/7-bank-project/1-template-route/README.md @@ -645,7 +645,7 @@ sequenceDiagram Η χρήση του `history.pushState` δημιουργεί νέες καταχωρήσεις στο ιστορικό πλοήγησης. Μπορείτε να το ελέγξετε κρατώντας πατημένο το *κουμπί πίσω* του προγράμματος περιήγησης, θα εμφανιστεί κάτι παρόμοιο με αυτό: -![Screenshot of navigation history](../../../../translated_images/history.7fdabbafa521e064.el.png) +![Screenshot of navigation history](../../../../translated_images/el/history.7fdabbafa521e064.png) Αν δοκιμάσετε να πατήσετε το κουμπί πίσω μερικές φορές, θα δείτε ότι αλλάζει το τρέχον URL και το ιστορικό ενημερώνεται, αλλά το ίδιο πρότυπο συνεχίζει να εμφανίζεται. diff --git a/translations/el/7-bank-project/2-forms/README.md b/translations/el/7-bank-project/2-forms/README.md index 14160e38e..4eaf877b7 100644 --- a/translations/el/7-bank-project/2-forms/README.md +++ b/translations/el/7-bank-project/2-forms/README.md @@ -292,7 +292,7 @@ graph TD 2. Παρατηρήστε τις αλλαγές στη γραμμή διευθύνσεων του browser 3. Δείτε πώς η σελίδα φορτώνει ξανά και εμφανίζονται δεδομένα στο URL -![Screenshot of the browser's URL change after clicking the Register button](../../../../translated_images/click-register.e89a30bf0d4bc9ca.el.png) +![Screenshot of the browser's URL change after clicking the Register button](../../../../translated_images/el/click-register.e89a30bf0d4bc9ca.png) ### Σύγκριση Μεθόδων HTTP @@ -346,7 +346,7 @@ graph TD 2. **Κάντε κλικ** στο κουμπί "Δημιουργία Λογαριασμού" 3. **Παρατηρήστε** την απόκριση του διακομιστή στον browser σας -![A browser window at the address localhost:5000/api/accounts, showing a JSON string with user data](../../../../translated_images/form-post.61de4ca1b964d91a.el.png) +![A browser window at the address localhost:5000/api/accounts, showing a JSON string with user data](../../../../translated_images/el/form-post.61de4ca1b964d91a.png) **Τι πρέπει να δείτε:** - **Ο browser ανακατευθύνει** στη διεύθυνση endpoint του API @@ -609,7 +609,7 @@ async function register() { 3. **Πατήστε** "Create Account" 4. **Παρατηρήστε** τα μηνύματα της κονσόλας και το feedback προς το χρήστη -![Screenshot showing log message in the browser console](../../../../translated_images/browser-console.efaf0b51aaaf6778.el.png) +![Screenshot showing log message in the browser console](../../../../translated_images/el/browser-console.efaf0b51aaaf6778.png) **Τι θα δείτε:** - **Κατάσταση φόρτωσης** εμφανίζεται στο κουμπί υποβολής @@ -783,7 +783,7 @@ input:focus:invalid { 3. **Δοκιμάστε** ειδικούς χαρακτήρες στο πεδίο ονόματος χρήστη 4. **Πληκτρολογήστε** αρνητικό ποσό υπολοίπου -![Screenshot showing the validation error when trying to submit the form](../../../../translated_images/validation-error.8bd23e98d416c22f.el.png) +![Screenshot showing the validation error when trying to submit the form](../../../../translated_images/el/validation-error.8bd23e98d416c22f.png) **Τι θα παρατηρήσετε:** - **Ο browser εμφανίζει** ενσωματωμένα μηνύματα επικύρωσης @@ -943,7 +943,7 @@ timeline Παρακάτω είναι ένα παράδειγμα για το πως μπορεί να μοιάζει η τελική σελίδα σύνδεσης μετά από λίγη διαμόρφωση στυλ: -![Στιγμιότυπο οθόνης της σελίδας σύνδεσης μετά την προσθήκη στυλ CSS](../../../../translated_images/result.96ef01f607bf856a.el.png) +![Στιγμιότυπο οθόνης της σελίδας σύνδεσης μετά την προσθήκη στυλ CSS](../../../../translated_images/el/result.96ef01f607bf856a.png) ## Μετά την Διάλεξη Quiz diff --git a/translations/el/7-bank-project/3-data/README.md b/translations/el/7-bank-project/3-data/README.md index bb7856351..9af376063 100644 --- a/translations/el/7-bank-project/3-data/README.md +++ b/translations/el/7-bank-project/3-data/README.md @@ -156,7 +156,7 @@ sequenceDiagram Server->>Browser: Επιστρέφει πλήρη σελίδα HTML Browser->>User: Εμφανίζει νέα σελίδα (αστραπή/επανεκκίνηση) ``` -![Ροή εργασίας ενημέρωσης σε εφαρμογή πολλών σελίδων](../../../../translated_images/mpa.7f7375a1a2d4aa77.el.png) +![Ροή εργασίας ενημέρωσης σε εφαρμογή πολλών σελίδων](../../../../translated_images/el/mpa.7f7375a1a2d4aa77.png) **Γιατί αυτή η προσέγγιση φαινόταν αδέξια:** - Κάθε κλικ σήμαινε ανακατασκευή ολόκληρης της σελίδας από την αρχή @@ -182,7 +182,7 @@ sequenceDiagram JavaScript->>Browser: Ενημερώνει συγκεκριμένα στοιχεία σελίδας Browser->>User: Εμφανίζει ενημερωμένο περιεχόμενο (χωρίς ανανέωση) ``` -![Ροή εργασίας ενημέρωσης σε εφαρμογή μίας σελίδας](../../../../translated_images/spa.268ec73b41f992c2.el.png) +![Ροή εργασίας ενημέρωσης σε εφαρμογή μίας σελίδας](../../../../translated_images/el/spa.268ec73b41f992c2.png) **Γιατί οι SPA φαίνονται πολύ καλύτερες:** - Ενημερώνει μόνο τα μέρη που πραγματικά άλλαξαν (έξυπνο, έτσι;) @@ -516,7 +516,7 @@ if (data.error) { Τώρα, όταν δοκιμάζετε με έναν άκυρο λογαριασμό, θα δείτε ένα χρήσιμο μήνυμα σφάλματος απευθείας στη σελίδα! -![Screenshot showing the error message displayed during login](../../../../translated_images/login-error.416fe019b36a6327.el.png) +![Screenshot showing the error message displayed during login](../../../../translated_images/el/login-error.416fe019b36a6327.png) #### Βήμα 4: Να Είστε Περιεκτικοί με την Προσβασιμότητα @@ -950,7 +950,7 @@ timeline Να πώς θα μπορούσε να μοιάζει ένα τελειοποιημένο dashboard: -![Screenshot of an example result of the dashboard after styling](../../../../translated_images/screen2.123c82a831a1d14a.el.png) +![Screenshot of an example result of the dashboard after styling](../../../../translated_images/el/screen2.123c82a831a1d14a.png) Μην νιώθετε ότι πρέπει να το αντιγράψετε ακριβώς - χρησιμοποιήστε το ως έμπνευση και κάντε το δικό σας! diff --git a/translations/el/7-bank-project/4-state-management/README.md b/translations/el/7-bank-project/4-state-management/README.md index 2d7af524c..5e260985d 100644 --- a/translations/el/7-bank-project/4-state-management/README.md +++ b/translations/el/7-bank-project/4-state-management/README.md @@ -187,7 +187,7 @@ mindmap Αντί να κυνηγάμε την ουρά μας, θα δημιουργήσουμε ένα **κεντρικό σύστημα διαχείρισης κατάστασης**. Σκεφτείτε το σαν να έχετε ένα πραγματικά οργανωμένο άτομο υπεύθυνο για όλα τα σημαντικά: -![Schema showing the data flows between the HTML, user actions and state](../../../../translated_images/data-flow.fa2354e0908fecc8.el.png) +![Schema showing the data flows between the HTML, user actions and state](../../../../translated_images/el/data-flow.fa2354e0908fecc8.png) ```mermaid flowchart TD @@ -798,7 +798,7 @@ timeline Εδώ ένα παράδειγμα αποτελέσματος μετά την ολοκλήρωση της ανάθεσης: -![Στιγμιότυπο που δείχνει παράδειγμα διαλόγου "Προσθήκη συναλλαγής"](../../../../translated_images/dialog.93bba104afeb79f1.el.png) +![Στιγμιότυπο που δείχνει παράδειγμα διαλόγου "Προσθήκη συναλλαγής"](../../../../translated_images/el/dialog.93bba104afeb79f1.png) --- diff --git a/translations/el/7-bank-project/4-state-management/assignment.md b/translations/el/7-bank-project/4-state-management/assignment.md index 95cc87803..6d399d1b2 100644 --- a/translations/el/7-bank-project/4-state-management/assignment.md +++ b/translations/el/7-bank-project/4-state-management/assignment.md @@ -112,7 +112,7 @@ CO_OP_TRANSLATOR_METADATA: **Αναμενόμενο Αποτέλεσμα:** Μετά την ολοκλήρωση αυτής της εργασίας, η τραπεζική σας εφαρμογή θα πρέπει να διαθέτει ένα πλήρως λειτουργικό χαρακτηριστικό "Προσθήκη Συναλλαγής" που φαίνεται και λειτουργεί επαγγελματικά: -![Στιγμιότυπο οθόνης που δείχνει ένα παράδειγμα διαλόγου "Προσθήκη Συναλλαγής"](../../../../translated_images/dialog.93bba104afeb79f1.el.png) +![Στιγμιότυπο οθόνης που δείχνει ένα παράδειγμα διαλόγου "Προσθήκη Συναλλαγής"](../../../../translated_images/el/dialog.93bba104afeb79f1.png) ## Δοκιμή της Υλοποίησής σας diff --git a/translations/el/7-bank-project/README.md b/translations/el/7-bank-project/README.md index a53246826..077e4d1ea 100644 --- a/translations/el/7-bank-project/README.md +++ b/translations/el/7-bank-project/README.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: Σε αυτό το έργο, θα μάθετε πώς να δημιουργήσετε μια φανταστική τράπεζα. Αυτά τα μαθήματα περιλαμβάνουν οδηγίες για το πώς να σχεδιάσετε μια web εφαρμογή και να παρέχετε διαδρομές, να δημιουργήσετε φόρμες, να διαχειριστείτε την κατάσταση (state) και να ανακτήσετε δεδομένα από ένα API από το οποίο μπορείτε να αντλήσετε τα δεδομένα της τράπεζας. -| ![Screen1](../../../translated_images/screen1.baccbba0f1f93364.el.png) | ![Screen2](../../../translated_images/screen2.123c82a831a1d14a.el.png) | +| ![Screen1](../../../translated_images/el/screen1.baccbba0f1f93364.png) | ![Screen2](../../../translated_images/el/screen2.123c82a831a1d14a.png) | |--------------------------------|--------------------------------| ## Μαθήματα diff --git a/translations/el/8-code-editor/1-using-a-code-editor/README.md b/translations/el/8-code-editor/1-using-a-code-editor/README.md index 243233728..cd9a2e79d 100644 --- a/translations/el/8-code-editor/1-using-a-code-editor/README.md +++ b/translations/el/8-code-editor/1-using-a-code-editor/README.md @@ -182,7 +182,7 @@ mindmap Μόλις φορτώσει όλα, θα δείτε έναν καθαρό χώρο εργασίας σχεδιασμένο να σας κρατάει συγκεντρωμένους σε αυτό που έχει σημασία – τον κώδικά σας! -![Προεπιλεγμένη διεπαφή VSCode.dev](../../../../translated_images/default-vscode-dev.5d06881d65c1b323.el.png) +![Προεπιλεγμένη διεπαφή VSCode.dev](../../../../translated_images/el/default-vscode-dev.5d06881d65c1b323.png) **Ας κάνουμε μια βόλτα στη γειτονιά:** - **Μπάρα Δραστηριοτήτων** (η γραμμή αριστερά): Η κύρια πλοήγησή σας με τον Εξερευνητή 📁, Αναζήτηση 🔍, Έλεγχο Πηγής 🌿, Επεκτάσεις 🧩, και Ρυθμίσεις ⚙️ @@ -229,7 +229,7 @@ flowchart TB 1. Πλοηγηθείτε στο [vscode.dev](https://vscode.dev) αν δεν είστε ήδη εκεί 2. Βρείτε το κουμπί "Άνοιγμα Αποθετηρίου Απομακρυσμένα" στην οθόνη υποδοχής και κάντε κλικ - ![Άνοιγμα απομακρυσμένου αποθετηρίου](../../../../translated_images/open-remote-repository.bd9c2598b8949e7f.el.png) + ![Άνοιγμα απομακρυσμένου αποθετηρίου](../../../../translated_images/el/open-remote-repository.bd9c2598b8949e7f.png) 3. Επικολλήστε οποιοδήποτε URL αποθετηρίου GitHub (δοκιμάστε αυτό: `https://github.com/microsoft/Web-Dev-For-Beginners`) 4. Πατήστε Enter και δείτε τη μαγεία να συμβαίνει! @@ -238,7 +238,7 @@ flowchart TB Θέλετε να νιώσετε σαν μάγος της κωδικοποίησης; Δοκιμάστε αυτήν τη συντόμευση πληκτρολογίου: Ctrl+Shift+P (ή Cmd+Shift+P στο Mac) για να ανοίξετε το Command Palette: -![Command Palette](../../../../translated_images/palette-menu.4946174e07f42622.el.png) +![Command Palette](../../../../translated_images/el/palette-menu.4946174e07f42622.png) **Το Command Palette είναι σαν μια μηχανή αναζήτησης για οτιδήποτε μπορείτε να κάνετε:** - Πληκτρολογήστε "open remote" και θα βρει το εργαλείο ανοίγματος αποθετηρίου για εσάς @@ -300,7 +300,7 @@ flowchart TB 3. Εισάγετε το όνομα αρχείου μαζί με την κατάλληλη επέκταση (`style.css`, `script.js`, `index.html`) 4. Πατήστε Enter για να δημιουργήσετε το αρχείο -![Δημιουργία νέου αρχείου](../../../../translated_images/create-new-file.2814e609c2af9aeb.el.png) +![Δημιουργία νέου αρχείου](../../../../translated_images/el/create-new-file.2814e609c2af9aeb.png) **Συμβουλές ονοματοδοσίας:** - Χρησιμοποιήστε περιγραφικά ονόματα που δείχνουν τον σκοπό του αρχείου @@ -318,7 +318,7 @@ flowchart TB 2. Ξεκινήστε να πληκτρολογείτε και δείτε τον VSCode.dev να σας βοηθάει με χρώματα, προτάσεις και ανίχνευση σφαλμάτων 3. Αποθηκεύστε τη δουλειά σας με Ctrl+S (Windows/Linux) ή Cmd+S (Mac) – παρόλο που αποθηκεύει αυτόματα! -![Επεξεργασία αρχείων στο VSCode.dev](../../../../translated_images/edit-a-file.52c0ee665ef19f08.el.png) +![Επεξεργασία αρχείων στο VSCode.dev](../../../../translated_images/el/edit-a-file.52c0ee665ef19f08.png) **Τα ωραία πράγματα που συμβαίνουν ενώ γράφετε κώδικα:** - Ο κώδικάς σας χρωματίζεται όμορφα και είναι εύκολος στην ανάγνωση @@ -339,7 +339,7 @@ flowchart TB 2. Τα τροποποιημένα αρχεία εμφανίζονται στην ενότητα "Αλλαγές" 3. Ο χρωματισμός δείχνει το είδος των αλλαγών: πράσινο για προσθήκες, κόκκινο για διαγραφές -![Προβολή αλλαγών στον Έλεγχο Πηγής](../../../../translated_images/working-tree.c58eec08e6335c79.el.png) +![Προβολή αλλαγών στον Έλεγχο Πηγής](../../../../translated_images/el/working-tree.c58eec08e6335c79.png) **Αποθήκευση της δουλειάς σας (η ροή commit):** @@ -431,7 +431,7 @@ mindmap 2. Περιηγηθείτε ή αναζητήστε κάτι συγκεκριμένο 3. Κάντε κλικ σε οτιδήποτε σας φαίνεται ενδιαφέρον για να μάθετε περισσότερα -![Περιβάλλον αγοράς επεκτάσεων](../../../../translated_images/extensions.eca0e0c7f59a10b5.el.png) +![Περιβάλλον αγοράς επεκτάσεων](../../../../translated_images/el/extensions.eca0e0c7f59a10b5.png) **Τι θα δείτε εκεί μέσα:** @@ -484,7 +484,7 @@ mindmap 3. Επιλέξτε "Extension Settings" από το αναδυόμενο μενού 4. Τροποποιήστε ό,τι θέλετε μέχρι να είναι όπως προτιμάτε -![Προσαρμογή ρυθμίσεων επέκτασης](../../../../translated_images/extension-settings.21c752ae4f4cdb78.el.png) +![Προσαρμογή ρυθμίσεων επέκτασης](../../../../translated_images/el/extension-settings.21c752ae4f4cdb78.png) **Συνηθισμένα πράγματα που μπορεί να θέλετε να ρυθμίσετε:** - Πώς μορφοποιείται ο κώδικάς σας (tabs ή κενά, μήκος γραμμής κ.λπ.) diff --git a/translations/el/8-code-editor/1-using-a-code-editor/assignment.md b/translations/el/8-code-editor/1-using-a-code-editor/assignment.md index 631dc6aee..b65ae27dd 100644 --- a/translations/el/8-code-editor/1-using-a-code-editor/assignment.md +++ b/translations/el/8-code-editor/1-using-a-code-editor/assignment.md @@ -78,7 +78,7 @@ CO_OP_TRANSLATOR_METADATA: 4. **Γράψτε** ένα μήνυμα commit: "Προσθήκη αρχικής δομής HTML" 5. **Κάντε κλικ** στο "Commit new file" για να αποθηκεύσετε τις αλλαγές σας -![Δημιουργία αρχικού αρχείου στο GitHub](../../../../translated_images/new-file-github.com.c886796d800e8056.el.png) +![Δημιουργία αρχικού αρχείου στο GitHub](../../../../translated_images/el/new-file-github.com.c886796d800e8056.png) **Τι επιτυγχάνει αυτή η αρχική ρύθμιση:** - **Καθιερώνει** σωστή δομή εγγράφου HTML5 με στοιχεία με νόημα @@ -104,7 +104,7 @@ CO_OP_TRANSLATOR_METADATA: ✅ **Δείκτης επιτυχίας**: Θα πρέπει να δείτε τα αρχεία του project σας στην πλαϊνή μπάρα του Explorer και το `index.html` διαθέσιμο για επεξεργασία στην κύρια περιοχή του editor. -![Project φορτωμένο στο VSCode.dev](../../../../translated_images/project-on-vscode.dev.e79815a9a95ee7fe.el.png) +![Project φορτωμένο στο VSCode.dev](../../../../translated_images/el/project-on-vscode.dev.e79815a9a95ee7fe.png) **Τι θα δείτε στη διεπαφή:** - **Πλαϊνή μπάρα Explorer**: **Εμφανίζει** τα αρχεία και τη δομή φακέλων του αποθετηρίου σας @@ -448,7 +448,7 @@ li:before { **Άμεσα αποτελέσματα μετά την εγκατάσταση:** Μόλις εγκατασταθεί το CodeSwing, θα δείτε μια ζωντανή προεπισκόπηση της ιστοσελίδας βιογραφικού σας να εμφανίζεται στον editor. Αυτό σας επιτρέπει να δείτε ακριβώς πώς φαίνεται η ιστοσελίδα σας καθώς κάνετε αλλαγές. -![Η επέκταση CodeSwing δείχνει ζωντανή προεπισκόπηση](../../../../translated_images/after-codeswing-extension-pb.0ebddddcf73b5509.el.png) +![Η επέκταση CodeSwing δείχνει ζωντανή προεπισκόπηση](../../../../translated_images/el/after-codeswing-extension-pb.0ebddddcf73b5509.png) **Κατανόηση της βελτιωμένης διεπαφής:** - **Διαχωρισμένη προβολή**: **Δείχνει** τον κώδικα στη μία πλευρά και τη ζωντανή προεπισκόπηση στην άλλη diff --git a/translations/el/9-chat-project/README.md b/translations/el/9-chat-project/README.md index 448d444a4..a57591cf1 100644 --- a/translations/el/9-chat-project/README.md +++ b/translations/el/9-chat-project/README.md @@ -60,7 +60,7 @@ print(response.choices[0].message.content) Δείτε πώς θα μοιάζει το τελικό σας έργο: -![Chat app interface showing conversation between user and AI assistant](../../../translated_images/screenshot.0a1ee0d123df681b.el.png) +![Chat app interface showing conversation between user and AI assistant](../../../translated_images/el/screenshot.0a1ee0d123df681b.png) ## 🗺️ Το Ταξίδι Μάθησής σας Μέσα από την Ανάπτυξη Εφαρμογών AI @@ -189,7 +189,7 @@ mindmap ``` **Κεντρική Αρχή**: Η ανάπτυξη εφαρμογών AI συνδυάζει τις παραδοσιακές δεξιότητες ανάπτυξης web με την ολοκλήρωση υπηρεσιών AI, δημιουργώντας έξυπνες εφαρμογές που φαίνονται φυσικές και ανταποκρίνονται στους χρήστες. -![GitHub Models AI Playground interface with model selection and testing area](../../../translated_images/playground.d2b927122224ff8f.el.png) +![GitHub Models AI Playground interface with model selection and testing area](../../../translated_images/el/playground.d2b927122224ff8f.png) **Τι κάνει το playground τόσο χρήσιμο:** - **Δοκιμάστε** διαφορετικά μοντέλα AI όπως GPT-4o-mini, Claude και άλλα (όλα δωρεάν!) @@ -199,7 +199,7 @@ mindmap Μόλις παίξετε λίγο, απλώς επιλέξτε την καρτέλα "Code" και διαλέξτε τη γλώσσα προγραμματισμού σας για να πάρετε τον κώδικα υλοποίησης που χρειάζεστε. -![Playground choice showing code generation options for different programming languages](../../../translated_images/playground-choice.1d23ba7d407f4758.el.png) +![Playground choice showing code generation options for different programming languages](../../../translated_images/el/playground-choice.1d23ba7d407f4758.png) ## Ρύθμιση της Ολοκλήρωσης Backend με Python @@ -2353,14 +2353,14 @@ mindmap - **Πλοηγηθείτε** στο [Web Dev For Beginners αποθετήριο](https://github.com/microsoft/Web-Dev-For-Beginners) - **Κάντε κλικ** στο "Use this template" στην πάνω δεξιά γωνία (βεβαιωθείτε ότι έχετε συνδεθεί στο GitHub) -![Create from template interface showing the green "Use this template" button](../../../translated_images/template.67ad477109d29a2b.el.png) +![Create from template interface showing the green "Use this template" button](../../../translated_images/el/template.67ad477109d29a2b.png) **Βήμα 2: Εκκίνηση Codespaces** - **Ανοίξτε** το νεοδημιουργημένο αποθετήριο σας - **Κάντε κλικ** στο πράσινο κουμπί "Code" και επιλέξτε "Codespaces" - **Επιλέξτε** "Create codespace on main" για να ξεκινήσετε το αναπτυξιακό σας περιβάλλον -![Create codespace interface with options for launching cloud development environment](../../../translated_images/codespace.bcecbdf5d2747d3d.el.png) +![Create codespace interface with options for launching cloud development environment](../../../translated_images/el/codespace.bcecbdf5d2747d3d.png) **Βήμα 3: Ρύθμιση Περιβάλλοντος** Μόλις φορτώσει ο Codespace σας, θα έχετε πρόσβαση σε: diff --git a/translations/el/README.md b/translations/el/README.md index 27665cc91..d63291ea5 100644 --- a/translations/el/README.md +++ b/translations/el/README.md @@ -72,13 +72,13 @@ CO_OP_TRANSLATOR_METADATA: Επισκεφθείτε [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) για να ξεκινήσετε! -![Background](../../translated_images/background.148a8d43afde5730.el.png) +![Background](../../translated_images/el/background.148a8d43afde5730.png) - Μαθήματα που καλύπτουν από βασικά μέχρι RAG. - Αλληλεπιδράστε με ιστορικούς χαρακτήρες χρησιμοποιώντας GenAI και την εφαρμογή συνοδού μας. - Διασκεδαστικό και συναρπαστικό αφήγημα, θα ταξιδεύετε στο χρόνο! -![character](../../translated_images/character.5c0dd8e067ffd693.el.png) +![character](../../translated_images/el/character.5c0dd8e067ffd693.png) Κάθε μάθημα περιλαμβάνει μια εργασία για ολοκλήρωση, έναν έλεγχο γνώσεων και μια πρόκληση για να σας καθοδηγήσει στη μάθηση θεμάτων όπως: @@ -115,7 +115,7 @@ CO_OP_TRANSLATOR_METADATA: Στο αντίγραφό σας αυτού του αποθετηρίου που δημιουργήσατε, κάντε κλικ στο κουμπί **Code** και επιλέξτε **Open with Codespaces**. Αυτό θα δημιουργήσει ένα νέο Codespace για να εργαστείτε μέσα. -![Codespace](../../translated_images/createcodespace.0238bbf4d7a8d955.el.png) +![Codespace](../../translated_images/el/createcodespace.0238bbf4d7a8d955.png) #### Εκτέλεση του προγράμματος σπουδών τοπικά στον υπολογιστή σας diff --git a/translations/el/for-teachers.md b/translations/el/for-teachers.md index 30fcb15eb..a2677c69f 100644 --- a/translations/el/for-teachers.md +++ b/translations/el/for-teachers.md @@ -42,10 +42,10 @@ CO_OP_TRANSLATOR_METADATA: - Το Moodle Cloud έχει περιορισμένη υποστήριξη Common Cartridge. Προτιμήστε το αρχείο Moodle παραπάνω, το οποίο μπορεί επίσης να μεταφορτωθεί στο Canvas. - Μετά την εισαγωγή, ελέγξτε τα modules, τις ημερομηνίες λήξης και τις ρυθμίσεις κουίζ ώστε να ταιριάζουν με το πρόγραμμα του εξαμήνου σας. -![Moodle](../../translated_images/moodle.94eb93d714a50cb2.el.png) +![Moodle](../../translated_images/el/moodle.94eb93d714a50cb2.png) > Το πρόγραμμα σπουδών σε μια τάξη Moodle -![Canvas](../../translated_images/canvas.fbd605ff8e5b8aff.el.png) +![Canvas](../../translated_images/el/canvas.fbd605ff8e5b8aff.png) > Το πρόγραμμα σπουδών στο Canvas ### Χρήση του αποθετηρίου απευθείας (χωρίς Classroom) diff --git a/translations/en/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/en/1-getting-started-lessons/1-intro-to-programming-languages/README.md index e34a37188..a46afa139 100644 --- a/translations/en/1-getting-started-lessons/1-intro-to-programming-languages/README.md +++ b/translations/en/1-getting-started-lessons/1-intro-to-programming-languages/README.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: This lesson introduces the fundamentals of programming languages. The topics discussed here are relevant to most modern programming languages today. In the 'Tools of the Trade' section, you'll explore software that can assist you as a developer. -![Intro Programming](../../../../translated_images/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.en.png) +![Intro Programming](../../../../translated_images/en/webdev101-programming.d6e3f98e61ac4bff0b27dcbf1c3f16c8ed46984866f2d29988929678b0058fde.png) > Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac) ## Pre-Lecture Quiz diff --git a/translations/en/1-getting-started-lessons/2-github-basics/README.md b/translations/en/1-getting-started-lessons/2-github-basics/README.md index a1c95a672..ab0c7ec08 100644 --- a/translations/en/1-getting-started-lessons/2-github-basics/README.md +++ b/translations/en/1-getting-started-lessons/2-github-basics/README.md @@ -11,7 +11,7 @@ CO_OP_TRANSLATOR_METADATA: This lesson introduces the basics of GitHub, a platform for hosting and managing changes to your code. -![Intro to GitHub](../../../../translated_images/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.en.png) +![Intro to GitHub](../../../../translated_images/en/webdev101-github.8846d7971abef6f947909b4f9d343e2a23778aa716ca6b9d71df7174ee5009ac.png) > Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac) ## Pre-Lecture Quiz @@ -289,7 +289,7 @@ First, find a repository (or **repo**) on GitHub that interests you and to which ✅ A great way to find 'beginner-friendly' repositories is to [search by the tag 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/). -![Copy a repo locally](../../../../translated_images/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.en.png) +![Copy a repo locally](../../../../translated_images/en/clone_repo.5085c48d666ead57664f050d806e325d7f883be6838c821e08bc823ab7c66665.png) There are several ways to copy code. One way is to "clone" the repository’s contents using HTTPS, SSH, or the GitHub CLI (Command Line Interface). diff --git a/translations/en/1-getting-started-lessons/3-accessibility/README.md b/translations/en/1-getting-started-lessons/3-accessibility/README.md index 23523782a..bcbb26336 100644 --- a/translations/en/1-getting-started-lessons/3-accessibility/README.md +++ b/translations/en/1-getting-started-lessons/3-accessibility/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # Creating Accessible Webpages -![All About Accessibility](../../../../translated_images/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.en.png) +![All About Accessibility](../../../../translated_images/en/webdev101-a11y.8ef3025c858d897a403a1a42c0897c76e11b724d9a8a0c0578dd4316f7507622.png) > Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac) ## Pre-Lecture Quiz diff --git a/translations/en/2-js-basics/1-data-types/README.md b/translations/en/2-js-basics/1-data-types/README.md index 61f9f4b77..b7cbe2985 100644 --- a/translations/en/2-js-basics/1-data-types/README.md +++ b/translations/en/2-js-basics/1-data-types/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript Basics: Data Types -![JavaScript Basics - Data types](../../../../translated_images/webdev101-js-datatypes.4cc470179730702c756480d3ffa46507f746e5975ebf80f99fdaaf1cff09a7f4.en.png) +![JavaScript Basics - Data types](../../../../translated_images/en/webdev101-js-datatypes.4cc470179730702c756480d3ffa46507f746e5975ebf80f99fdaaf1cff09a7f4.png) > Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac) ## Pre-Lecture Quiz diff --git a/translations/en/2-js-basics/2-functions-methods/README.md b/translations/en/2-js-basics/2-functions-methods/README.md index 299423d81..5018fdf2b 100644 --- a/translations/en/2-js-basics/2-functions-methods/README.md +++ b/translations/en/2-js-basics/2-functions-methods/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript Basics: Methods and Functions -![JavaScript Basics - Functions](../../../../translated_images/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.en.png) +![JavaScript Basics - Functions](../../../../translated_images/en/webdev101-js-functions.be049c4726e94f8b7605c36330ac42eeb5cd8ed02bcdd60fdac778174d6cb865.png) > Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac) ## Pre-Lecture Quiz diff --git a/translations/en/2-js-basics/3-making-decisions/README.md b/translations/en/2-js-basics/3-making-decisions/README.md index 3c907417e..56ec92ad7 100644 --- a/translations/en/2-js-basics/3-making-decisions/README.md +++ b/translations/en/2-js-basics/3-making-decisions/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript Basics: Making Decisions -![JavaScript Basics - Making decisions](../../../../translated_images/webdev101-js-decisions.69e1b20f272dd1f0b1cb2f8adaff3ed2a77c4f91db96d8a0594132a353fa189a.en.png) +![JavaScript Basics - Making decisions](../../../../translated_images/en/webdev101-js-decisions.69e1b20f272dd1f0b1cb2f8adaff3ed2a77c4f91db96d8a0594132a353fa189a.png) > Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac) diff --git a/translations/en/2-js-basics/4-arrays-loops/README.md b/translations/en/2-js-basics/4-arrays-loops/README.md index 64b3fceea..71af1d6fe 100644 --- a/translations/en/2-js-basics/4-arrays-loops/README.md +++ b/translations/en/2-js-basics/4-arrays-loops/README.md @@ -9,7 +9,7 @@ CO_OP_TRANSLATOR_METADATA: --> # JavaScript Basics: Arrays and Loops -![JavaScript Basics - Arrays](../../../../translated_images/webdev101-js-arrays.439d7528b8a294558d0e4302e448d193f8ad7495cc407539cc81f1afe904b470.en.png) +![JavaScript Basics - Arrays](../../../../translated_images/en/webdev101-js-arrays.439d7528b8a294558d0e4302e448d193f8ad7495cc407539cc81f1afe904b470.png) > Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac) ## Pre-Lecture Quiz