From 120ab74c705ab97b0c83bead8837961e85338d55 Mon Sep 17 00:00:00 2001 From: "localizeflow[bot]" Date: Fri, 24 Apr 2026 16:23:46 +0000 Subject: [PATCH] chore(i18n): sync translations with latest source changes (chunk 1/1, 12 changes) --- translations/el/.co-op-translator.json | 10 +- translations/el/AGENTS.md | 322 ++++++++++----------- translations/el/README.md | 186 ++++++------ translations/el/lesson-template/README.md | 63 +++-- translations/sv/.co-op-translator.json | 10 +- translations/sv/AGENTS.md | 242 ++++++++-------- translations/sv/README.md | 170 ++++++----- translations/sv/lesson-template/README.md | 61 ++-- translations/th/.co-op-translator.json | 10 +- translations/th/AGENTS.md | 328 +++++++++++----------- translations/th/README.md | 179 ++++++------ translations/th/lesson-template/README.md | 67 +++-- 12 files changed, 858 insertions(+), 790 deletions(-) diff --git a/translations/el/.co-op-translator.json b/translations/el/.co-op-translator.json index 8e470be7a..1a4970515 100644 --- a/translations/el/.co-op-translator.json +++ b/translations/el/.co-op-translator.json @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2026-04-20T16:29:40+00:00", + "translation_date": "2026-04-24T16:20:57+00:00", "source_file": "AGENTS.md", "language_code": "el" }, @@ -516,8 +516,8 @@ "language_code": "el" }, "README.md": { - "original_hash": "b885c87c7544109b78d6684daad6cba6", - "translation_date": "2026-04-06T18:31:49+00:00", + "original_hash": "b1766b45123e043ef2c72612f28b86dd", + "translation_date": "2026-04-24T16:13:14+00:00", "source_file": "README.md", "language_code": "el" }, @@ -564,8 +564,8 @@ "language_code": "el" }, "lesson-template/README.md": { - "original_hash": "0494be70ad7fadd13a8c3d549c23e355", - "translation_date": "2025-08-26T23:13:26+00:00", + "original_hash": "ce2f64fd0d518f0500fc082b97c1e662", + "translation_date": "2026-04-24T16:13:29+00:00", "source_file": "lesson-template/README.md", "language_code": "el" }, diff --git a/translations/el/AGENTS.md b/translations/el/AGENTS.md index 6cbbf7f3e..5261b92d5 100644 --- a/translations/el/AGENTS.md +++ b/translations/el/AGENTS.md @@ -2,27 +2,27 @@ ## Επισκόπηση Έργου -Αυτό είναι ένα εκπαιδευτικό αποθετήριο προγράμματος σπουδών για τη διδασκαλία των βασικών της ανάπτυξης ιστοσελίδων σε αρχάριους. Το πρόγραμμα σπουδών είναι ένα ολοκληρωμένο μάθημα 12 εβδομάδων που αναπτύχθηκε από τους Microsoft Cloud Advocates, με 24 πρακτικά μαθήματα που καλύπτουν JavaScript, CSS και HTML. +Αυτό είναι ένα αποθετήριο εκπαιδευτικού προγράμματος για τη διδασκαλία βασικών αρχών ανάπτυξης ιστοσελίδων σε αρχάριους. Το πρόγραμμα σπουδών είναι ένα ολοκληρωμένο μάθημα 12 εβδομάδων που έχει αναπτυχθεί από τους Microsoft Cloud Advocates, περιλαμβάνοντας 24 πρακτικά μαθήματα που καλύπτουν JavaScript, CSS και HTML. -### Κύρια Στοιχεία +### Κύρια Συστατικά -- **Εκπαιδευτικό Περιεχόμενο**: 24 δομημένα μαθήματα οργανωμένα σε μονάδες βασισμένες σε έργα -- **Πρακτικά Έργα**: Terrarium, Παιχνίδι Πληκτρολόγησης, Επέκταση Περιηγητή, Παιχνίδι Διαστήματος, Τραπεζική Εφαρμογή, Κώδικας Επεξεργαστή και Βοηθός Συνομιλίας με Τεχνητή Νοημοσύνη -- **Διαδραστικά Κουίζ**: 48 κουίζ με 3 ερωτήσεις το καθένα (αξιολογήσεις πριν/μετά το μάθημα) -- **Υποστήριξη Πολλαπλών Γλωσσών**: Αυτόματες μεταφράσεις για πάνω από 50 γλώσσες μέσω GitHub Actions -- **Τεχνολογίες**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (για έργα ΤΝ) +- **Εκπαιδευτικό Περιεχόμενο**: 24 δομημένα μαθήματα οργανωμένα σε μονάδες με βάση έργα +- **Πρακτικά Έργα**: Terrarium, Παιχνίδι Πληκτρολόγησης, Πρόσθετο Περιηγητή, Παιχνίδι Διαστήματος, Εφαρμογή Τραπεζικής, Επεξεργαστής Κώδικα, και Βοηθός Συνομιλίας AI +- **Διαδραστικά Quiz**: 48 κουίζ με 3 ερωτήσεις το καθένα (αξιολογήσεις πριν/μετά το μάθημα) +- **Υποστήριξη Πολλών Γλωσσών**: Αυτόματες μεταφράσεις για 50+ γλώσσες μέσω GitHub Actions +- **Τεχνολογίες**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (για έργα AI) ### Αρχιτεκτονική -- Εκπαιδευτικό αποθετήριο με δομή βάσει μαθημάτων -- Οφάκελοι κάθε μαθήματος περιέχουν README, παραδείγματα κώδικα και λύσεις -- Αυτόνομα έργα σε ξεχωριστούς φακέλους (quiz-app, διάφορα έργα μαθημάτων) -- Σύστημα μετάφρασης μέσω GitHub Actions (co-op-translator) -- Τεκμηρίωση διατίθεται μέσω Docsify και ως PDF +- Εκπαιδευτικό αποθετήριο με δομή βασισμένη σε μαθήματα +- Κάθε φάκελος μαθήματος περιέχει README, παραδείγματα κώδικα και λύσεις +- Αυτόνομα έργα σε ξεχωριστούς καταλόγους (quiz-app, διάφορα έργα μαθημάτων) +- Σύστημα μετάφρασης που χρησιμοποιεί GitHub Actions (co-op-translator) +- Τεκμηρίωση διαθέσιμη μέσω Docsify και σε μορφή PDF ## Εντολές Ρύθμισης -Αυτό το αποθετήριο προορίζεται κυρίως για κατανάλωση εκπαιδευτικού περιεχομένου. Για εργασία με συγκεκριμένα έργα: +Αυτό το αποθετήριο είναι κυρίως για κατανάλωση εκπαιδευτικού περιεχομένου. Για εργασία με συγκεκριμένα έργα: ### Ρύθμιση Κύριου Αποθετηρίου @@ -51,12 +51,12 @@ npm run lint # Εκτέλεση ESLint npm run format # Μορφοποίηση με Prettier ``` -### Έργα Επέκτασης Περιηγητή +### Έργα Πρόσθετου Περιηγητή ```bash cd 5-browser-extension/solution npm install -# Ακολουθήστε τις οδηγίες φόρτωσης επεκτάσεων που είναι ειδικές για τον περιηγητή +# Ακολουθήστε τις οδηγίες φόρτωσης επεκτάσεων ανά πρόγραμμα περιήγησης ``` ### Έργα Παιχνιδιού Διαστήματος @@ -64,7 +64,7 @@ npm install ```bash cd 6-space-game/solution npm install -# Ανοίξτε το index.html σε πρόγραμμα περιήγησης ή χρησιμοποιήστε Live Server +# Ανοίξτε το index.html σε πρόγραμμα περιήγησης ή χρησιμοποιήστε το Live Server ``` ### Έργο Συνομιλίας (Backend Python) @@ -72,123 +72,123 @@ npm install ```bash cd 9-chat-project/solution/backend/python pip install openai -# Ορισμός μεταβλητής περιβάλλοντος GITHUB_TOKEN +# Ορίστε τη μεταβλητή περιβάλλοντος GITHUB_TOKEN python api.py ``` -## Ροή Ανάπτυξης +## Ροή Εργασίας Ανάπτυξης -### Για Συνεισφέροντες Περιεχομένου +### Για Συμβολή Περιεχομένου -1. **Δημιουργήστε fork** του αποθετηρίου στον λογαριασμό σας στο GitHub -2. **Κλωνοποιήστε το fork** τοπικά -3. **Δημιουργήστε νέο κλαδί** για τις αλλαγές σας -4. Κάντε αλλαγές στο περιεχόμενο των μαθημάτων ή τα παραδείγματα κώδικα -5. Δοκιμάστε τις αλλαγές κώδικα στους αντίστοιχους φακέλους έργων -6. Υποβάλετε pull requests ακολουθώντας τις οδηγίες συνεισφοράς +1. **Κάντε Fork το αποθετήριο** στον λογαριασμό σας στο GitHub +2. **Κλωνοποιήστε το Fork σας** τοπικά +3. **Δημιουργήστε ένα νέο branch** για τις αλλαγές σας +4. Κάντε αλλαγές στο περιεχόμενο των μαθημάτων ή στα παραδείγματα κώδικα +5. Δοκιμάστε οποιεσδήποτε αλλαγές κώδικα στους αντίστοιχους καταλόγους έργων +6. Υποβάλετε pull requests σύμφωνα με τις οδηγίες συμβολής ### Για Μαθητές -1. Κάντε fork ή κλωνοποιήστε το αποθετήριο -2. Πλοηγηθείτε διαδοχικά στους φακέλους των μαθημάτων -3. Διαβάστε τα αρχεία README κάθε μαθήματος -4. Ολοκληρώστε τα προ-μαθήματος κουίζ στο https://ff-quizzes.netlify.app/web/ -5. Επεξεργαστείτε τα παραδείγματα κώδικα στους φακέλους μαθημάτων +1. Κάντε fork ή κλωνοποίηση του αποθετηρίου +2. Περιηγηθείτε στους καταλόγους μαθημάτων κατά σειρά +3. Διαβάστε τα αρχεία README για κάθε μάθημα +4. Ολοκληρώστε τα κουίζ πριν το μάθημα στο https://ff-quizzes.netlify.app/web/ +5. Εργαστείτε με τα παραδείγματα κώδικα στους καταλόγους των μαθημάτων 6. Ολοκληρώστε εργασίες και προκλήσεις -7. Πραγματοποιήστε τα μετα-μαθήματος κουίζ +7. Πραγματοποιήστε τα κουίζ μετά το μάθημα ### Ζωντανή Ανάπτυξη -- **Τεκμηρίωση**: Εκτελέστε `docsify serve` από τη ρίζα (θύρα 3000) -- **Quiz App**: Εκτελέστε `npm run dev` στον φάκελο quiz-app -- **Έργα**: Χρησιμοποιήστε το Live Server extension του VS Code για έργα HTML -- **API Έργα**: Εκτελέστε `npm start` στους αντίστοιχους φακέλους API +- **Τεκμηρίωση**: Εκτελέστε `docsify serve` στον ριζικό φάκελο (θύρα 3000) +- **Quiz App**: Εκτελέστε `npm run dev` στον κατάλογο quiz-app +- **Έργα**: Χρησιμοποιήστε την επέκταση VS Code Live Server για έργα HTML +- **API Έργα**: Εκτελέστε `npm start` στους αντίστοιχους καταλόγους API ## Οδηγίες Δοκιμών -### Δοκιμές Quiz App +### Δοκιμή Quiz App ```bash cd quiz-app -npm run lint # Έλεγχος για θέματα στυλ κώδικα -npm run build # Επαλήθευση επιτυχίας κατασκευής +npm run lint # Έλεγχος για ζητήματα στυλ κώδικα +npm run build # Επαλήθευση επιτυχίας της κατασκευής ``` -### Δοκιμές Bank API +### Δοκιμή Bank API ```bash cd 7-bank-project/api -npm run lint # Έλεγχος για θέματα στυλ κώδικα -node server.js # Επιβεβαίωση ότι ο διακομιστής ξεκινά χωρίς σφάλματα +npm run lint # Ελέγξτε για ζητήματα στυλ κώδικα +node server.js # Επαληθεύστε ότι ο διακομιστής ξεκινά χωρίς σφάλματα ``` ### Γενική Προσέγγιση Δοκιμών -- Πρόκειται για εκπαιδευτικό αποθετήριο χωρίς ολοκληρωμένες αυτοματοποιημένες δοκιμές -- Οι χειροκίνητες δοκιμές εστιάζουν σε: +- Πρόκειται για εκπαιδευτικό αποθετήριο χωρίς πλήρεις αυτοματοποιημένες δοκιμές +- Οι χειροκίνητες δοκιμές επικεντρώνονται σε: - Εκτέλεση παραδειγμάτων κώδικα χωρίς σφάλματα - - Οι σύνδεσμοι στην τεκμηρίωση λειτουργούν σωστά - - Οι κατασκευές έργων ολοκληρώνονται επιτυχώς - - Τα παραδείγματα ακολουθούν τις βέλτιστες πρακτικές + - Εργασία συνδέσμων στην τεκμηρίωση + - Επιτυχής ολοκλήρωση build έργων + - Παραδείγματα που ακολουθούν βέλτιστες πρακτικές ### Έλεγχοι Πριν την Υποβολή -- Εκτελέστε `npm run lint` στους φακέλους με package.json +- Εκτελέστε `npm run lint` σε καταλόγους που έχουν package.json - Επαληθεύστε ότι οι σύνδεσμοι markdown είναι έγκυροι -- Δοκιμάστε παραδείγματα κώδικα στον περιηγητή ή Node.js -- Ελέγξτε ότι οι μεταφράσεις διατηρούν τη σωστή δομή +- Δοκιμάστε παραδείγματα κώδικα στον περιηγητή ή στο Node.js +- Ελέγξτε ότι οι μεταφράσεις διατηρούν σωστή δομή ## Οδηγίες Στυλ Κώδικα ### JavaScript -- Χρησιμοποιήστε τον σύγχρονο σύνταξη ES6+ -- Ακολουθήστε τις τυπικές ρυθμίσεις ESLint που παρέχονται στα έργα -- Χρησιμοποιήστε ουσιαστικά ονόματα μεταβλητών και συναρτήσεων για εκπαιδευτική σαφήνεια -- Προσθέστε σχόλια που εξηγούν έννοιες για τους μαθητές +- Χρησιμοποιείτε σύγχρονη σύνταξη ES6+ +- Ακολουθείστε τα πρότυπα ESLint που παρέχονται στα έργα +- Χρησιμοποιείτε περιγραφικά ονόματα μεταβλητών και συναρτήσεων για εκπαιδευτική σαφήνεια +- Προσθέστε σχόλια που εξηγούν τις έννοιες για τους μαθητές - Μορφοποιήστε με Prettier όπου είναι ρυθμισμένο ### HTML/CSS -- Σημαντικά στοιχεία HTML5 -- Αρχές σχεδιασμού προσαρμοστικής εμφάνισης (responsive) -- Καθαρούς κανόνες ονοματολογίας κλάσεων -- Σχόλια που εξηγούν τεχνικές CSS για μαθητές +- Σημασιολογικά στοιχεία HTML5 +- Αρχές σχεδιασμού responsive +- Καθαρές συμβάσεις ονομασίας κλάσεων +- Σχόλια που εξηγούν τεχνικές CSS για τους μαθητές ### Python -- Χρήση οδηγιών στυλ PEP 8 +- Οδηγίες στυλ PEP 8 - Καθαρά, εκπαιδευτικά παραδείγματα κώδικα -- Χρήση δηλώσεων τύπων όπου βοηθούν στην εκμάθηση +- Σημειώσεις τύπων όπου βοηθούν στη μάθηση -### Τεκμηρίωση σε Markdown +### Τεκμηρίωση Markdown -- Σαφή ιεραρχία επικεφαλίδων -- Μπλοκ κώδικα με καθορισμένη γλώσσα +- Σαφής ιεραρχία επικεφαλίδων +- Μπλοκ κώδικα με καθορισμό γλώσσας - Σύνδεσμοι για επιπλέον πόρους -- Στιγμιότυπα και εικόνες στους φακέλους `images/` -- Εναλλακτικό κείμενο (alt text) για τις εικόνες για προσβασιμότητα +- Στιγμιότυπα και εικόνες στους καταλόγους `images/` +- Εναλλακτικό κείμενο για πρόσβαση σε εικόνες ### Οργάνωση Αρχείων -- Μαθήματα με αριθμημένη ακολουθία (1-getting-started-lessons, 2-js-basics κ.ά.) -- Κάθε έργο έχει φακέλους `solution/` και συχνά `start/` ή `your-work/` -- Εικόνες φυλαγμένες σε φακέλους `images/` κάθε μαθήματος -- Μεταφράσεις σε δομή `translations/{language-code}/` +- Μαθήματα αριθμημένα διαδοχικά (1-getting-started-lessons, 2-js-basics, κτλ.) +- Κάθε έργο έχει καταλόγους `solution/` και συχνά `start/` ή `your-work/` +- Εικόνες αποθηκεύονται σε ειδικούς για κάθε μάθημα καταλόγους `images/` +- Μεταφράσεις στη δομή `translations/{language-code}/` ## Κατασκευή και Ανάπτυξη ### Ανάπτυξη Quiz App (Azure Static Web Apps) -Το quiz-app είναι ρυθμισμένο για ανάπτυξη σε Azure Static Web Apps: +Το quiz-app είναι ρυθμισμένο για ανάπτυξη μέσω Azure Static Web Apps: ```bash cd quiz-app -npm run build # Δημιουργεί φάκελο dist/ -# Αναπτύσσει μέσω ροής εργασίας GitHub Actions κατά την ώθηση στο main +npm run build # Δημιουργεί τον φάκελο dist/ +# Αναπτύσσεται μέσω ροής εργασίας GitHub Actions κατά το push στο main ``` -Ρυθμίσεις Azure Static Web Apps: +Ρύθμιση Azure Static Web Apps: - **Τοποθεσία εφαρμογής**: `/quiz-app` - **Τοποθεσία εξόδου**: `dist` - **Ροή εργασίας**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` @@ -197,65 +197,65 @@ npm run build # Δημιουργεί φάκελο dist/ ```bash npm install # Εγκαταστήστε το docsify-to-pdf -npm run convert # Δημιουργία PDF από docs +npm run convert # Δημιουργήστε PDF από το docs ``` ### Τεκμηρίωση Docsify ```bash npm install -g docsify-cli # Εγκαταστήστε το Docsify παγκοσμίως -docsify serve # Εκτελέστε στον localhost:3000 +docsify serve # Εκτελέστε στο localhost:3000 ``` -### Κατασκευές ανά Έργο +### Κατασκευές Ειδικές για Έργα -Κάθε φάκελος έργου μπορεί να έχει δική του διαδικασία κατασκευής: -- Έργα Vue: `npm run build` δημιουργεί παραγωγικά πακέτα -- Στατικά έργα: Δεν απαιτείται βήμα κατασκευής, σερβίρονται απευθείας τα αρχεία +Κάθε κατάλογος έργου μπορεί να έχει τη δική του διαδικασία κατασκευής: +- Έργα Vue: `npm run build` δημιουργεί παραγωγικά bundles +- Στατικά έργα: Δεν απαιτείται βήμα κατασκευής, εξυπηρέτηση αρχείων απευθείας ## Οδηγίες Pull Request ### Μορφή Τίτλου Χρησιμοποιήστε σαφείς, περιγραφικούς τίτλους που υποδεικνύουν την περιοχή αλλαγής: -- `[Quiz-app] Προσθήκη νέου κουίζ για μάθημα Χ` -- `[Lesson-3] Διόρθωση τυπογραφικού λάθους στο έργο terrarium` -- `[Translation] Προσθήκη ισπανικής μετάφρασης για το μάθημα 5` -- `[Docs] Ενημέρωση οδηγιών ρύθμισης` +- `[Quiz-app] Προσθήκη νέου κουίζ για μάθημα X` +- `[Lesson-3] Διόρθωση ορθογραφικού λάθους στο έργο terrarium` +- `[Translation] Προσθήκη μετάφρασης στα Ισπανικά για μάθημα 5` +- `[Docs] Ενημέρωση οδηγιών εγκατάστασης` ### Απαιτούμενοι Έλεγχοι -Πριν από την υποβολή PR: +Πριν την υποβολή PR: 1. **Ποιότητα Κώδικα**: - - Εκτελέστε `npm run lint` στους επηρεασμένους φακέλους έργων - - Διορθώστε όλα τα σφάλματα και προειδοποιήσεις linting + - Εκτελέστε `npm run lint` στους αντίστοιχους καταλόγους έργων + - Διορθώστε όλα τα λάθη και τις προειδοποιήσεις linting 2. **Επαλήθευση Κατασκευής**: - - Εκτελέστε `npm run build` εάν ισχύει + - Εκτελέστε `npm run build` όπου εφαρμόζεται - Βεβαιωθείτε ότι δεν υπάρχουν σφάλματα κατασκευής 3. **Επαλήθευση Συνδέσμων**: - Δοκιμάστε όλους τους συνδέσμους markdown - Επαληθεύστε ότι οι αναφορές εικόνων λειτουργούν -4. **Αναθεώρηση Περιεχομένου**: - - Διόρθωση ορθογραφίας και γραμματικής - - Επιβεβαίωση ότι τα παραδείγματα κώδικα είναι σωστά και εκπαιδευτικά - - Επαλήθευση σωστής διατήρησης νοήματος στις μεταφράσεις +4. **Ανασκόπηση Περιεχομένου**: + - Διορθώστε ορθογραφικά και γραμματικά λάθη + - Βεβαιωθείτε ότι τα παραδείγματα κώδικα είναι σωστά και εκπαιδευτικά + - Επαληθεύστε ότι οι μεταφράσεις διατηρούν την αρχική σημασία -### Απαιτήσεις Συνεισφοράς +### Απαιτήσεις Συμβολής -- Αποδοχή του Microsoft CLA (αυτόματος έλεγχος στην πρώτη PR) -- Ακολουθήστε τον [Κώδικα Συμπεριφοράς Ανοιχτού Κώδικα της Microsoft](https://opensource.microsoft.com/codeofconduct/) -- Διαβάστε το [CONTRIBUTING.md](./CONTRIBUTING.md) για λεπτομερείς οδηγίες -- Αναφέρετε αριθμούς ζητημάτων στην περιγραφή PR αν ισχύει +- Αποδοχή Microsoft CLA (αυτόματος έλεγχος στο πρώτο PR) +- Τήρηση του [Κώδικα Συμπεριφοράς Open Source της Microsoft](https://opensource.microsoft.com/codeofconduct/) +- Ανατρέξτε στο [CONTRIBUTING.md](./CONTRIBUTING.md) για λεπτομερείς οδηγίες +- Αναφορά αριθμών θεμάτων στην περιγραφή PR όπου ισχύει -### Διαδικασία Αναθεώρησης +### Διαδικασία Ανασκόπησης -- Οι PR ελέγχονται από συντηρητές και την κοινότητα +- Τα PR ελέγχονται από διαχειριστές και την κοινότητα - Προτεραιότητα στην εκπαιδευτική σαφήνεια -- Τα παραδείγματα κώδικα να ακολουθούν τις τρέχουσες βέλτιστες πρακτικές +- Τα παραδείγματα κώδικα πρέπει να ακολουθούν τρέχουσες βέλτιστες πρακτικές - Οι μεταφράσεις ελέγχονται για ακρίβεια και πολιτισμική καταλληλότητα ## Σύστημα Μετάφρασης @@ -263,20 +263,20 @@ docsify serve # Εκτελέστε στον localhost:3000 ### Αυτόματη Μετάφραση - Χρησιμοποιεί GitHub Actions με ροή εργασίας co-op-translator -- Μεταφράζει σε πάνω από 50 γλώσσες αυτόματα -- Αρχεία πηγής σε κύριους φακέλους -- Τα μεταφρασμένα αρχεία βρίσκονται σε `translations/{language-code}/` +- Μεταφράζει σε 50+ γλώσσες αυτόματα +- Αρχεία πηγής στους κύριους καταλόγους +- Μεταφρασμένα αρχεία σε καταλόγους `translations/{language-code}/` -### Προσθήκη Χειροκίνητων Βελτιώσεων Μετάφρασης +### Προσθήκη Εγχειρίδιων Βελτιώσεων Μετάφρασης -1. Εντοπίστε το αρχείο σε `translations/{language-code}/` +1. Βρείτε το αρχείο σε `translations/{language-code}/` 2. Κάντε βελτιώσεις διατηρώντας τη δομή -3. Εξασφαλίστε ότι τα παραδείγματα κώδικα παραμένουν λειτουργικά -4. Δοκιμάστε όλο το τοπικοποιημένο περιεχόμενο κουίζ +3. Βεβαιωθείτε ότι τα παραδείγματα κώδικα παραμένουν λειτουργικά +4. Δοκιμάστε οποιοδήποτε τοπικό περιεχόμενο κουίζ ### Μεταδεδομένα Μετάφρασης -Τα μεταφρασμένα αρχεία περιλαμβάνουν κεφαλίδα μεταδεδομένων: +Τα μεταφρασμένα αρχεία περιλαμβάνουν επικεφαλίδα μεταδεδομένων: ```markdown ``` -## Αντιμετώπιση και Επίλυση Προβλημάτων +## Αντιμετώπιση Σφαλμάτων και Επίλυση Προβλημάτων -### Συνήθη Θέματα +### Συνήθη Ζητήματα -**Η εφαρμογή Quiz δεν ξεκινά**: +**Δεν ξεκινά η εφαρμογή του quiz**: - Ελέγξτε την έκδοση Node.js (συνιστάται v14+) -- Διαγράψτε `node_modules` και `package-lock.json`, εκτελέστε ξανά `npm install` +- Διαγράψτε τους φακέλους `node_modules` και το `package-lock.json`, τρέξτε ξανά `npm install` - Ελέγξτε για σύγκρουση θυρών (προεπιλογή: Vite χρησιμοποιεί θύρα 5173) -**Ο διακομιστής API δεν ξεκινά**: -- Επαληθεύστε ότι η έκδοση Node.js είναι ≥10 -- Ελέγξτε αν η θύρα είναι ήδη σε χρήση -- Βεβαιωθείτε ότι όλες οι εξαρτήσεις είναι εγκατεστημένες με `npm install` +**Ο server API δεν ξεκινά**: +- Επαληθεύστε ότι η έκδοση Node.js πληροί τις ελάχιστες απαιτήσεις (node >=10) +- Ελέγξτε αν η θύρα χρησιμοποιείται ήδη +- Βεβαιωθείτε ότι έχουν εγκατασταθεί όλες οι εξαρτήσεις με `npm install` -**Η επέκταση περιηγητή δεν φορτώνει**: +**Δεν φορτώνει το πρόσθετο περιηγητή**: - Επαληθεύστε ότι το manifest.json είναι σωστά μορφοποιημένο -- Ελέγξτε τα σφάλματα στην κονσόλα περιηγητή -- Ακολουθήστε τις οδηγίες εγκατάστασης για την επέκταση ανά περιηγητή +- Ελέγξτε την κονσόλα του περιηγητή για σφάλματα +- Ακολουθήστε τις οδηγίες εγκατάστασης πρόσθετου που είναι ειδικές για τον περιηγητή **Προβλήματα στο έργο συνομιλίας Python**: - Βεβαιωθείτε ότι το πακέτο OpenAI είναι εγκατεστημένο: `pip install openai` -- Επαληθεύστε ότι το περιβάλλον GITHUB_TOKEN έχει οριστεί +- Επαληθεύστε ότι η μεταβλητή περιβάλλοντος GITHUB_TOKEN είναι ορισμένη - Ελέγξτε τα δικαιώματα πρόσβασης στα GitHub Models -**Η Docsify δεν σερβίρει τεκμηρίωση**: -- Εγκαταστήστε docsify-cli παγκοσμίως: `npm install -g docsify-cli` -- Εκτελέστε από την ρίζα του αποθετηρίου -- Ελέγξτε ότι υπάρχει το αρχείο `docs/_sidebar.md` +**Δεν εξυπηρετεί η Docsify τα docs**: +- Εγκαταστήστε το docsify-cli παγκοσμίως: `npm install -g docsify-cli` +- Τρέξτε από τον ριζικό κατάλογο του αποθετηρίου +- Βεβαιωθείτε ότι το `docs/_sidebar.md` υπάρχει ### Συμβουλές Περιβάλλοντος Ανάπτυξης -- Χρησιμοποιήστε VS Code με το Live Server extension για έργα HTML -- Εγκαταστήστε τις επεκτάσεις ESLint και Prettier για ομοιόμορφη μορφοποίηση -- Χρησιμοποιήστε τα DevTools του περιηγητή για αποσφαλμάτωση JavaScript -- Για έργα Vue, εγκαταστήστε την επέκταση Vue DevTools για περιηγητές +- Χρησιμοποιήστε VS Code με την επέκταση Live Server για έργα HTML +- Εγκαταστήστε τις επεκτάσεις ESLint και Prettier για ομοιόμορφο στυλ +- Χρησιμοποιήστε τα DevTools του περιηγητή για εντοπισμό σφαλμάτων JavaScript +- Για έργα Vue, εγκαταστήστε την επέκταση Vue DevTools στον περιηγητή -### Θέματα Απόδοσης +### Παράγοντες Απόδοσης -- Ο μεγάλος αριθμός μεταφρασμένων αρχείων (50+ γλώσσες) κάνει τα πλήρη κλωνοποιημένα αρχεία μεγάλα -- Χρησιμοποιήστε επιφανειακό κλώνο αν εργάζεστε μόνο με το περιεχόμενο: `git clone --depth 1` -- Εξαιρέστε τις μεταφράσεις από αναζητήσεις όταν δουλεύετε σε αγγλικό περιεχόμενο -- Οι διαδικασίες κατασκευής μπορεί να είναι αργές στην πρώτη εκτέλεση (npm install, κατασκευή Vite) +- Ο μεγάλος αριθμός μεταφρασμένων αρχείων (50+ γλώσσες) κάνει τις κλωνοποιήσεις πλήρεις βαριές +- Χρησιμοποιήστε shallow clone αν εργάζεστε μόνο με περιεχόμενο: `git clone --depth 1` +- Εξαιρέστε τις μεταφράσεις από τις αναζητήσεις όταν εργάζεστε στα Αγγλικά +- Οι διαδικασίες κατασκευής μπορεί να είναι αργές στην πρώτη εκτέλεση (npm install, vite build) ## Θέματα Ασφαλείας ### Μεταβλητές Περιβάλλοντος -- Τα κλειδιά API δεν πρέπει ποτέ να αποθηκεύονται στο αποθετήριο +- Τα API keys δεν πρέπει να δεσμεύονται στο αποθετήριο - Χρησιμοποιήστε αρχεία `.env` (ήδη στο `.gitignore`) -- Καταγράψτε τις απαιτούμενες μεταβλητές περιβάλλοντος στα README των έργων +- Τεκμηριώστε τις απαιτούμενες μεταβλητές περιβάλλοντος στα README των έργων ### Έργα Python - Χρησιμοποιήστε εικονικά περιβάλλοντα: `python -m venv venv` -- Διατηρήστε τις εξαρτήσεις ενημερωμένες -- Τα GitHub tokens πρέπει να έχουν τα ελάχιστα απαιτούμενα δικαιώματα +- Κρατήστε τις εξαρτήσεις ενημερωμένες +- Τα GitHub tokens πρέπει να έχουν τα ελάχιστα αναγκαία δικαιώματα -### Πρόσβαση σε GitHub Models +### Πρόσβαση GitHub Models -- Απαιτούνται Personal Access Tokens (PAT) για GitHub Models -- Τα tokens πρέπει να αποθηκεύονται ως μεταβλητές περιβάλλοντος -- Ποτέ μην αποθηκεύετε tokens ή διαπιστευτήρια στο αποθετήριο +- Χρειάζονται Personal Access Tokens (PAT) για GitHub Models +- Αποθηκεύονται ως μεταβλητές περιβάλλοντος +- Μην δεσμεύετε ποτέ tokens ή διαπιστευτήρια ## Πρόσθετες Σημειώσεις ### Στόχος Κοινού -- Απόλυτα αρχάριοι στην ανάπτυξη ιστοσελίδων +- Αρχάριοι πλήρως στην ανάπτυξη ιστοσελίδων - Φοιτητές και αυτοδίδακτοι -- Εκπαιδευτικοί που χρησιμοποιούν το πρόγραμμα στην τάξη -- Το περιεχόμενο σχεδιάστηκε για προσβασιμότητα και σταδιακή ανάπτυξη δεξιοτήτων +- Εκπαιδευτικοί που χρησιμοποιούν το πρόγραμμα σε αίθουσες διδασκαλίας +- Το περιεχόμενο σχεδιάζεται για προσβασιμότητα και σταδιακή ανάπτυξη δεξιοτήτων ### Εκπαιδευτική Φιλοσοφία -- Προσέγγιση μάθησης βασισμένη σε έργα +- Προσέγγιση μάθησης με βάση έργα - Συχνές αξιολογήσεις γνώσεων (κουίζ) -- Πρακτικές ασκήσεις κωδικοποίησης +- Πρακτικές ασκήσεις προγραμματισμού - Παραδείγματα εφαρμογών πραγματικού κόσμου -- Εστίαση στα βασικά πριν τα frameworks +- Εστίαση στα θεμέλια πριν από τα frameworks -### Διαχείριση Αποθετηρίου +### Συντήρηση Αποθετηρίου -- Ενεργή κοινότητα μαθητών και συνεισφερόντων +- Ενεργή κοινότητα μαθητών και συμβολής - Τακτικές ενημερώσεις εξαρτήσεων και περιεχομένου -- Παρακολούθηση ζητημάτων και συζητήσεων από συντηρητές -- Αυτοματοποιημένες ενημερώσεις μεταφράσεων μέσω GitHub Actions +- Παρακολούθηση θεμάτων και συζητήσεων από τους διαχειριστές +- Αυτόματες ενημερώσεις μεταφράσεων μέσω GitHub Actions ### Σχετικοί Πόροι -- [Μονάδες Microsoft Learn](https://docs.microsoft.com/learn/) -- [Πόροι Student Hub](https://docs.microsoft.com/learn/student-hub/) +- [Microsoft Learn modules](https://docs.microsoft.com/learn/) +- [Student Hub resources](https://docs.microsoft.com/learn/student-hub/) - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) συνιστάται για μαθητές -- Πρόσθετα μαθήματα: Γενετική ΤΝ, Επιστήμη Δεδομένων, ML, IoT διαθέσιμα +- Επιπλέον μαθήματα: Generative AI, Data Science, ML, IoT διαθέσιμα προγράμματα σπουδών ### Εργασία με Συγκεκριμένα Έργα -Για λεπτομερείς οδηγίες για κάθε έργο, ανατρέξτε στα README αρχεία: -- `quiz-app/README.md` - Εφαρμογή quiz Vue 3 -- `7-bank-project/README.md` - Τραπεζική εφαρμογή με ταυτοποίηση -- `5-browser-extension/README.md` - Ανάπτυξη επέκτασης περιηγητή -- `6-space-game/README.md` - Ανάπτυξη παιχνιδιού με καμβά -- `9-chat-project/README.md` - Έργο βοηθού συνομιλίας με ΤΝ +Για λεπτομερείς οδηγίες για μεμονωμένα έργα, ανατρέξτε στα αρχεία README στα: +- `quiz-app/README.md` - Εφαρμογή quiz με Vue 3 +- `7-bank-project/README.md` - Εφαρμογή τραπεζικής με αυθεντικοποίηση +- `5-browser-extension/README.md` - Ανάπτυξη πρόσθετου περιηγητή +- `6-space-game/README.md` - Ανάπτυξη παιχνιδιού βασισμένου σε Canvas +- `9-chat-project/README.md` - Έργο βοηθού συνομιλίας AI ### Δομή Monorepo -Αν και δεν είναι παραδοσιακό monorepo, αυτό το αποθετήριο περιέχει πολλαπλά ανεξάρτητα έργα: +Αν και δεν είναι παραδοσιακό monorepo, το αποθετήριο περιέχει πολλαπλά ανεξάρτητα έργα: - Κάθε μάθημα είναι αυτόνομο - Τα έργα δεν μοιράζονται εξαρτήσεις -- Εργαστείτε σε μεμονωμένα έργα χωρίς να επηρεάζετε τα άλλα +- Εργαστείτε σε ανεξάρτητα έργα χωρίς να επηρεάζετε τα άλλα - Κλωνοποιήστε ολόκληρο το αποθετήριο για πλήρη εμπειρία προγράμματος σπουδών --- **Αποποίηση ευθυνών**: -Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας την υπηρεσία αυτόματης μετάφρασης AI [Co-op Translator](https://github.com/Azure/co-op-translator). Παρόλο που προσπαθούμε για ακρίβεια, παρακαλούμε να γνωρίζετε ότι οι αυτοματοποιημένες μεταφράσεις μπορεί να περιέχουν σφάλματα ή ανακρίβειες. Το πρωτότυπο έγγραφο στη μητρική του γλώσσα πρέπει να θεωρείται η αυθεντική πηγή. Για κρίσιμες πληροφορίες, συνιστάται επαγγελματική ανθρώπινη μετάφραση. Δεν φέρουμε ευθύνη για οποιεσδήποτε παρερμηνείες ή παρανοήσεις προκύψουν από τη χρήση αυτής της μετάφρασης. +Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας υπηρεσία μετάφρασης AI [Co-op Translator](https://github.com/Azure/co-op-translator). Ενώ επιδιώκουμε την ακρίβεια, παρακαλούμε να έχετε υπόψη ότι οι αυτοματοποιημένες μεταφράσεις ενδέχεται να περιέχουν λάθη ή ανακρίβειες. Το πρωτότυπο έγγραφο στην αρχική του γλώσσα πρέπει να θεωρείται η αυθεντική πηγή. Για κρίσιμες πληροφορίες, συνιστάται επαγγελματική μετάφραση από άνθρωπο. Δεν φέρουμε ευθύνη για τυχόν παρεξηγήσεις ή λανθασμένες ερμηνείες που προκύπτουν από τη χρήση αυτής της μετάφρασης. \ No newline at end of file diff --git a/translations/el/README.md b/translations/el/README.md index e7d5ddf19..abf5c0d8f 100644 --- a/translations/el/README.md +++ b/translations/el/README.md @@ -12,16 +12,16 @@ # Ανάπτυξη Ιστοσελίδων για Αρχάριους - Ένα Πρόγραμμα Σπουδών -Μάθετε τα βασικά της ανάπτυξης ιστοσελίδων με το ολοκληρωμένο μας μάθημα διάρκειας 12 εβδομάδων από τους Microsoft Cloud Advocates. Κάθε ένα από τα 24 μαθήματα εμβαθύνει σε JavaScript, CSS και HTML μέσα από πρακτικά έργα όπως τεράριουμ, επεκτάσεις προγράμματος περιήγησης και διαστημικά παιχνίδια. Ασχοληθείτε με κουίζ, συζητήσεις και πρακτικές εργασίες. Βελτιώστε τις δεξιότητές σας και βελτιστοποιήστε την απορρόφηση γνώσεων με τη στοχευμένη μας παιδαγωγική βασισμένη σε έργα. Ξεκινήστε το ταξίδι σας στον κώδικα σήμερα! +Μάθετε τα βασικά της ανάπτυξης ιστοσελίδων με το ολοκληρωμένο πρόγραμμα των 12 εβδομάδων από τους Microsoft Cloud Advocates. Κάθε ένα από τα 24 μαθήματα εμβαθύνει σε JavaScript, CSS και HTML μέσα από πρακτικά έργα όπως τεραριούμια, επεκτάσεις browser και διαστημικά παιχνίδια. Συμμετέχετε σε κουίζ, συζητήσεις, και πρακτικές εργασίες. Αναβαθμίστε τις δεξιότητές σας και βελτιώστε την απόκτηση γνώσεων με τη μεθοδολογία μας βάσει έργων. Ξεκινήστε το ταξίδι του προγραμματισμού σας σήμερα! -Γίνετε μέλος της κοινότητας Azure AI Foundry στο Discord +Εγγραφείτε στο Discord του Azure AI Foundry και γνωρίστε ειδικούς και άλλους προγραμματιστές. [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -Ακολουθήστε αυτά τα βήματα για να ξεκινήσετε με αυτούς τους πόρους: -1. **Δημιουργήστε Fork στο Αποθετήριο**: Πατήστε [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) -2. **Κλωνοποιήστε το Αποθετήριο**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -3. [**Γίνετε μέλος του Azure AI Foundry Discord και γνωρίστε ειδικούς και άλλους προγραμματιστές**](https://discord.com/invite/ByRwuEEgH4) +Ακολουθήστε αυτά τα βήματα για να ξεκινήσετε να χρησιμοποιείτε αυτούς τους πόρους: +1. **Δημιουργήστε Fork το Αποθετήριο**: Κάντε κλικ στο [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +2. **Κατεβάστε το Αποθετήριο (Clone)**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +3. [**Εγγραφείτε στο Discord του Azure AI Foundry και γνωρίστε ειδικούς και άλλους προγραμματιστές**](https://discord.com/invite/ByRwuEEgH4) ### 🌐 Υποστήριξη Πολλών Γλωσσών @@ -30,9 +30,9 @@ [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](./README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) -> **Προτιμάτε να Κλωνοποιήσετε τοπικά;** +> **Προτιμάτε να Κατεβάσετε τοπικά (Clone);** > -> Αυτό το αποθετήριο περιλαμβάνει πάνω από 50 μεταφράσεις που αυξάνουν σημαντικά το μέγεθος λήψης. Για κλωνοποίηση χωρίς μεταφράσεις, χρησιμοποιήστε sparse checkout: +> Αυτό το αποθετήριο περιλαμβάνει πάνω από 50 μεταφράσεις γλωσσών που αυξάνουν σημαντικά το μέγεθος λήψης. Για να κατεβάσετε χωρίς μεταφράσεις, χρησιμοποιήστε sparse checkout: > > **Bash / macOS / Linux:** > ```bash @@ -48,95 +48,95 @@ > git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" > ``` > -> Αυτό σας δίνει όλα όσα χρειάζεστε για να ολοκληρώσετε το μάθημα με πολύ πιο γρήγορη λήψη. +> Αυτό σας παρέχει ό,τι χρειάζεστε για να ολοκληρώσετε το μάθημα με πολύ πιο γρήγορη λήψη. -**Εάν επιθυμείτε να προστεθούν επιπλέον γλώσσες μετάφρασης, οι υποστηριζόμενες γλώσσες αναφέρονται [εδώ](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** +**Αν επιθυμείτε να έχετε επιπλέον μεταφράσεις, οι υποστηριζόμενες γλώσσες είναι καταγεγραμμένες εδώ. [εδώ](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) #### 🧑‍🎓 _Είσαι φοιτητής;_ -Επισκεφθείτε τη σελίδα [**Student Hub**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) όπου θα βρείτε πόρους για αρχάριους, πακέτα για φοιτητές και ακόμη τρόπους να αποκτήσετε δωρεάν κουπόνι πιστοποίησης. Αυτή είναι η σελίδα που αξίζει να αποθηκεύσετε στα αγαπημένα και να ελέγχετε τακτικά καθώς ανανεώνουμε το περιεχόμενο κάθε μήνα. +Επισκεφτείτε τη [**Σελίδα Φοιτητών (Student Hub)**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) όπου θα βρείτε πόρους για αρχάριους, πακέτα για φοιτητές και τρόπους να αποκτήσετε δωρεάν εκπαιδευτικό κουπόνι πιστοποίησης. Αυτή είναι η σελίδα που πρέπει να αποθηκεύσετε για να την ελέγχετε τακτικά καθώς ανανεώνουμε το περιεχόμενο μηνιαίως. -### 📣 Ανακοίνωση - Νέες Προκλήσεις λειτουργίας GitHub Copilot Agent για ολοκλήρωση! +### 📣 Ανακοίνωση - Νέες προκλήσεις κατάστασης GitHub Copilot Agent για ολοκλήρωση! -Προστέθηκε νέα Πρόκληση, αναζητήστε "GitHub Copilot Agent Challenge 🚀" στις περισσότερες ενότητες. Πρόκειται για νέα πρόκληση για να ολοκληρώσετε χρησιμοποιώντας το GitHub Copilot και τη λειτουργία Agent. Αν δεν έχετε χρησιμοποιήσει τη λειτουργία Agent πριν, αυτή μπορεί όχι μόνο να δημιουργεί κείμενο αλλά και να δημιουργεί και να επεξεργάζεται αρχεία, να εκτελεί εντολές και άλλα. +Προστέθηκε νέα πρόκληση, αναζητήστε "GitHub Copilot Agent Challenge 🚀" στις περισσότερες ενότητες. Πρόκειται για μια νέα πρόκληση για να ολοκληρώσετε χρησιμοποιώντας το GitHub Copilot και τη λειτουργία Agent. Αν δεν έχετε ξαναχρησιμοποιήσει τη λειτουργία Agent, μπορεί όχι μόνο να παράγει κείμενο αλλά και να δημιουργεί και να επεξεργάζεται αρχεία, να εκτελεί εντολές και περισσότερα. -### 📣 Ανακοίνωση - _Νέο Έργο για δημιουργία με τη χρήση Γενετικής Τεχνητής Νοημοσύνης_ +### 📣 Ανακοίνωση - _Νέο έργο για κατασκευή με τη χρήση Generative AI_ -Μόλις προστέθηκε νέο έργο AI Assistant, ρίξτε μια ματιά στο [έργο](./9-chat-project/README.md) +Προστέθηκε νέο έργο Βοηθού AI, δείτε το [έργο](./9-chat-project/README.md) -### 📣 Ανακοίνωση - _Νέο Πρόγραμμα Σπουδών_ για Γενετική Τεχνητή Νοημοσύνη για JavaScript μόλις κυκλοφόρησε +### 📣 Ανακοίνωση - _Νέο Πρόγραμμα Σπουδών_ για Generative AI με JavaScript μόλις κυκλοφόρησε -Μην χάσετε το νέο μας πρόγραμμα Γενετικής Τεχνητής Νοημοσύνης! +Μην χάσετε το νέο μας πρόγραμμα σπουδών για Generative AI! -Επισκεφθείτε [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) για να ξεκινήσετε! +Επισκεφθείτε το [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) για να ξεκινήσετε! ![Background](../../translated_images/el/background.148a8d43afde5730.webp) -- Μαθήματα που καλύπτουν τα πάντα από τα βασικά έως RAG. -- Αλληλεπιδράστε με ιστορικούς χαρακτήρες χρησιμοποιώντας το GenAI και την εφαρμογή συνοδός μας. -- Διασκεδαστική και συναρπαστική αφήγηση, θα ταξιδεύετε στο χρόνο! +- Μαθήματα που καλύπτουν τα πάντα από τα βασικά μέχρι RAG. +- Αλληλεπιδράστε με ιστορικούς χαρακτήρες με χρήση GenAI και της συνοδευτικής εφαρμογής μας. +- Διασκεδαστική και ελκυστική αφήγηση, ταξιδεύετε στο χρόνο! ![character](../../translated_images/el/character.5c0dd8e067ffd693.webp) -Κάθε μάθημα περιλαμβάνει μια εργασία για ολοκλήρωση, έναν έλεγχο γνώσεων και μια πρόκληση που θα σας καθοδηγήσει στην εκμάθηση θεμάτων όπως: -- Δημιουργία προτροπών και τεχνική prompt engineering +Κάθε μάθημα περιλαμβάνει μια εργασία για ολοκλήρωση, έναν έλεγχο γνώσεων και μια πρόκληση για να σας καθοδηγήσει σε θέματα όπως: +- Prompting και prompt engineering - Δημιουργία εφαρμογών κειμένου και εικόνας - Εφαρμογές αναζήτησης -Επισκεφθείτε [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) για να ξεκινήσετε! +Επισκεφτείτε το [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) για να ξεκινήσετε! ## 🌱 Ξεκινώντας -> **Καθηγητές**, έχουμε [συμπεριλάβει κάποιες προτάσεις](for-teachers.md) για το πώς να χρησιμοποιήσετε αυτό το πρόγραμμα σπουδών. Θα εκτιμούσαμε τα σχόλιά σας [στο φόρουμ συζητήσεων](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! +> **Καθηγητές**, έχουμε [συμπεριλάβει ορισμένες προτάσεις](for-teachers.md) για το πώς να χρησιμοποιήσετε αυτό το πρόγραμμα σπουδών. Θα θέλαμε να λάβουμε τα σχόλιά σας [στο φόρουμ συζήτησης](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! -**[Μαθητές](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, για κάθε μάθημα, ξεκινήστε με ένα προ-μάθημα κουίζ και συνεχίστε διαβάζοντας το υλικό, ολοκληρώνοντας τις διάφορες δραστηριότητες και ελέγχοντας την κατανόησή σας με το κουίζ μετά το μάθημα. +**[Μαθητές](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, για κάθε μάθημα, ξεκινήστε με ένα κουίζ πριν από τη διάλεξη και συνεχίστε με την ανάγνωση του υλικού διάλεξης, την ολοκλήρωση των διαφόρων δραστηριοτήτων και ελέγξτε την κατανόησή σας με το κουίζ μετά τη διάλεξη. -Για να βελτιώσετε την εκπαιδευτική σας εμπειρία, συνδεθείτε με τους συναδέλφους σας για να δουλέψετε μαζί στα έργα! Οι συζητήσεις ενθαρρύνονται στο [φόρουμ συζητήσεών μας](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) όπου η ομάδα των συντονιστών μας θα είναι διαθέσιμη να απαντήσει στις ερωτήσεις σας. +Για να ενισχύσετε την εμπειρία μάθησής σας, συνδεθείτε με τους συμφοιτητές σας για να δουλέψετε τα έργα από κοινού! Η συζήτηση ενθαρρύνεται στο [φόρουμ συζήτησής μας](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) όπου η ομάδα των μεσαζόντων μας θα είναι διαθέσιμη να απαντήσει στις ερωτήσεις σας. -Για περαιτέρω εκπαίδευση, προτείνουμε ανεπιφύλακτα να εξερευνήσετε το [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) για επιπλέον εκπαιδευτικό υλικό. +Για περαιτέρω εκπαίδευση, συνιστούμε έντονα να εξερευνήσετε το [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) για επιπλέον υλικά μελέτης. -### 📋 Ρύθμιση του περιβάλλοντος εργασίας σας +### 📋 Ρύθμιση του περιβάλλοντός σας -Αυτό το πρόγραμμα έχει ένα έτοιμο περιβάλλον ανάπτυξης! Καθώς ξεκινάτε, μπορείτε να επιλέξετε να τρέξετε το πρόγραμμα σε ένα [Codespace](https://github.com/features/codespaces/) (_ένα περιβάλλον βασισμένο σε πρόγραμμα περιήγησης, χωρίς να χρειάζεται εγκατάσταση_), ή τοπικά στον υπολογιστή σας χρησιμοποιώντας ένα επεξεργαστή κειμένου όπως το [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +Αυτό το πρόγραμμα σπουδών διαθέτει έτοιμο περιβάλλον ανάπτυξης! Καθώς ξεκινάτε, μπορείτε να επιλέξετε να τρέξετε το πρόγραμμα σε [Codespace](https://github.com/features/codespaces/) (_ένα περιβάλλον βασισμένο σε browser χωρίς ανάγκη εγκαταστάσεων_), ή τοπικά στον υπολογιστή σας χρησιμοποιώντας έναν επεξεργαστή κειμένου όπως το [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). #### Δημιουργήστε το αποθετήριό σας -Για να αποθηκεύετε εύκολα τη δουλειά σας, συνιστάται να δημιουργήσετε το δικό σας αντίγραφο αυτού του αποθετηρίου. Μπορείτε να το κάνετε πατώντας το κουμπί **Use this template** στην κορυφή της σελίδας. Αυτό θα δημιουργήσει ένα νέο αποθετήριο στον λογαριασμό σας GitHub με ένα αντίγραφο του προγράμματος σπουδών. +Για να αποθηκεύετε εύκολα τη δουλειά σας, συνιστάται να δημιουργήσετε το δικό σας αντίγραφο αυτού του αποθετηρίου. Μπορείτε να το κάνετε κάνοντας κλικ στο κουμπί **Use this template** στην κορυφή της σελίδας. Αυτό θα δημιουργήσει ένα νέο αποθετήριο στον λογαριασμό σας στο GitHub με ένα αντίγραφο του προγράμματος σπουδών. Ακολουθήστε αυτά τα βήματα: -1. **Δημιουργήστε Fork στο Αποθετήριο**: Πατήστε το κουμπί "Fork" στην πάνω δεξιά γωνία αυτής της σελίδας. -2. **Κλωνοποιήστε το Αποθετήριο**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +1. **Δημιουργήστε Fork το Αποθετήριο**: Κάντε κλικ στο κουμπί "Fork" στην πάνω δεξιά γωνία αυτής της σελίδας. +2. **Κατεβάστε το Αποθετήριο (Clone)**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -#### Εκτέλεση του προγράμματος σε Codespace +#### Τρέξιμο του προγράμματος σπουδών σε Codespace -Στο αντίγραφό σας αυτού του αποθετηρίου που δημιουργήσατε, πατήστε το κουμπί **Code** και επιλέξτε **Open with Codespaces**. Αυτό θα δημιουργήσει ένα νέο Codespace για να δουλέψετε μέσα. +Στο αντίγραφο αυτού του αποθετηρίου που δημιουργήσατε, πατήστε το κουμπί **Code** και επιλέξτε **Open with Codespaces**. Αυτό θα δημιουργήσει ένα νέο Codespace για να εργαστείτε μέσα. ![Codespace](../../translated_images/el/createcodespace.0238bbf4d7a8d955.webp) -#### Εκτέλεση του προγράμματος τοπικά στον υπολογιστή σας +#### Τρέξιμο του προγράμματος τοπικά στον υπολογιστή σας -Για να τρέξετε το πρόγραμμα τοπικά στον υπολογιστή σας, θα χρειαστείτε έναν επεξεργαστή κειμένου, ένα πρόγραμμα περιήγησης και ένα εργαλείο γραμμής εντολών. Το πρώτο μας μάθημα, [Εισαγωγή στις Γλώσσες Προγραμματισμού και Εργαλεία του Επαγγέλματος](../../1-getting-started-lessons/1-intro-to-programming-languages), θα σας καθοδηγήσει μέσα από τις διάφορες επιλογές κάθε εργαλείου ώστε να επιλέξετε τι ταιριάζει καλύτερα σε εσάς. +Για να τρέξετε αυτό το πρόγραμμα τοπικά στον υπολογιστή σας, θα χρειαστείτε έναν επεξεργαστή κειμένου, έναν περιηγητή (browser) και ένα εργαλείο γραμμής εντολών. Το πρώτο μας μάθημα, [Εισαγωγή στις Γλώσσες Προγραμματισμού και Εργαλεία](../../1-getting-started-lessons/1-intro-to-programming-languages), θα σας καθοδηγήσει μέσα από διάφορες επιλογές για κάθε ένα από αυτά τα εργαλεία ώστε να επιλέξετε τι λειτουργεί καλύτερα για εσάς. -Η πρότασή μας είναι να χρησιμοποιήσετε το [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ως τον επεξεργαστή σας, που διαθέτει επίσης ενσωματωμένο [Τερματικό](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Μπορείτε να κατεβάσετε το Visual Studio Code [εδώ](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). -1. Αντιγράψτε το αποθετήριο σας στον υπολογιστή σας. Μπορείτε να το κάνετε αυτό πατώντας το κουμπί **Code** και αντιγράφοντας το URL: +Η σύστασή μας είναι να χρησιμοποιήσετε το [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ως επεξεργαστή, που διαθέτει επίσης ενσωματωμένο [Τερματικό](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Μπορείτε να κατεβάσετε το Visual Studio Code [εδώ](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +1. Κλωνοποιήστε το αποθετήριο σας στον υπολογιστή σας. Μπορείτε να το κάνετε πατώντας το κουμπί **Code** και αντιγράφοντας το URL: [CodeSpace](./images/createcodespace.png) - Στη συνέχεια, ανοίξτε το [Τερματικό](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) μέσα στο [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) και εκτελέστε την παρακάτω εντολή, αντικαθιστώντας το `` με το URL που μόλις αντιγράψατε: + Στη συνέχεια, ανοίξτε το [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) μέσα στο [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) και εκτελέστε την παρακάτω εντολή, αντικαθιστώντας το `` με το URL που μόλις αντιγράψατε: ```bash git clone ``` -2. Ανοίξτε το φάκελο στο Visual Studio Code. Μπορείτε να το κάνετε αυτό πατώντας **File** > **Open Folder** και επιλέγοντας το φάκελο που μόλις αντιγράψατε. +2. Ανοίξτε τον φάκελο στο Visual Studio Code. Μπορείτε να το κάνετε πατώντας **File** > **Open Folder** και επιλέγοντας τον φάκελο που μόλις κλωνοποιήσατε. -> Προτεινόμενες επεκτάσεις για το Visual Studio Code: +> Συνιστώμενες επεκτάσεις Visual Studio Code: > > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - για προεπισκόπηση σελίδων HTML μέσα στο Visual Studio Code > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - για να σας βοηθά να γράφετε κώδικα πιο γρήγορα @@ -145,78 +145,78 @@ - προαιρετικό σκίτσο - προαιρετικό συμπληρωματικό βίντεο -- προθέρμανση με quiz πριν το μάθημα +- προθέρμανση πριν το μάθημα με κουίζ - γραπτό μάθημα -- για μαθήματα με έργα, οδηγούς βήμα-βήμα για το πώς να φτιάξετε το έργο +- για μαθήματα βασισμένα σε έργο, βήμα-βήμα οδηγίες για την κατασκευή του έργου - ελέγχους γνώσης - μια πρόκληση - συμπληρωματική ανάγνωση -- ανάθεση εργασίας -- [quiz μετά το μάθημα](https://ff-quizzes.netlify.app/web/) +- εργασία +- [μετα-μάθημα κουίζ](https://ff-quizzes.netlify.app/web/) -> **Μια σημείωση για τα quiz**: Όλα τα quiz περιέχονται στον φάκελο Quiz-app, συνολικά 48 quiz με τρεις ερωτήσεις το καθένα. Είναι διαθέσιμα [εδώ](https://ff-quizzes.netlify.app/web/) και η εφαρμογή quiz μπορεί να τρέξει τοπικά ή να αναπτυχθεί στο Azure· ακολουθήστε τις οδηγίες στον φάκελο `quiz-app`. +> **Σημείωση σχετικά με τα κουίζ**: Όλα τα κουίζ βρίσκονται στον φάκελο Quiz-app, 48 συνολικά κουίζ με τρεις ερωτήσεις το καθένα. Είναι διαθέσιμα [εδώ](https://ff-quizzes.netlify.app/web/) eta εφαρμογή κουίζ μπορεί να τρέξει τοπικά ή να αναπτυχθεί στο Azure· ακολουθήστε τις οδηγίες στον φάκελο `quiz-app`. ## 🗃️ Μαθήματα -| | Όνομα Έργου | Διδακτικές Έννοιες | Στόχοι Μάθησης | Συνδεδεμένο Μάθημα | Συγγραφέας | -| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | -| 01 | Ξεκινώντας | Εισαγωγή στον Προγραμματισμό και τα Εργαλεία της Επαγγελματίας | Μάθετε τις βασικές αρχές που διέπουν τις περισσότερες γλώσσες προγραμματισμού και για το λογισμικό που βοηθά τους επαγγελματίες προγραμματιστές να κάνουν τη δουλειά τους | [Εισαγωγή στις Γλώσσες Προγραμματισμού και Εργαλεία](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | Ξεκινώντας | Βασικά του GitHub, περιλαμβάνει συνεργασία με ομάδα | Πώς να χρησιμοποιείτε το GitHub στο έργο σας και πώς να συνεργάζεστε με άλλους σε μια βάση κώδικα | [Εισαγωγή στο GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | Ξεκινώντας | Προσβασιμότητα | Μάθετε τα βασικά της προσβασιμότητας στο διαδίκτυο | [Βασικά Προσβασιμότητας](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | Βασικά JS | Τύποι Δεδομένων JavaScript | Τα βασικά για τους τύπους δεδομένων στη JavaScript | [Τύποι Δεδομένων](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | Βασικά JS | Συναρτήσεις και Μέθοδοι | Μάθετε για συναρτήσεις και μεθόδους για τη διαχείριση της ροής λογικής μιας εφαρμογής | [Συναρτήσεις και Μέθοδοι](./2-js-basics/2-functions-methods/README.md) | Jasmine και Christopher | -| 06 | Βασικά JS | Λήψη Αποφάσεων με JS | Μάθετε πώς να δημιουργείτε συνθήκες στον κώδικα σας χρησιμοποιώντας μεθόδους λήψης αποφάσεων | [Λήψη Αποφάσεων](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | Βασικά JS | Πίνακες και Βρόχοι | Εργαστείτε με δεδομένα χρησιμοποιώντας πίνακες και βρόχους στη JavaScript | [Πίνακες και Βρόχοι](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML στην Πράξη | Δημιουργήστε το HTML για να φτιάξετε ένα διαδικτυακό terrarium, εστιάζοντας στη δημιουργία διάταξης | [Εισαγωγή στο HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS στην Πράξη | Δημιουργήστε το CSS για να στυλιζάρετε το διαδικτυακό terrarium, εστιάζοντας στα βασικά του CSS και το responsive design | [Εισαγωγή στο CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | Κλεισίματα JavaScript, χειρισμός DOM | Δημιουργήστε το JavaScript ώστε το terrarium να λειτουργεί με drag/drop interface, εστιάζοντας στα closures και χειρισμό DOM | [Κλεισίματα JavaScript, χειρισμός DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [Παιχνίδι Πληκτρολόγησης](./4-typing-game/solution/README.md) | Δημιουργία Παιχνιδιού Πληκτρολόγησης | Μάθετε πώς να χρησιμοποιείτε συμβάντα πληκτρολογίου για να καθοδηγήσετε τη λογική της εφαρμογής JavaScript σας | [Προγραμματισμός με συμβάντα](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [Πράσινη Επέκταση Περιηγητή](./5-browser-extension/solution/README.md) | Εργασία με Περιηγητές | Μάθετε πώς λειτουργούν οι περιηγητές, την ιστορία τους, και πώς να στήσετε τα πρώτα στοιχεία μιας επέκτασης περιηγητή | [Σχετικά με τους Περιηγητές](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [Πράσινη Επέκταση Περιηγητή](./5-browser-extension/solution/README.md) | Δημιουργία φόρμας, κλήση API και αποθήκευση μεταβλητών τοπικά | Δημιουργήστε τα JavaScript στοιχεία της επέκτασης περιηγητή σας για να καλέσετε ένα API χρησιμοποιώντας μεταβλητές αποθηκευμένες τοπικά | [APIs, Φόρμες και Τοπική Αποθήκευση](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [Πράσινη Επέκταση Περιηγητή](./5-browser-extension/solution/README.md) | Παρασκηνιακές διεργασίες στον περιηγητή, απόδοση στο web | Χρησιμοποιήστε τις παρασκηνιακές διεργασίες του περιηγητή για να διαχειριστείτε το εικονίδιο της επέκτασης· μάθετε για την απόδοση και βελτιστοποιήσεις | [Παρασκηνιακές Εργασίες και Απόδοση](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Προχωρημένη Ανάπτυξη Παιχνιδιού με JavaScript | Μάθετε για την κληρονομικότητα μέσω Κλάσεων και Σύνθεσης καθώς και το μοτίβο Pub/Sub, προετοιμαζόμενοι για ανάπτυξη παιχνιδιού | [Εισαγωγή στην Προχωρημένη Ανάπτυξη Παιχνιδιού](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Σχεδίαση σε καμβά | Μάθετε για το Canvas API, που χρησιμοποιείται για τη σχεδίαση στοιχείων σε οθόνη | [Σχεδίαση σε Καμβά](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Μετακίνηση στοιχείων στην οθόνη | Ανακαλύψτε πώς τα στοιχεία μπορούν να κινηθούν χρησιμοποιώντας καρτεσιανές συντεταγμένες και το Canvas API | [Μετακίνηση Στοιχείων](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Ανίχνευση Σύγκρουσης | Κάντε τα στοιχεία να συγκρούονται και να αντιδρούν μεταξύ τους χρησιμοποιώντας πατήματα πλήκτρων και παρέχετε συνάρτηση cooldown για την απόδοση του παιχνιδιού | [Ανίχνευση Σύγκρουσης](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Καταμέτρηση Βαθμολογίας | Πραγματοποιήστε μαθηματικούς υπολογισμούς βάσει της κατάστασης και της απόδοσης του παιχνιδιού | [Καταμέτρηση Βαθμολογίας](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Τερματισμός και επανεκκίνηση του παιχνιδιού | Μάθετε για τον τερματισμό και την επανεκκίνηση του παιχνιδιού, συμπεριλαμβανομένου του καθαρισμού πόρων και της επαναφοράς μεταβλητών | [Ο Όρος Τερματισμού](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [Εφαρμογή Τραπεζικής](./7-bank-project/solution/README.md) | Πρότυπα HTML και Διαδρομές σε Web Εφαρμογή | Μάθετε πώς να δημιουργήσετε τη δομή μιας πολυσέλιδης ιστοσελίδας χρησιμοποιώντας διαδρομές και πρότυπα HTML | [Πρότυπα HTML και Διαδρομές](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [Εφαρμογή Τραπεζικής](./7-bank-project/solution/README.md) | Δημιουργία Φόρμας Εισόδου και Εγγραφής | Μάθετε για τη δημιουργία φορμών και διαχείριση ελέγχων εγκυρότητας | [Φόρμες](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [Εφαρμογή Τραπεζικής](./7-bank-project/solution/README.md) | Μέθοδοι Ανάκτησης και Χρήσης Δεδομένων | Πώς ρέουν τα δεδομένα μέσα και έξω από την εφαρμογή σας, πώς να τα ανακτάτε, αποθηκεύετε και απορρίπτετε | [Δεδομένα](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [Εφαρμογή Τραπεζικής](./7-bank-project/solution/README.md) | Έννοιες Διαχείρισης Κατάστασης | Μάθετε πώς η εφαρμογή σας διατηρεί την κατάσταση και πώς να τη διαχειρίζεστε προγραμματιστικά | [Διαχείριση Κατάστασης](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Κώδικας Browser/VScode](../../8-code-editor) | Εργασία με VScode | Μάθετε πώς να χρησιμοποιείτε έναν κειμενογράφο κώδικα| [Χρήση του Visual Studio Code](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [Βοηθοί Τεχνητής Νοημοσύνης](./9-chat-project/README.md) | Εργασία με Τεχνητή Νοημοσύνη | Μάθετε πώς να δημιουργήσετε τον δικό σας βοηθό AI | [Έργο Βοηθού AI](./9-chat-project/README.md) | Chris | +| | Όνομα Έργου | Διδασκόμενες Έννοιες | Στόχοι Μάθησης | Σύνδεσμος Μαθήματος | Συγγραφέας | +| :-: | :----------------------------------------------------------: | :------------------------------------------------------------------------: | -------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :-------------------------: | +| 01 | Ξεκινώντας | Εισαγωγή στον Προγραμματισμό και Εργαλεία | Μάθετε τις βασικές αρχές πίσω από τις περισσότερες γλώσσες προγραμματισμού και για το λογισμικό που βοηθά τους προγραμματιστές | [Εισαγωγή στις γλώσσες προγραμματισμού και τα εργαλεία](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | Ξεκινώντας | Βασικά του GitHub, περιλαμβάνει εργασία σε ομάδα | Πώς να χρησιμοποιείτε το GitHub στο έργο σας, πώς να συνεργαστείτε με άλλους σε κώδικα | [Εισαγωγή στο GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | Ξεκινώντας | Προσβασιμότητα | Μάθετε τα βασικά για την προσβασιμότητα στον ιστό | [Θεμέλια Προσβασιμότητας](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | Βασικά JS | Τύποι Δεδομένων JavaScript | Τα βασικά των τύπων δεδομένων στην JavaScript | [Τύποι Δεδομένων](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | Βασικά JS | Συναρτήσεις και Μέθοδοι | Μάθετε για τις συναρτήσεις και τις μεθόδους για να διαχειρίζεστε τη λογική μιας εφαρμογής | [Συναρτήσεις και Μέθοδοι](./2-js-basics/2-functions-methods/README.md) | Jasmine και Christopher | +| 06 | Βασικά JS | Λήψη Αποφάσεων με JS | Μάθετε πώς να δημιουργείτε συνθήκες στον κώδικά σας χρησιμοποιώντας μεθόδους λήψης αποφάσεων | [Λήψη Αποφάσεων](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | Βασικά JS | Πίνακες και Βρόχοι | Εργαστείτε με δεδομένα χρησιμοποιώντας πίνακες και βρόχους στην JavaScript | [Πίνακες και Βρόχοι](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | Εφαρμογή HTML | Δημιουργήστε το HTML για ένα διαδικτυακό terrarium, εστιάζοντας στη διάταξη | [Εισαγωγή στο HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | Εφαρμογή CSS | Δημιουργήστε την CSS για τη μορφοποίηση του διαδικτυακού terrarium, εστιάζοντας στα βασικά του CSS και στην ανταπόκριση της σελίδας | [Εισαγωγή στο CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | Κλεισίματα JavaScript, διαχείριση DOM | Δημιουργήστε την JavaScript ώστε να κάνει το terrarium λειτουργικό ως διεπαφή μεταφοράς και απόθεσης, εστιάζοντας στα κλεισίματα και τη διαχείριση DOM | [Κλεισίματα JavaScript, διαχείριση DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [Παιχνίδι πληκτρολόγησης](./4-typing-game/solution/README.md) | Δημιουργία Παιχνιδιού Πληκτρολόγησης | Μάθετε πώς να χρησιμοποιείτε γεγονότα πληκτρολογίου για να καθοδηγείτε τη λογική της εφαρμογής JavaScript | [Προγραμματισμός με Γεγονότα](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [Επέκταση Πράσινου Περιηγητή](./5-browser-extension/solution/README.md) | Εργασία με Περιηγητές | Μάθετε πώς λειτουργούν οι περιηγητές, την ιστορία τους, και πώς να στήσετε τα πρώτα στοιχεία μιας επέκτασης περιηγητή | [Σχετικά με τους Περιηγητές](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [Επέκταση Πράσινου Περιηγητή](./5-browser-extension/solution/README.md) | Δημιουργία φόρμας, κλήση API και αποθήκευση μεταβλητών τοπικά | Δημιουργήστε τα στοιχεία JavaScript της επέκτασης περιηγητή σας για να καλείτε ένα API χρησιμοποιώντας μεταβλητές αποθηκευμένες τοπικά | [API, Φόρμες και Τοπική Αποθήκευση](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [Επέκταση Πράσινου Περιηγητή](./5-browser-extension/solution/README.md) | Παρασκηνιακές διεργασίες στον περιηγητή, απόδοση ιστού | Χρησιμοποιήστε τις παρασκηνιακές διεργασίες του περιηγητή για να διαχειριστείτε το εικονίδιο της επέκτασης· μάθετε για την απόδοση και διάφορους βελτιστοποιήσεις | [Παρασκηνιακές Εργασίες και Απόδοση](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Προχωρημένη Ανάπτυξη Παιχνιδιών με JavaScript | Μάθετε για την Κληρονομικότητα με Χρήση Κλάσεων και Σύνθεσης καθώς και το πρότυπο εγγραφής/εγγραφής (Pub/Sub), προετοιμασία για δημιουργία παιχνιδιού | [Εισαγωγή στην Προχωρημένη Ανάπτυξη Παιχνιδιών](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Σχεδίαση σε καμβά | Μάθετε για το Canvas API, που χρησιμοποιείται για τη σχεδίαση στοιχείων σε οθόνη | [Σχεδίαση σε καμβά](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Μετακίνηση στοιχείων στην οθόνη | Ανακαλύψτε πώς τα στοιχεία μπορούν να κινούνται χρησιμοποιώντας καρτεσιανές συντεταγμένες και το Canvas API | [Μετακίνηση Στοιχείων](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Ανίχνευση συγκρούσεων | Κάντε τα στοιχεία να συγκρούονται και να αντιδρούν το ένα στο άλλο με χρήση πατημάτων πλήκτρων και παρέχετε λειτουργία επαναφόρτισης για απόδοση | [Ανίχνευση Συγκρούσεων](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Κράτηση σκορ | Εκτελέστε μαθηματικούς υπολογισμούς βάση της κατάστασης και της απόδοσης του παιχνιδιού | [Κράτηση Σκορ](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [Παιχνίδι Διαστήματος](./6-space-game/solution/README.md) | Τέλος και επανεκκίνηση παιχνιδιού | Μάθετε για το πώς να τερματίζετε και να επανεκκινείτε το παιχνίδι, περιλαμβάνοντας καθαρισμό πόρων και επαναφορά τιμών μεταβλητών | [Η Συνθήκη Τέλους](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [Εφαρμογή Τράπεζας](./7-bank-project/solution/README.md) | Πρότυπα HTML και Διαδρομές σε Web Εφαρμογή | Μάθετε πώς να δημιουργήσετε τη δομή ενός πολυσέλιδου ιστότοπου χρησιμοποιώντας δρομολόγηση και πρότυπα HTML | [Πρότυπα και Διαδρομές HTML](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [Εφαρμογή Τράπεζας](./7-bank-project/solution/README.md) | Δημιουργία Φόρμας Σύνδεσης και Εγγραφής | Μάθετε για τη δημιουργία φορμών και τη διαχείριση διαδικασιών επικύρωσης | [Φόρμες](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [Εφαρμογή Τράπεζας](./7-bank-project/solution/README.md) | Μέθοδοι Ανάκτησης και Χρήσης Δεδομένων | Πώς ρέουν τα δεδομένα μέσα και έξω από την εφαρμογή σας, πώς να τα ανακτάτε, αποθηκεύετε και απορρίπτετε | [Δεδομένα](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [Εφαρμογή Τράπεζας](./7-bank-project/solution/README.md) | Έννοιες Διαχείρισης Κατάστασης | Μάθετε πώς η εφαρμογή σας διατηρεί κατάσταση και πώς να τη διαχειρίζεστε προγραμματιστικά | [Διαχείριση Κατάστασης](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [Browser/VScode Code](../../8-code-editor) | Εργασία με VScode | Μάθετε πώς να χρησιμοποιείτε έναν επεξεργαστή κώδικα | [Χρήση Επεξεργαστή Κώδικα VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [Βοηθοί AI](./9-chat-project/README.md) | Εργασία με AI | Μάθετε πώς να δημιουργήσετε το δικό σας βοηθό AI | [Έργο Βοηθού AI](./9-chat-project/README.md) | Chris | ## 🏫 Παιδαγωγική -Το πρόγραμμα σπουδών μας έχει σχεδιαστεί με δύο βασικές παιδαγωγικές αρχές κατά νου: +Το πρόγραμμα σπουδών μας έχει σχεδιαστεί με δύο βασικές παιδαγωγικές αρχές στο μυαλό: * μάθηση βασισμένη σε έργα -* συχνά quiz +* συχνά κουίζ -Το πρόγραμμα διδάσκει τα θεμέλια της JavaScript, HTML και CSS, καθώς και τα πιο σύγχρονα εργαλεία και τεχνικές που χρησιμοποιούν οι σύγχρονοι προγραμματιστές ιστοσελίδων. Οι μαθητές θα έχουν την ευκαιρία να αναπτύξουν πρακτική εμπειρία δημιουργώντας ένα παιχνίδι πληκτρολόγησης, ένα εικονικό terrarium, μια οικολογική επέκταση περιηγητή, ένα παιχνίδι τύπου space-invader και μια εφαρμογή τραπεζικής για επιχειρήσεις. Μέχρι το τέλος της σειράς, οι μαθητές θα έχουν αποκτήσει μια στέρεη κατανόηση της ανάπτυξης ιστού. +Το πρόγραμμα διδάσκει τα βασικά του JavaScript, HTML και CSS, καθώς και τα πιο πρόσφατα εργαλεία και τεχνικές που χρησιμοποιούν οι σημερινοί προγραμματιστές ιστού. Οι μαθητές θα έχουν την ευκαιρία να αποκτήσουν πρακτική εμπειρία κατασκευάζοντας ένα παιχνίδι πληκτρολόγησης, ένα εικονικό terrarium, μια οικολογική επέκταση περιηγητή, ένα παιχνίδι σε στυλ space invader και μια τραπεζική εφαρμογή για επιχειρήσεις. Μέχρι το τέλος της σειράς, οι μαθητές θα έχουν αποκτήσει μια στιβαρή κατανόηση της ανάπτυξης ιστού. -> 🎓 Μπορείτε να παρακολουθήσετε τα πρώτα μαθήματα αυτής της ύλης ως [Μονοπάτι Μάθησης](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) στο Microsoft Learn! +> 🎓 Μπορείτε να παρακολουθήσετε τα πρώτα μαθήματα αυτού του προγράμματος ως [Μονοπάτι Μάθησης](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) στο Microsoft Learn! -Με τη διασφάλιση ότι το περιεχόμενο ευθυγραμμίζεται με τα έργα, η διαδικασία γίνεται πιο ελκυστική για τους μαθητές και η διατήρηση των εννοιών ενισχύεται. Επίσης, γράψαμε αρκετά αρχικά μαθήματα στα βασικά της JavaScript για να εισαγάγουμε έννοιες, σε συνδυασμό με ένα βίντεο από τη συλλογή βιντεομαθημάτων "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", με ορισμένους από τους συγγραφείς της να συμβάλλουν σ' αυτό το πρόγραμμα σπουδών. +Εξασφαλίζοντας ότι το περιεχόμενο ευθυγραμμίζεται με τα έργα, η διαδικασία γίνεται πιο ελκυστική για τους μαθητές και η διατήρηση των εννοιών θα ενισχυθεί. Γράψαμε επίσης αρκετά εισαγωγικά μαθήματα της βασικής JavaScript για να εισάγουμε έννοιες, σε συνδυασμό με ένα βίντεο από τη συλλογή "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", με μερικούς από τους συγγραφείς να έχουν συνεισφέρει σε αυτό το πρόγραμμα σπουδών. -Επιπλέον, ένα quiz χαμηλής έντασης πριν από το μάθημα θέτει την πρόθεση του μαθητή για τη μάθηση ενός θέματος, ενώ ένα δεύτερο quiz μετά το μάθημα εξασφαλίζει περαιτέρω διατήρηση γνώσεων. Το πρόγραμμα σπουδών έχει σχεδιαστεί να είναι ευέλικτο και διασκεδαστικό και μπορεί να παρακολουθηθεί ολόκληρο ή μερικώς. Τα έργα ξεκινούν μικρά και γίνονται ολοένα και πιο σύνθετα μέχρι το τέλος του 12-εβδομάδων κύκλου. +Επιπλέον, ένα κουίζ χαμηλού ρίσκου πριν από το μάθημα θέτει την πρόθεση του μαθητή για να μάθει ένα θέμα, ενώ ένα δεύτερο κουίζ μετά το μάθημα εξασφαλίζει περαιτέρω διατήρηση. Το πρόγραμμα αυτό σχεδιάστηκε για να είναι ευέλικτο και διασκεδαστικό και μπορεί να παρακολουθηθεί ολόκληρο ή μεμονωμένα. Τα έργα ξεκινούν μικρά και γίνονται ολοένα πιο σύνθετα μέχρι το τέλος του 12-εβδομάδων κύκλου. -Ενώ αποφεύξαμε σκόπιμα την εισαγωγή πλαισίων JavaScript για να εστιάσουμε στις βασικές δεξιότητες που χρειάζεται ένας προγραμματιστής ιστού πριν υιοθετήσει ένα πλαίσιο, το επόμενο βήμα για την ολοκλήρωση αυτού του προγράμματος θα ήταν η εκμάθηση του Node.js μέσω μιας άλλης συλλογής βίντεο: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". +Ενώ αποφεύξαμε σκόπιμα την εισαγωγή JavaScript frameworks για να επικεντρωθούμε στις βασικές δεξιότητες που απαιτούνται ως προγραμματιστής ιστού πριν από την υιοθέτηση ενός framework, ένα καλό επόμενο βήμα για να ολοκληρώσετε αυτό το πρόγραμμα θα ήταν η εκμάθηση του Node.js μέσω μιας άλλης συλλογής βίντεο: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". -> Επισκεφτείτε τους [Κανόνες Συμπεριφοράς](CODE_OF_CONDUCT.md) και τις οδηγίες [Συμμετοχής](CONTRIBUTING.md). Καλωσορίζουμε τα εποικοδομητικά σας σχόλια! +> Επισκεφθείτε τις οδηγίες μας [Κώδικας Συμπεριφοράς](CODE_OF_CONDUCT.md) και [Συνεισφοράς](CONTRIBUTING.md). Εκτιμούμε τα εποικοδομητικά σχόλιά σας! -## 🧭 Πρόσβαση εκτός σύνδεσης +## 🧭 Πρόσβαση χωρίς σύνδεση -Μπορείτε να εκτελέσετε αυτή την τεκμηρίωση χωρίς σύνδεση χρησιμοποιώντας το [Docsify](https://docsify.js.org/#/). Κάντε fork αυτό το αποθετήριο, [εγκαταστήστε το Docsify](https://docsify.js.org/#/quickstart) στον τοπικό σας υπολογιστή και στη συνέχεια στον ριζικό φάκελο αυτού του αποθετηρίου πληκτρολογήστε `docsify serve`. Η ιστοσελίδα θα σερβιριστεί στη θύρα 3000 στο localhost σας: `localhost:3000`. +Μπορείτε να τρέξετε αυτή την τεκμηρίωση εκτός σύνδεσης χρησιμοποιώντας [Docsify](https://docsify.js.org/#/). Κάντε fork αυτό το αποθετήριο, [εγκαταστήστε το Docsify](https://docsify.js.org/#/quickstart) στον τοπικό σας υπολογιστή και μετά στον ριζικό φάκελο αυτού του αποθετηρίου, πληκτρολογήστε `docsify serve`. Η ιστοσελίδα θα σερβιριστεί στην θύρα 3000 στο localhost σας: `localhost:3000`. ## 📘 PDF -Ένα PDF με όλα τα μαθήματα μπορείτε να βρείτε [εδώ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). +Ένα PDF όλων των μαθημάτων μπορεί να βρεθεί [εδώ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). ## 🎒 Άλλα Μαθήματα -Η ομάδα μας δημιουργεί και άλλα μαθήματα! Ρίξτε μια ματιά: +Η ομάδα μας παράγει και άλλα μαθήματα! Δες: ### LangChain @@ -260,21 +260,21 @@ ## Λήψη Βοήθειας -Αν κολλήσετε ή έχετε οποιεσδήποτε ερωτήσεις σχετικά με την ανάπτυξη εφαρμογών AI. Ενταχθείτε σε άλλους μαθητές και έμπειρους προγραμματιστές σε συζητήσεις για το MCP. Είναι μια υποστηρικτική κοινότητα όπου οι ερωτήσεις είναι ευπρόσδεκτες και η γνώση μοιράζεται ελεύθερα. +Εάν κολλήσετε ή έχετε ερωτήσεις σχετικά με την κατασκευή εφαρμογών AI. Ενταχθείτε σε άλλους μαθητές και έμπειρους προγραμματιστές σε συζητήσεις για το MCP. Είναι μια υποστηρικτική κοινότητα όπου οι ερωτήσεις είναι ευπρόσδεκτες και η γνώση μοιράζεται ελεύθερα. [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -Αν έχετε σχόλια για το προϊόν ή σφάλματα κατά την ανάπτυξη επισκεφθείτε: +Εάν έχετε σχόλια προϊόντος ή λάθη κατά την κατασκευή, επισκεφθείτε: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) -## Άδεια Χρήσης +## Άδεια -Αυτό το αποθετήριο έχει αδειοδοτηθεί υπό την άδεια MIT. Δείτε το αρχείο [LICENSE](../../LICENSE) για περισσότερες πληροφορίες. +Αυτό το αποθετήριο έχει άδεια υπό την άδεια MIT. Δείτε το αρχείο [LICENSE](../../LICENSE) για περισσότερες πληροφορίες. --- -**Αποποίηση ευθυνών**: -Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας την υπηρεσία μετάφρασης AI [Co-op Translator](https://github.com/Azure/co-op-translator). Παρόλο που επιδιώκουμε την ακρίβεια, παρακαλούμε σημειώστε ότι οι αυτόματες μεταφράσεις ενδέχεται να περιέχουν λάθη ή ανακρίβειες. Το πρωτότυπο έγγραφο στη μητρική του γλώσσα θα πρέπει να θεωρείται η αυθεντική πηγή. Για κρίσιμες πληροφορίες, συνιστάται επαγγελματική ανθρώπινη μετάφραση. Δεν φέρουμε καμία ευθύνη για τυχόν παρεξηγήσεις ή λανθασμένες ερμηνείες που προκύπτουν από τη χρήση αυτής της μετάφρασης. +**Αποποίηση ευθύνης**: +Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας την υπηρεσία μετάφρασης AI [Co-op Translator](https://github.com/Azure/co-op-translator). Παρόλο που επιδιώκουμε την ακρίβεια, παρακαλούμε να γνωρίζετε ότι οι αυτοματοποιημένες μεταφράσεις ενδέχεται να περιέχουν σφάλματα ή ανακρίβειες. Το πρωτότυπο έγγραφο στη μητρική του γλώσσα πρέπει να θεωρείται η αυθεντική πηγή. Για κρίσιμες πληροφορίες, συνιστάται επαγγελματική ανθρώπινη μετάφραση. Δεν φέρουμε ευθύνη για τυχόν παρεξηγήσεις ή λανθασμένες ερμηνείες που προκύπτουν από τη χρήση αυτής της μετάφρασης. \ No newline at end of file diff --git a/translations/el/lesson-template/README.md b/translations/el/lesson-template/README.md index 05a745980..506c5f6b9 100644 --- a/translations/el/lesson-template/README.md +++ b/translations/el/lesson-template/README.md @@ -1,56 +1,79 @@ -# [Θέμα Μαθήματος] +# Θέμα Μαθήματος -![Ενσωματώστε ένα βίντεο εδώ](../../../lesson-template/video-url) +## 🎥 Βίντεο -## [Προ-μάθημα κουίζ](../../../lesson-template/quiz-url) +> Προσθέστε εδώ ένα ενσωματωμένο βίντεο ή σύνδεσμο μαθήματος. -[Περιγράψτε τι θα μάθουμε] +--- + +## Προ-διάλεξη κουίζ + +> Προσθέστε εδώ έναν σύνδεσμο κουίζ όταν είναι διαθέσιμος. + +--- + +Παρέχετε μια σύντομη επισκόπηση του τι θα μάθουν οι μαθητές σε αυτό το μάθημα. + +--- ### Εισαγωγή -Περιγράψτε τι θα καλυφθεί +Παρέχετε μια σύντομη εισαγωγή που περιγράφει τι θα καλυφθεί σε αυτό το μάθημα. > Σημειώσεις +--- + ### Προαπαιτούμενα -Ποια βήματα πρέπει να έχουν ολοκληρωθεί πριν από αυτό το μάθημα; +Καταγράψτε τις έννοιες ή τα θέματα που οι μαθητές θα πρέπει να γνωρίζουν ήδη πριν ξεκινήσουν αυτό το μάθημα. + +--- ### Προετοιμασία -Βήματα προετοιμασίας για να ξεκινήσετε αυτό το μάθημα +Καταγράψτε τυχόν βήματα εγκατάστασης ή εργαλεία που απαιτούνται πριν ξεκινήσει το μάθημα. --- -[Προχωρήστε μέσα από το περιεχόμενο σε μπλοκ] +### Περιεχόμενο + +Προχωρήστε στο περιεχόμενο του μαθήματος σε δομημένες ενότητες. + +--- -## [Θέμα 1] +## Θέμα 1 ### Εργασία: -Συνεργαστείτε για να βελτιώσετε σταδιακά τη βάση κώδικα σας ώστε να δημιουργήσετε το έργο με κοινό κώδικα: +Εργαστείτε μαζί για να βελτιώσετε σταδιακά τον κώδικα σας ώστε να δημιουργήσετε το έργο με κοινόχρηστο κώδικα: ```html code blocks ``` -✅ Έλεγχος Γνώσεων - χρησιμοποιήστε αυτή τη στιγμή για να διευρύνετε τις γνώσεις των μαθητών με ανοιχτές ερωτήσεις +✅ Έλεγχος Γνώσης +Χρησιμοποιήστε αυτή τη στιγμή για να επεκτείνετε τις γνώσεις των μαθητών με ανοιχτές ερωτήσεις. -## [Θέμα 2] +## Θέμα 2 +## Θέμα 3 -## [Θέμα 3] +🚀 Πρόκληση +Προσθέστε μια συνεργατική πρόκληση για τους μαθητές να βελτιώσουν το έργο. -🚀 Πρόκληση: Προσθέστε μια πρόκληση για τους μαθητές να εργαστούν συνεργατικά στην τάξη για να βελτιώσουν το έργο +Προαιρετικό: Προσθέστε μια στιγμιοτυπία οθόνης του UI του ολοκληρωμένου μαθήματος αν είναι κατάλληλο. -Προαιρετικό: προσθέστε ένα στιγμιότυπο οθόνης του ολοκληρωμένου UI του μαθήματος, αν είναι κατάλληλο +## Μετά τη διάλεξη κουίζ -## [Κουίζ μετά το μάθημα](../../../lesson-template/quiz-url) +Προσθέστε έναν σύνδεσμο κουίζ εδώ μετά την ολοκλήρωση του μαθήματος. -## Ανασκόπηση & Αυτομελέτη +## Επανεξέταση & Αυτοδιδασκαλία -**Παράδοση Εργασίας [MM/YY]**: [Όνομα Εργασίας](assignment.md) +**Καθώς η παράδοση είναι [MM/YY]**: [Όνομα Εργασίας](assignment.md) --- -**Αποποίηση ευθύνης**: -Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας την υπηρεσία αυτόματης μετάφρασης [Co-op Translator](https://github.com/Azure/co-op-translator). Παρόλο που καταβάλλουμε προσπάθειες για ακρίβεια, παρακαλούμε να έχετε υπόψη ότι οι αυτόματες μεταφράσεις ενδέχεται να περιέχουν λάθη ή ανακρίβειες. Το πρωτότυπο έγγραφο στη μητρική του γλώσσα θα πρέπει να θεωρείται η αυθεντική πηγή. Για κρίσιμες πληροφορίες, συνιστάται επαγγελματική ανθρώπινη μετάφραση. Δεν φέρουμε ευθύνη για τυχόν παρεξηγήσεις ή εσφαλμένες ερμηνείες που προκύπτουν από τη χρήση αυτής της μετάφρασης. \ No newline at end of file + +**Αποποίηση Ευθυνών**: +Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας την υπηρεσία αυτόματης μετάφρασης AI [Co-op Translator](https://github.com/Azure/co-op-translator). Παρόλο που προσπαθούμε για ακρίβεια, παρακαλούμε να γνωρίζετε ότι οι αυτοματοποιημένες μεταφράσεις μπορεί να περιέχουν σφάλματα ή ανακρίβειες. Το αρχικό έγγραφο στη γλώσσα του θεωρείται η αυθεντική πηγή. Για κρίσιμες πληροφορίες, συνιστάται επαγγελματική ανθρώπινη μετάφραση. Δεν φέρουμε ευθύνη για τυχόν παρεξηγήσεις ή λανθασμένες ερμηνείες που προκύπτουν από τη χρήση αυτής της μετάφρασης. + \ No newline at end of file diff --git a/translations/sv/.co-op-translator.json b/translations/sv/.co-op-translator.json index 04ba021ad..e6b26db4e 100644 --- a/translations/sv/.co-op-translator.json +++ b/translations/sv/.co-op-translator.json @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2026-04-20T16:32:07+00:00", + "translation_date": "2026-04-24T16:23:42+00:00", "source_file": "AGENTS.md", "language_code": "sv" }, @@ -516,8 +516,8 @@ "language_code": "sv" }, "README.md": { - "original_hash": "b885c87c7544109b78d6684daad6cba6", - "translation_date": "2026-04-06T18:35:19+00:00", + "original_hash": "b1766b45123e043ef2c72612f28b86dd", + "translation_date": "2026-04-24T16:18:52+00:00", "source_file": "README.md", "language_code": "sv" }, @@ -564,8 +564,8 @@ "language_code": "sv" }, "lesson-template/README.md": { - "original_hash": "0494be70ad7fadd13a8c3d549c23e355", - "translation_date": "2025-08-26T23:13:43+00:00", + "original_hash": "ce2f64fd0d518f0500fc082b97c1e662", + "translation_date": "2026-04-24T16:19:07+00:00", "source_file": "lesson-template/README.md", "language_code": "sv" }, diff --git a/translations/sv/AGENTS.md b/translations/sv/AGENTS.md index 57d4a7455..0192b4b62 100644 --- a/translations/sv/AGENTS.md +++ b/translations/sv/AGENTS.md @@ -2,36 +2,36 @@ ## Projektöversikt -Detta är ett utbildningscurriculum för att lära ut grunderna i webbutveckling till nybörjare. Curriculumet är en omfattande 12-veckorskurs utvecklad av Microsoft Cloud Advocates, med 24 praktiska lektioner som täcker JavaScript, CSS och HTML. +Detta är ett utbildningscurriculum för att lära ut grunderna i webbutveckling för nybörjare. Curriculumen är en omfattande 12-veckorskurs utvecklad av Microsoft Cloud Advocates, med 24 praktiska lektioner som täcker JavaScript, CSS och HTML. ### Viktiga komponenter - **Utbildningsinnehåll**: 24 strukturerade lektioner organiserade i projektbaserade moduler -- **Praktiska projekt**: Terrarium, Skrivspel, Webbläsartillägg, Rymdspel, Bankapp, Kodredigerare och AI-chattassistent -- **Interaktiva quiz**: 48 quiz med 3 frågor vardera (före- och efter-lektionsbedömningar) -- **Flerspråkigt stöd**: Automatiska översättningar till 50+ språk via GitHub Actions +- **Praktiska projekt**: Terrarium, Typningsspel, Webbläsartillägg, Rymdspel, Bankapp, Kodredigerare och AI-chatassistent +- **Interaktiva quiz**: 48 quiz med 3 frågor vardera (för- och efterlektionstest) +- **Fler språkstöd**: Automatiska översättningar till över 50 språk via GitHub Actions - **Teknologier**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (för AI-projekt) ### Arkitektur -- Utbildningsrepository med lektionsbaserad struktur +- Utbildningsrepo med lektionbaserad struktur - Varje lektionsmapp innehåller README, kodexempel och lösningar - Självständiga projekt i separata kataloger (quiz-app, olika lektionsprojekt) -- Översättningssystem som använder GitHub Actions (co-op-translator) -- Dokumentation tillgänglig via Docsify och som PDF +- Översättningssystem via GitHub Actions (co-op-translator) +- Dokumentation serverad via Docsify och tillgänglig som PDF -## Installationskommandon +## Setup-kommandon -Detta repository är främst för konsumtion av utbildningsinnehåll. För arbete med specifika projekt: +Detta repository är främst för konsumtion av utbildningsinnehåll. För att arbeta med specifika projekt: -### Huvudrepositoryinstallation +### Huvudrepo Setup ```bash git clone https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners ``` -### Quiz App Installation (Vue 3 + Vite) +### Quiz Apps Setup (Vue 3 + Vite) ```bash cd quiz-app @@ -59,7 +59,7 @@ npm install # Följ webbläsarspecifika instruktioner för att ladda tillägg ``` -### Rymdspelsprojekt +### Rymdspelprojekt ```bash cd 6-space-game/solution @@ -67,40 +67,40 @@ npm install # Öppna index.html i webbläsaren eller använd Live Server ``` -### Chattprojekt (Python Backend) +### Chatprojekt (Python backend) ```bash cd 9-chat-project/solution/backend/python pip install openai -# Sätt miljövariabeln GITHUB_TOKEN +# Sätt GITHUB_TOKEN miljövariabeln python api.py ``` -## Utvecklingsarbetsflöde +## Utvecklingsflöde ### För innehållsbidragare -1. **Forka repositoryt** till ditt GitHub-konto +1. **Forka repot** till ditt GitHub-konto 2. **Klona din fork** lokalt 3. **Skapa en ny branch** för dina ändringar -4. Gör ändringar av lektioninnehåll eller kodexempel -5. Testa kodändringar i relevanta projektmappar -6. Skicka pull requests enligt riktlinjerna för bidrag +4. Gör ändringar i lektionsinnehåll eller kodexempel +5. Testa eventuella kodändringar i relevanta projektmappar +6. Skicka pull requests enligt riktlinjer för bidrag ### För elever -1. Forka eller klona repositoryt -2. Navigera sekventiellt till lektionsmappar +1. Forka eller klona repot +2. Navigera till lektionskataloger i ordning 3. Läs README-filer för varje lektion -4. Genomför quiz före lektioner på https://ff-quizzes.netlify.app/web/ -5. Arbeta igenom kodexempel i lektionsmappar +4. Gör för-lektions quiz på https://ff-quizzes.netlify.app/web/ +5. Arbeta igenom kodexempel i lektionsmapparna 6. Slutför uppgifter och utmaningar -7. Gör quiz efter lektioner +7. Gör efter-lektions quiz -### Live-utveckling +### Liveutveckling -- **Dokumentation**: Kör `docsify serve` i rotmappen (port 3000) -- **Quiz App**: Kör `npm run dev` i quiz-app-katalogen +- **Dokumentation**: Kör `docsify serve` från rotmappen (port 3000) +- **Quiz-app**: Kör `npm run dev` i quiz-app-katalogen - **Projekt**: Använd VS Code Live Server-tillägg för HTML-projekt - **API-projekt**: Kör `npm start` i respektive API-katalog @@ -110,25 +110,25 @@ python api.py ```bash cd quiz-app -npm run lint # Kontrollera kodstilproblem -npm run build # Verifiera att kompilering lyckas +npm run lint # Kontrollera kodstilsproblem +npm run build # Verifiera att bygget lyckas ``` ### Bank API-testning ```bash cd 7-bank-project/api -npm run lint # Kontrollera kodstilproblem +npm run lint # Kontrollera efter kodstilsproblem node server.js # Verifiera att servern startar utan fel ``` ### Allmän testmetod -- Detta är ett utbildningsrepository utan omfattande automatiserade tester +- Detta är ett utbildningsrepo utan omfattande automatiserade tester - Manuell testning fokuserar på: - Kodexempel körs utan fel - - Länkar i dokumentation fungerar korrekt - - Projekt bygger klart utan problem + - Länkar i dokumentationen fungerar korrekt + - Projekt byggs framgångsrikt - Exempel följer bästa praxis ### Kontroll före inskickning @@ -144,7 +144,7 @@ node server.js # Verifiera att servern startar utan fel - Använd modern ES6+ syntax - Följ standard ESLint-konfigurationer i projekten -- Använd meningsfulla variabel- och funktionsnamn för tydlighet i utbildningen +- Använd meningsfulla variabel- och funktionsnamn för pedagogisk tydlighet - Lägg till kommentarer som förklarar koncept för elever - Formatera med Prettier där det är konfigurerat @@ -152,19 +152,19 @@ node server.js # Verifiera att servern startar utan fel - Semantiska HTML5-element - Responsiva designprinciper -- Klara och tydliga klassnamn +- Tydliga klassnamns-konventioner - Kommentarer som förklarar CSS-tekniker för elever ### Python -- Följ PEP 8-stilriktlinjer -- Tydliga, pedagogiska kodexempel -- Typanvisningar där det är hjälpsamt för lärande +- PEP 8 stilriktlinjer +- Klara, pedagogiska kodexempel +- Typanvisningar där det hjälper inlärningen ### Markdown-dokumentation - Tydlig rubrikhierarki -- Kodblock med språkangivelse +- Kodblock med språk-syntax - Länkar till ytterligare resurser - Skärmdumpar och bilder i `images/`-mappar - Alt-text för bilder för tillgänglighet @@ -172,26 +172,26 @@ node server.js # Verifiera att servern startar utan fel ### Filorganisation - Lektioner numrerade sekventiellt (1-getting-started-lessons, 2-js-basics, etc.) -- Varje projekt har `solution/` och ofta `start/` eller `your-work/`-mappar -- Bilder lagras i lektion-specifika `images/`-mappar -- Översättningar i `translations/{language-code}/`-struktur +- Varje projekt har `solution/` och ofta `start/` eller `your-work/` mappar +- Bilder lagras i lektonspecifika `images/`-mappar +- Översättningar i `translations/{language-code}/` struktur ## Bygg och distribution -### Distribution av Quiz App (Azure Static Web Apps) +### Quiz App-distribution (Azure Static Web Apps) -quiz-app är konfigurerad för deployment via Azure Static Web Apps: +Quiz-appen är konfigurerad för distribution på Azure Static Web Apps: ```bash cd quiz-app npm run build # Skapar dist/-mappen -# Distribuerar via GitHub Actions arbetsflöde vid push till main +# Distribuerar via GitHub Actions-arbetsflöde vid push till main ``` Azure Static Web Apps-konfiguration: -- **App-lokalisation**: `/quiz-app` -- **Output-lokalisation**: `dist` -- **Arbetsflöde**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` +- **Appplats**: `/quiz-app` +- **Outputplats**: `dist` +- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` ### PDF-generering av dokumentation @@ -204,24 +204,24 @@ npm run convert # Generera PDF från docs ```bash npm install -g docsify-cli # Installera Docsify globalt -docsify serve # Servera på localhost:3000 +docsify serve # Kör på localhost:3000 ``` -### Projekt-specifika byggprocesser +### Projektspecifika byggsteg Varje projektkatalog kan ha sin egen byggprocess: - Vue-projekt: `npm run build` skapar produktionspaket -- Statiska projekt: Ingen byggsteg, servera filer direkt +- Statiska projekt: Inget byggsteg, filerna serveras direkt -## Pull Request-riktlinjer +## Riktlinjer för pull requests ### Titelformat -Använd tydliga, beskrivande titlar som anger ändringsområde: +Använd tydliga, beskrivande titlar som visar ändringsområde: - `[Quiz-app] Lägg till nytt quiz för lektion X` -- `[Lesson-3] Åtgärda stavfel i terrariumprojekt` -- `[Translation] Lägg till spansk översättning för lektion 5` -- `[Docs] Uppdatera installationsinstruktioner` +- `[Lektion-3] Fixar stavfel i terrariumprojekt` +- `[Översättning] Lägg till spanskt översättning för lektion 5` +- `[Docs] Uppdatera installationsanvisningar` ### Obligatoriska kontroller @@ -229,54 +229,54 @@ Innan PR skickas: 1. **Kodkvalitet**: - Kör `npm run lint` i berörda projektmappar - - Åtgärda alla lintfel och varningar + - Åtgärda alla lint-fel och varningar 2. **Byggverifiering**: - Kör `npm run build` om tillämpligt - - Säkerställ att inga byggfel uppstår + - Säkerställ inga byggfel 3. **Länkvalidering**: - Testa alla markdown-länkar - - Verifiera bildreferenser fungerar + - Verifiera att bildreferenser fungerar 4. **Innehållsgranskning**: - - Korrekturläs för stavning och grammatik - - Säkerställ kodexempel är korrekta och pedagogiska - - Kontrollera att översättningar bevarar ursprungligt budskap + - Korrekturläs stavning och grammatik + - Säkerställ att kodexempel är korrekta och pedagogiska + - Kontrollera att översättningar behåller originalmening ### Bidragskrav -- Acceptera Microsoft CLA (automatisk kontroll vid första PR) +- Godkänn Microsoft CLA (automatisk kontroll vid första PR) - Följ [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Se [CONTRIBUTING.md](./CONTRIBUTING.md) för detaljerade riktlinjer -- Referera ärendenummer i PR-beskrivning om tillämpligt +- Referera issue-nummer i PR-beskrivning om möjligt ### Granskningsprocess - PR granskas av underhållare och community - Pedagogisk tydlighet prioriteras - Kodexempel ska följa aktuella bästa praxis -- Översättningar granskas för korrekthet och kulturell anpassning +- Översättningar granskas för korrekthet och kulturell lämplighet ## Översättningssystem -### Automatisk översättning +### Automatiserad översättning -- Använder GitHub Actions med co-op-translator arbetsflöde -- Översätter automatiskt till 50+ språk +- Använder GitHub Actions med co-op-translator workflow +- Översätter automatiskt till över 50 språk - Källfiler i huvudkataloger -- Översatta filer i `translations/{language-code}/`-mappar +- Översatta filer i `translations/{language-code}/` kataloger -### Lägga till manuella förbättringar +### Lägga till manuella översättningsförbättringar 1. Lokalisera fil i `translations/{language-code}/` -2. Gör förbättringar med bibehållen struktur -3. Säkerställ att kodexempel fortsätter att fungera +2. Gör förbättringar samtidigt som struktur bevaras +3. Säkerställ att kodexempel fungerar 4. Testa lokaliserat quiz-innehåll -### Metadata för översättningar +### Översättningsmetadata -Översatta filer inkluderar metadata-header: +Översatta filer inkluderar metadataheader: ```markdown **Ansvarsfriskrivning**: -Detta dokument har översatts med hjälp av AI-översättningstjänsten [Co-op Translator](https://github.com/Azure/co-op-translator). Även om vi strävar efter noggrannhet, var vänlig notera att automatiska översättningar kan innehålla fel eller felaktigheter. Det ursprungliga dokumentet på dess modersmål bör betraktas som den auktoritativa källan. För kritisk information rekommenderas professionell mänsklig översättning. Vi ansvarar inte för några missförstånd eller feltolkningar som uppstår från användningen av denna översättning. +Det här dokumentet har översatts med hjälp av AI-översättningstjänsten [Co-op Translator](https://github.com/Azure/co-op-translator). Även om vi strävar efter noggrannhet, vänligen observera att automatiska översättningar kan innehålla fel eller inkonsekvenser. Det ursprungliga dokumentet på dess originalspråk bör betraktas som den auktoritativa källan. För kritisk information rekommenderas professionell mänsklig översättning. Vi ansvarar inte för några missförstånd eller feltolkningar som uppstår vid användning av denna översättning. \ No newline at end of file diff --git a/translations/sv/README.md b/translations/sv/README.md index c23086b79..b508c59d4 100644 --- a/translations/sv/README.md +++ b/translations/sv/README.md @@ -10,29 +10,29 @@ [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -# Webbplatsutveckling för nybörjare - En läroplan +# Webbuteckling för nybörjare - Ett läroplan -Lär dig grunderna i webbplatsutveckling med vår 12-veckors omfattande kurs av Microsoft Cloud Advocates. Varje av de 24 lektionerna går på djupet i JavaScript, CSS och HTML genom praktiska projekt som terrarier, webbläsartillägg och rymdspel. Engagera dig i quiz, diskussioner och praktiska uppgifter. Förbättra dina färdigheter och optimera din kunskapsbehållning med vår effektiva projektbaserade pedagogik. Starta din kodningsresa idag! +Lär dig grunderna i webbuteckling med vår 12-veckors omfattande kurs av Microsoft Cloud Advocates. Varje av de 24 lektionerna dyker ner i JavaScript, CSS och HTML genom praktiska projekt som terrarier, webbläsartillägg och rymdspel. Delta i quiz, diskussioner och praktiska uppgifter. Förbättra dina färdigheter och optimera din kunskapsbevaring med vår effektiva projektbaserade pedagogik. Börja din kodningsresa idag! -Gå med i Azure AI Foundry Discord Community +Gå med i Azure AI Foundry Discord och möt experter och andra utvecklare. [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) Följ dessa steg för att komma igång med att använda dessa resurser: -1. **Fork:a repot**: Klicka [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) -2. **Klona repot**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -3. [**Gå med i Azure AI Foundry Discord och träffa experter och andra utvecklare**](https://discord.com/invite/ByRwuEEgH4) +1. **Fork:a Repositoriet**: Klicka [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +2. **Klona Repositoriet**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +3. [**Gå med i Azure AI Foundry Discord och möt experter och andra utvecklare**](https://discord.com/invite/ByRwuEEgH4) ### 🌐 Flerspråkigt stöd -#### Stöds via GitHub Action (Automatiserat & Alltid Uppdaterat) +#### Stöds via GitHub Action (Automatiserat och alltid uppdaterat) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](./README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) > **Föredrar du att klona lokalt?** > -> Detta repo inkluderar 50+ språköversättningar vilket avsevärt ökar storleken på nedladdningen. För att klona utan översättningar, använd sparsamt incheckning: +> Detta repository inkluderar 50+ språköversättningar vilket avsevärt ökar nedladdningsstorleken. För att klona utan översättningar, använd sparsamt checkout: > > **Bash / macOS / Linux:** > ```bash @@ -51,83 +51,83 @@ Följ dessa steg för att komma igång med att använda dessa resurser: > Detta ger dig allt du behöver för att slutföra kursen med en mycket snabbare nedladdning. -**Om du önskar stöd för flera översättningsspråk finns listade [här](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** +**Om du önskar fler översättningar, finns de stödda språken listade [här](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) #### 🧑‍🎓 _Är du student?_ -Besök [**Student Hub-sidan**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) där du hittar nybörjarresurser, studentpaket och till och med sätt att få en gratis certifikatkupong. Detta är sidan du vill bokmärka och kolla av med jämna mellanrum eftersom vi byter ut innehåll varje månad. +Besök [**Student Hub-sidan**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) där du hittar nybörjarresurser, studentpaket och till och med sätt att få ett gratis certifikat-voucher. Detta är sidan du vill bokmärka och kolla av då och då eftersom vi byter innehåll varje månad. -### 📣 Tillkännagivande - Nya GitHub Copilot Agent-läges utmaningar att slutföra! +### 📣 Meddelande - Nya GitHub Copilot Agent-lägesutmaningar att slutföra! -Ny utmaning tillagd, leta efter "GitHub Copilot Agent Challenge 🚀" i de flesta kapitel. Det är en ny utmaning för dig att klara av med GitHub Copilot och Agent-läge. Om du inte har använt Agent-läget tidigare kan det inte bara generera text utan också skapa och redigera filer, köra kommandon med mera. +Ny utmaning tillagd, leta efter "GitHub Copilot Agent Challenge 🚀" i de flesta kapitel. Det är en ny utmaning för dig att slutföra med GitHub Copilot och Agent-läget. Om du inte har använt Agent-läget tidigare kan det inte bara generera text utan kan även skapa och redigera filer, köra kommandon och mer. -### 📣 Tillkännagivande - _Nytt projekt att bygga med Generativ AI_ +### 📣 Meddelande - _Nytt projekt att bygga med Generativ AI_ -Nytt AI Assistant-projekt precis tillagt, kolla in det [projekt](./9-chat-project/README.md) +Nytt AI-assistentprojekt precis tillagt, kolla in det [projektet](./9-chat-project/README.md) -### 📣 Tillkännagivande - _Ny läroplan_ för Generativ AI för JavaScript har just släppts +### 📣 Meddelande - _Ny läroplan_ om Generativ AI för JavaScript släpptes just -Missa inte vår nya läroplan för Generativ AI! +Missa inte vår nya Generativ AI-läroplan! Besök [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) för att komma igång! ![Background](../../translated_images/sv/background.148a8d43afde5730.webp) - Lektioner som täcker allt från grunder till RAG. -- Interagera med historiska karaktärer med GenAI och vår följeslagar-app. -- Roligt och engagerande berättande, du kommer att tidsresa! +- Interagera med historiska karaktärer med GenAI och vår följeslagarapp. +- Rolig och engagerande berättelse, du kommer tidsresa! ![character](../../translated_images/sv/character.5c0dd8e067ffd693.webp) -Varje lektion inkluderar en uppgift att slutföra, en kunskapskontroll och en utmaning för att guida dig i ämnen som: -- Prompting och prompt-engineering +Varje lektion inkluderar en uppgift att slutföra, en kunskapskontroll och en utmaning för att guida dig i att lära dig ämnen som: +- Prompting och promptengineering - Text- och bildappsgenerering -- Sökningsappar +- Sökappar Besök [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) för att komma igång! -## 🌱 Komma igång +## 🌱 Kom Igång -> **Lärare**, vi har [inkluderat några förslag](for-teachers.md) på hur man kan använda denna läroplan. Vi vill gärna ha din feedback [i vårt diskussionsforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! +> **Lärare**, vi har [inkluderat några förslag](for-teachers.md) på hur ni kan använda denna läroplan. Vi tar gärna emot er feedback [i vårt diskussionsforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! -**[Studenter](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, för varje lektion, börja med ett för-quiz och fortsätt sedan med att läsa lektionsmaterialet, slutföra olika aktiviteter och kontrollera din förståelse med efter-quizet. +**[Studerande](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, för varje lektion, börja med ett för-lektionsquiz och fortsätt sedan med att läsa föreläsningsmaterialet, slutföra de olika aktiviteterna och kontrollera din förståelse med ett efter-lektionsquiz. -För att förbättra din lärandeupplevelse, koppla ihop dig med dina kamrater för att arbeta på projekten tillsammans! Diskussioner uppmuntras i vårt [diskussionsforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) där vårt team av moderatorer kommer att finnas tillgängliga för att svara på dina frågor. +För att förbättra din inlärningsupplevelse, koppla samman med dina kamrater för att samarbeta med projekten! Diskussioner uppmuntras i vårt [diskussionsforum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) där vårt team av moderatorer finns tillgängliga för att svara på dina frågor. -För att fördjupa din utbildning rekommenderar vi starkt att du utforskar [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) för ytterligare studiematerial. +För att fördjupa din utbildning rekommenderar vi starkt att utforska [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) för ytterligare studiematerial. ### 📋 Sätta upp din miljö -Denna läroplan har en utvecklingsmiljö klar att använda! När du kommer igång kan du välja att köra läroplanen i en [Codespace](https://github.com/features/codespaces/) (_en webbläsarbaserad miljö utan krav på installation_), eller lokalt på din dator med en textredigerare som [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +Denna läroplan har en utvecklingsmiljö redo att användas! När du börjar kan du välja att köra läroplanen i en [Codespace](https://github.com/features/codespaces/) (_en webbläsarbaserad miljö utan installationer_), eller lokalt på din dator med en textredigerare som [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). -#### Skapa ditt arkiv -För att du enkelt ska kunna spara ditt arbete rekommenderas det att du skapar en egen kopia av detta arkiv. Det kan du göra genom att klicka på knappen **Use this template** högst upp på sidan. Detta skapar ett nytt arkiv på ditt GitHub-konto med en kopia av läroplanen. +#### Skapa ditt repository +För att du enkelt ska kunna spara ditt arbete rekommenderas det att du skapar en egen kopia av detta repository. Du kan göra det genom att klicka på knappen **Use this template** högst upp på sidan. Detta skapar ett nytt repository i ditt GitHub-konto med en kopia av läroplanen. Följ dessa steg: -1. **Fork:a arkivet**: Klicka på "Fork"-knappen i övre högra hörnet på denna sida. -2. **Klona arkivet**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +1. **Fork:a Repositoriet**: Klicka på knappen "Fork" längst upp till höger på sidan. +2. **Klona Repositoriet**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` #### Köra läroplanen i en Codespace -I din kopia av detta arkiv som du skapade, klicka på **Code**-knappen och välj **Open with Codespaces**. Detta kommer att skapa en ny Codespace för dig att arbeta i. +I din kopia av detta repository som du skapade, klicka på **Code**-knappen och välj **Open with Codespaces**. Detta skapar en ny Codespace för dig att arbeta i. ![Codespace](../../translated_images/sv/createcodespace.0238bbf4d7a8d955.webp) #### Köra läroplanen lokalt på din dator -För att köra denna läroplan lokalt på din dator behöver du en textredigerare, en webbläsare och ett kommandoradsverktyg. Vår första lektion, [Introduktion till programmeringsspråk och verktyg](../../1-getting-started-lessons/1-intro-to-programming-languages), kommer att guida dig genom olika alternativ för varje verktyg så att du kan välja det som passar dig bäst. +För att köra denna läroplan lokalt på din dator behöver du en textredigerare, en webbläsare och ett kommandoradsverktyg. Vår första lektion, [Introduktion till programmeringsspråk och verktyg för yrket](../../1-getting-started-lessons/1-intro-to-programming-languages), går igenom olika val för varje av dessa verktyg så att du kan välja vad som passar dig bäst. -Vår rekommendation är att använda [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) som din redigerare, som också har en inbyggd [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Du kan ladda ner Visual Studio Code [här](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +Vår rekommendation är att använda [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) som din redigerare, som även har en inbyggd [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Du kan ladda ner Visual Studio Code [här](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). 1. Klona ditt repository till din dator. Du kan göra detta genom att klicka på **Code**-knappen och kopiera URL:en: [CodeSpace](./images/createcodespace.png) - Öppna sedan [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) i [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) och kör följande kommando, ersätt `` med URL:en du precis kopierade: + Öppna sedan [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) i [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) och kör följande kommando, ersätt `` med URL:en du just kopierade: ```bash git clone @@ -135,7 +135,6 @@ Vår rekommendation är att använda [Visual Studio Code](https://code.visualstu 2. Öppna mappen i Visual Studio Code. Du kan göra detta genom att klicka på **File** > **Open Folder** och välja den mapp du just klonade. - > Rekommenderade Visual Studio Code-tillägg: > > * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - för att förhandsgranska HTML-sidor inom Visual Studio Code @@ -143,75 +142,74 @@ Vår rekommendation är att använda [Visual Studio Code](https://code.visualstu ## 📂 Varje lektion innehåller: -- valfri sketchnote +- valfri skissnote - valfri kompletterande video -- uppvärmningsquiz före lektionen +- för-lektions uppvärmningsquiz - skriftlig lektion -- steg-för-steg guider för projektbaserade lektioner om hur man bygger projektet +- för projektbaserade lektioner, steg-för-steg guiden om hur man bygger projektet - kunskapskontroller - en utmaning - kompletterande läsning - uppgift -- [quiz efter lektionen](https://ff-quizzes.netlify.app/web/) +- [post-lektionsquiz](https://ff-quizzes.netlify.app/web/) -> **En notis om quiz**: Alla quiz finns i Quiz-app mappen, totalt 48 quiz med tre frågor vardera. De finns tillgängliga [här](https://ff-quizzes.netlify.app/web/). Quiz-appen kan köras lokalt eller distribueras till Azure; följ instruktionerna i `quiz-app` mappen. +> **En notering om quiz:** Alla quiz finns i Quiz-app mappen, totalt 48 quiz med tre frågor vardera. De finns tillgängliga [här](https://ff-quizzes.netlify.app/web/), quiz-appen kan köras lokalt eller distribueras till Azure; följ instruktionerna i `quiz-app` mappen. ## 🗃️ Lektioner -| | Projektnamn | Undervisade Begrepp | Läromål | Länkad lektion | Författare | -| :-: | :------------------------------------------------------: | :----------------------------------------------------------------------: | -------------------------------------------------------------------------------------------------------------------------------- | :-----------------------------------------------------------------------------------------------------------------------------: | :-------------------------: | -| 01 | Komma igång | Introduktion till programmering och verktyg | Lära sig grunderna bakom de flesta programmeringsspråk och om programvara som hjälper professionella utvecklare i deras arbete | [Intro till programmeringsspråk och verktyg](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | Komma igång | Grunderna i GitHub, inklusive samarbete i team | Hur man använder GitHub i ditt projekt och samarbetar med andra på en kodbas | [Introduktion till GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | Komma igång | Tillgänglighet | Lära sig grunderna i webbtillgänglighet | [Grundläggande tillgänglighet](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS Grunder | JavaScript-datatyper | Grunderna för JavaScript datatyper | [Datatyper](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS Grunder | Funktioner och Metoder | Lära sig om funktioner och metoder för att hantera en applikations logik | [Funktioner och Metoder](./2-js-basics/2-functions-methods/README.md) | Jasmine och Christopher | -| 06 | JS Grunder | Beslutsfattande med JS | Lära sig skapa villkor i koden med beslutsfattandemetoder | [Beslutsfattande](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS Grunder | Arrayer och Loopar | Arbeta med data genom arrayer och loopar i JavaScript | [Arrayer och Loopar](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML i praktiken | Bygga HTML för att skapa ett online-terrarium, med fokus på layoutbygge | [Introduktion till HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS i praktiken | Bygga CSS för att styla online-terrarium, med fokus på grundläggande CSS och responsiv design | [Introduktion till CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript closures och DOM-manipulation | Bygga JavaScript för att göra terrariet funktionellt med drag/drop, med fokus på closures och DOM-manipulation | [JavaScript closures och DOM-manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [Typing Game](./4-typing-game/solution/README.md) | Bygga ett skrivspel | Lära sig använda tangentbords-händelser för att driva logiken i JavaScript-appen | [Händelsestyrd programmering](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [Grönt webbläsartillägg](./5-browser-extension/solution/README.md) | Arbeta med webbläsare | Lära sig hur webbläsare fungerar, deras historia och bygga de första elementen i en tillägg | [Om webbläsare](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [Grönt webbläsartillägg](./5-browser-extension/solution/README.md) | Bygga ett formulär, anropa API och lagra variabler i lokal lagring | Bygga JavaScript-elementen i ditt tillägg för att anropa ett API med variabler sparade i lokal lagring | [API:er, formulär och lokal lagring](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [Grönt webbläsartillägg](./5-browser-extension/solution/README.md) | Bakgrundsprocesser i webbläsaren, webbprestanda | Använd webbläsarens bakgrundsprocesser för att hantera tilläggets ikon; lära sig om webbprestanda och optimeringar | [Bakgrundsprocesser och prestanda](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [Rymdspel](./6-space-game/solution/README.md) | Mer avancerad spelutveckling med JavaScript | Lära sig om arv med både klasser och komposition och Pub/Sub-mönstret inför spelbyggande | [Introduktion till avancerad spelutveckling](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [Rymdspel](./6-space-game/solution/README.md) | Rita på canvas | Lära sig om Canvas API, som används för att rita element på en skärm | [Rita på canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [Rymdspel](./6-space-game/solution/README.md) | Flytta element runt på skärmen | Upptäck hur element kan få rörelse med hjälp av kartesiska koordinater och Canvas API | [Flytta element runt](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [Rymdspel](./6-space-game/solution/README.md) | Kollisiondetektion | Få element att kollidera och reagera på varandra med knapptryckningar och ge en cooldown-funktion för att säkerställa prestanda | [Kollisiondetektion](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [Rymdspel](./6-space-game/solution/README.md) | Hålla poäng | Utför matematiska beräkningar baserat på spelets status och prestation | [Hålla poäng](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [Rymdspel](./6-space-game/solution/README.md) | Avsluta och starta om spelet | Lära sig om att avsluta och starta om spelet, inklusive städning av resurser och återställning av variabler | [Avslutningsvillkor](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [Bankapp](./7-bank-project/solution/README.md) | HTML-mallar och rutthantering i en webbapp | Lära sig skapa stommen för en flersidig webbplats arkitektur med routing och HTML-mallar | [HTML-mallar och routing](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [Bankapp](./7-bank-project/solution/README.md) | Bygga inloggning och registreringsformulär | Lära sig bygga formulär och hantera valideringsrutiner | [Formulär](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [Bankapp](./7-bank-project/solution/README.md) | Metoder för att hämta och använda data | Hur data flödar in och ut ur appen, hur man hämtar, sparar och gör sig av med den | [Data](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [Bankapp](./7-bank-project/solution/README.md) | Begrepp för state-hantering | Lära sig hur appen behåller state och hur man hanterar detta programmässigt | [State-hantering](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Browser/VScode Code](../../8-code-editor) | Arbeta med VScode | Lära dig använda en kodeditor | [Använd VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [AI Assistants](./9-chat-project/README.md) | Arbeta med AI | Lära dig bygga din egen AI-assistent | [AI Assistant project](./9-chat-project/README.md) | Chris | +| | Projekt Namn | Begrepp som lärs ut | Lärandemål | Länkad Lektion | Författare | +| :-: | :------------------------------------------------------: | :----------------------------------------------------------------------: | --------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------: | :-------------------------: | +| 01 | Komma igång | Introduktion till programmering och verktyg | Lära sig de grundläggande principerna bakom de flesta programmeringsspråk och om mjukvara som hjälper professionella utvecklare i deras arbete | [Intro till programmeringsspråk och verktyg](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | Komma igång | Grundläggande GitHub, inklusive samarbete i team | Hur man använder GitHub i sitt projekt, hur man samarbetar med andra i en kodbas | [Intro till GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | Komma igång | Tillgänglighet | Lär dig grunderna i webbåtkomst | [Grundläggande tillgänglighet](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS Grundläggande | JavaScript datatyper | Grunderna i JavaScript-datatyper | [Datatyper](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS Grundläggande | Funktioner och metoder | Lär dig om funktioner och metoder för att hantera applikationens logik | [Funktioner och Metoder](./2-js-basics/2-functions-methods/README.md) | Jasmine och Christopher | +| 06 | JS Grundläggande | Beslutsfattande med JS | Lär dig att skapa villkor i din kod med hjälp av beslutsfattandemetoder | [Beslutsfattande](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS Grundläggande | Arrayer och loopar | Arbeta med data med hjälp av arrayer och loopar i JavaScript | [Arrayer och Loopar](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML i praktiken | Bygg HTML för att skapa ett online-terrarium med fokus på layout | [Introduktion till HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS i praktiken | Bygg CSS för att styla online-terrarium med fokus på grunderna i CSS inklusive responsiv sida | [Introduktion till CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closures, DOM-manipulation | Bygg JavaScript för att göra terrariet som ett drag/drop-gränssnitt, med fokus på closures och DOM-manipulation | [JavaScript Closures, DOM-manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [Skrivspel](./4-typing-game/solution/README.md) | Bygg ett skrivspel | Lär dig använda tangentbordevenemang för att styra logiken i din JavaScript-app | [Händelsestyrd programmering](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [Grön webbläsartillägg](./5-browser-extension/solution/README.md) | Arbeta med webbläsare | Lär dig hur webbläsare fungerar, deras historia och hur man skapar de första elementen i ett webbläsartillägg | [Om webbläsare](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [Grön webbläsartillägg](./5-browser-extension/solution/README.md) | Bygga ett formulär, anropa ett API och lagra variabler i lokal lagring | Bygg JavaScript-elementen i ditt webbläsartillägg för att anropa ett API med variabler lagrade i lokal lagring | [API:er, formulär och lokal lagring](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [Grön webbläsartillägg](./5-browser-extension/solution/README.md) | Bakgrundsprocesser i webbläsaren, webbprestanda | Använd webbläsarens bakgrundsprocesser för att hantera tilläggets ikon; lär dig om webbprestanda och optimeringar | [Bakgrundsuppgifter och prestanda](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [Rymdspel](./6-space-game/solution/README.md) | Mer avancerad spelutveckling med JavaScript | Lär dig om arv med både klasser och komposition och Pub/Sub-mönstret, som förberedelse för att bygga ett spel | [Introduktion till avancerad spelutveckling](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [Rymdspel](./6-space-game/solution/README.md) | Rita på canvas | Lär dig om Canvas API, som används för att rita element på skärmen | [Rita på Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [Rymdspel](./6-space-game/solution/README.md) | Flytta element runt på skärmen | Upptäck hur element kan få rörelse med kartesiska koordinater och Canvas API | [Flytta element](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [Rymdspel](./6-space-game/solution/README.md) | Kollisiondetektion | Få element att kollidera och reagera på varandra med tangenttryckningar och ge en cooldown-funktion för att säkra prestanda i spelet | [Kollisiondetektion](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [Rymdspel](./6-space-game/solution/README.md) | Poängräkning | Utför matematiska beräkningar baserade på spelets status och prestation | [Poängräkning](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [Rymdspel](./6-space-game/solution/README.md) | Avsluta och starta om spelet | Lär dig om att avsluta och starta om spelet, inklusive att städa upp resurser och återställa variabelvärden | [Avslutningsvillkor](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [Bankapp](./7-bank-project/solution/README.md) | HTML-mallar och rutter i en webbapp | Lär dig hur man skapar stommen för en flersidig webbplats arkitektur med routing och HTML-mallar | [HTML-mallar och rutter](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [Bankapp](./7-bank-project/solution/README.md) | Bygg inloggnings- och registreringsformulär | Lär dig om att bygga formulär och hantera valideringsrutiner | [Formulär](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [Bankapp](./7-bank-project/solution/README.md) | Metoder för att hämta och använda data | Hur data flödar in och ut ur din app, hur man hämtar, lagrar och kassera det | [Data](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [Bankapp](./7-bank-project/solution/README.md) | Begrepp om tillståndshantering | Lär dig hur din app behåller tillstånd och hur du hanterar det programmässigt | [Tillståndshantering](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [Browser/VScode Code](../../8-code-editor) | Arbeta med VScode | Lär dig hur man använder en kodredigerare | [Använd VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [AI Assistants](./9-chat-project/README.md) | Arbeta med AI | Lär dig bygga din egen AI-assistent | [AI Assistant projekt](./9-chat-project/README.md) | Chris | ## 🏫 Pedagogik -Vår läroplan är utformad med två viktiga pedagogiska principer i åtanke: +Vårt läroplan är utformat med två viktiga pedagogiska principer: * projektbaserat lärande * frekventa quiz -Programmet lär ut grunderna i JavaScript, HTML och CSS samt de senaste verktygen och teknikerna som dagens webbutvecklare använder. Studenter får möjlighet att utveckla praktisk erfarenhet genom att bygga ett skrivspel, ett virtuellt terrarium, ett miljövänligt webbläsartillägg, ett rymdinvasionsspel och en bankapp för företag. I slutet av serien kommer studenterna ha fått en solid förståelse för webbutveckling. - -> 🎓 Du kan ta de första lektionerna i denna läroplan som en [Lärandeväg](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) på Microsoft Learn! +Programmet lär ut grunderna i JavaScript, HTML och CSS, samt de senaste verktyg och tekniker som webb utvecklare använder idag. Studenter kommer att få möjlighet att utveckla praktisk erfarenhet genom att skapa ett skrivspel, virtuellt terrarium, miljövänligt webbläsartillägg, rymdinspirerat spel och en bankapp för företag. I slutet av serien kommer studenterna att ha fått en gedigen förståelse för webbutveckling. -Genom att säkerställa att innehållet är kopplat till projekt görs processen mer engagerande för studenter och retentionen av koncept förstärks. Vi har också skapat flera startlektioner i JavaScript-grunder för att introducera koncept, kombinerade med en video från "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" samling av videotutorials, varav flera författare bidrog till denna läroplan. +> 🎓 Du kan ta de första lektionerna i detta läroplan som en [Lärstig](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) på Microsoft Learn! -Dessutom sätter ett låginsats-quiz före en lektion studentens fokus på att lära sig ett ämne, medan ett andra quiz efter lektionen säkerställer ytterligare retention. Denna läroplan är designad för att vara flexibel och rolig och kan genomföras helt eller delvis. Projekten börjar små och blir alltmer komplexa under den 12-veckorscykeln. +Genom att säkerställa att innehållet är kopplat till projekt blir processen mer engagerande för elever och konceptbevarandet stärks. Vi har också skrivit flera introduktionslektioner i JavaScript-grunder för att introducera koncepten, ihop med en video från "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" samling av videotutorials, där några av författarna bidragit till detta läroplan. -Medan vi medvetet har undvikit att introducera JavaScript-ramverk för att koncentrera oss på grundläggande färdigheter som krävs som webbutvecklare innan ett ramverk tas i bruk, är ett bra nästa steg efter denna läroplan att lära sig om Node.js via en annan videosamling: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". +Dessutom sätter ett lågintensivt quiz före en klassning elevens intention att lära sig ett ämne, medan ett andra quiz efter klassen säkerställer ytterligare beständighet. Detta läroplan är designat för att vara flexibelt och roligt och kan tas i sin helhet eller delvis. Projekten börjar små och blir alltmer komplexa mot slutet av en 12-veckors cykel. -> Besök våra riktlinjer för [Uppförandekod](CODE_OF_CONDUCT.md) och [Bidragande](CONTRIBUTING.md). Vi välkomnar din konstruktiva feedback! +Vi har medvetet undvikit att introducera JavaScript-ramverk för att koncentrera oss på de grundläggande färdigheter som behövs som webb utvecklare innan man tar till sig ett ramverk, ett bra nästa steg efter att ha slutfört detta läroplan är att lära sig om Node.js via en annan samling videor: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". +> Besök våra riktlinjer för [Uppförandekod](CODE_OF_CONDUCT.md) och [Bidrag](CONTRIBUTING.md). Vi välkomnar din konstruktiva feedback! -## 🧭 Offlineåtkomst +## 🧭 Offline tillgång -Du kan köra denna dokumentation offline med hjälp av [Docsify](https://docsify.js.org/#/). Forka detta repo, [installera Docsify](https://docsify.js.org/#/quickstart) på din lokala maskin och skriv sedan `docsify serve` i roten av detta repo. Webbplatsen tjänstgörs på port 3000 på din localhost: `localhost:3000`. +Du kan köra denna dokumentation offline genom att använda [Docsify](https://docsify.js.org/#/). Fork'a detta repo, [installera Docsify](https://docsify.js.org/#/quickstart) på din lokala maskin, och kör sedan `docsify serve` i rotmappen i detta repo. Webbplatsen kommer att serveras på port 3000 på din localhost: `localhost:3000`. ## 📘 PDF -En PDF av alla lektioner finns [här](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). +En PDF med alla lektioner finns [här](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf). ## 🎒 Andra kurser @@ -241,7 +239,7 @@ Vårt team producerar andra kurser! Kolla in: --- -### Kärnundervisning +### Kärninlärning [![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) @@ -260,21 +258,21 @@ Vårt team producerar andra kurser! Kolla in: ## Få hjälp -Om du kör fast eller har några frågor om att bygga AI-appar. Gå med i diskussioner med andra elever och erfarna utvecklare om MCP. Det är en stödjande gemenskap där frågor välkomnas och kunskap delas fritt. +Om du kör fast eller har några frågor om att bygga AI-appar. Gå med andra elever och erfarna utvecklare i diskussioner om MCP. Det är en stöttande gemenskap där frågor är välkomna och kunskap delas fritt. [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -Om du har produktfeedback eller fel vid byggande, besök: +Om du har produktfeedback eller hittar fel under utvecklingen besök: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) ## Licens -Det här arkivet är licensierat under MIT-licensen. Se filen [LICENSE](../../LICENSE) för mer information. +Detta arkiv är licensierat under MIT-licensen. Se [LICENSE](../../LICENSE)-filen för mer information. --- -**Ansvarsfriskrivning**: -Detta dokument har översatts med hjälp av AI-översättningstjänsten [Co-op Translator](https://github.com/Azure/co-op-translator). Även om vi strävar efter noggrannhet, vänligen var medveten om att automatiska översättningar kan innehålla fel eller brister. Det ursprungliga dokumentet på dess modersmål bör betraktas som den auktoritativa källan. För kritisk information rekommenderas professionell mänsklig översättning. Vi ansvarar inte för några missförstånd eller feltolkningar som uppstår vid användning av denna översättning. +**Ansvarsfriskrivning**: +Detta dokument har översatts med hjälp av AI-översättningstjänsten [Co-op Translator](https://github.com/Azure/co-op-translator). Även om vi strävar efter noggrannhet, var vänlig notera att automatiska översättningar kan innehålla fel eller brister. Det ursprungliga dokumentet på dess modersmål bör betraktas som den auktoritativa källan. För kritisk information rekommenderas professionell mänsklig översättning. Vi ansvarar inte för några missförstånd eller feltolkningar som kan uppstå vid användning av denna översättning. \ No newline at end of file diff --git a/translations/sv/lesson-template/README.md b/translations/sv/lesson-template/README.md index 0abf26295..a7d8123a6 100644 --- a/translations/sv/lesson-template/README.md +++ b/translations/sv/lesson-template/README.md @@ -1,56 +1,79 @@ -# [Lektionens ämne] +# Lektion Ämne -![Bädda in en video här](../../../lesson-template/video-url) +## 🎥 Video -## [Quiz före föreläsningen](../../../lesson-template/quiz-url) +> Lägg till en inbäddad video eller lektionslänk här. -[Beskriv vad vi kommer att lära oss] +--- + +## Förföreläsningsquiz + +> Lägg till en quizlänk här när den är tillgänglig. + +--- + +Ge en kort översikt över vad studenterna kommer att lära sig i denna lektion. + +--- ### Introduktion -Beskriv vad som kommer att tas upp +Ge en kort introduktion som beskriver vad som kommer att täckas i denna lektion. > Anteckningar +--- + ### Förkunskaper -Vilka steg bör ha täckts innan denna lektion? +Lista de koncept eller ämnen som studenterna bör vara bekanta med innan de börjar denna lektion. + +--- ### Förberedelse -Förberedande steg för att starta denna lektion +Lista eventuella installationssteg eller verktyg som krävs innan lektionen påbörjas. --- -[Stega igenom innehållet i block] +### Innehåll + +Stega igenom lektionens innehåll i strukturerade avsnitt. + +--- -## [Ämne 1] +## Ämne 1 ### Uppgift: -Arbeta tillsammans för att successivt förbättra er kodbas och bygga projektet med delad kod: +Arbeta tillsammans för att successivt förbättra er kodbas för att bygga projektet med delad kod: ```html code blocks ``` -✅ Kunskapskontroll - använd detta tillfälle för att utmana elevernas kunskaper med öppna frågor +✅ Kunskapskontroll +Använd detta tillfälle för att sträcka studenternas kunskaper med öppna frågor. -## [Ämne 2] +## Ämne 2 +## Ämne 3 -## [Ämne 3] +🚀 Utmaning +Lägg till en samarbetsutmaning för studenter att förbättra projektet. -🚀 Utmaning: Lägg till en utmaning för eleverna att arbeta med tillsammans i klassen för att förbättra projektet +Valfritt: Lägg till en skärmdump av den färdiga lektionens användargränssnitt om lämpligt. -Valfritt: lägg till en skärmdump av den färdiga lektionens användargränssnitt om det är lämpligt +## Efterföreläsningsquiz -## [Quiz efter föreläsningen](../../../lesson-template/quiz-url) +Lägg till en quizlänk här efter att ha slutfört lektionen. -## Granskning & Självstudier +## Översikt & Självstudier -**Uppgift ska lämnas in [MM/YY]**: [Uppgiftsnamn](assignment.md) +**Uppgift Inlämningsdatum [MM/ÅÅ]**: [Uppgiftsnamn](assignment.md) --- + **Ansvarsfriskrivning**: -Detta dokument har översatts med hjälp av AI-översättningstjänsten [Co-op Translator](https://github.com/Azure/co-op-translator). Även om vi strävar efter noggrannhet, bör du vara medveten om att automatiserade översättningar kan innehålla fel eller felaktigheter. Det ursprungliga dokumentet på dess originalspråk bör betraktas som den auktoritativa källan. För kritisk information rekommenderas professionell mänsklig översättning. Vi ansvarar inte för eventuella missförstånd eller feltolkningar som uppstår vid användning av denna översättning. \ No newline at end of file +Detta dokument har översatts med hjälp av AI-översättningstjänsten [Co-op Translator](https://github.com/Azure/co-op-translator). Även om vi strävar efter noggrannhet, vänligen observera att automatiska översättningar kan innehålla fel eller brister. Det ursprungliga dokumentet på dess modersmål bör betraktas som den auktoritativa källan. För kritisk information rekommenderas professionell mänsklig översättning. Vi ansvarar inte för några missförstånd eller feltolkningar som uppstår från användningen av denna översättning. + \ No newline at end of file diff --git a/translations/th/.co-op-translator.json b/translations/th/.co-op-translator.json index 42d86427d..3d80b40b0 100644 --- a/translations/th/.co-op-translator.json +++ b/translations/th/.co-op-translator.json @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2026-04-20T16:30:58+00:00", + "translation_date": "2026-04-24T16:22:23+00:00", "source_file": "AGENTS.md", "language_code": "th" }, @@ -516,8 +516,8 @@ "language_code": "th" }, "README.md": { - "original_hash": "b885c87c7544109b78d6684daad6cba6", - "translation_date": "2026-04-06T18:33:28+00:00", + "original_hash": "b1766b45123e043ef2c72612f28b86dd", + "translation_date": "2026-04-24T16:15:58+00:00", "source_file": "README.md", "language_code": "th" }, @@ -564,8 +564,8 @@ "language_code": "th" }, "lesson-template/README.md": { - "original_hash": "0494be70ad7fadd13a8c3d549c23e355", - "translation_date": "2025-08-26T23:13:33+00:00", + "original_hash": "ce2f64fd0d518f0500fc082b97c1e662", + "translation_date": "2026-04-24T16:16:09+00:00", "source_file": "lesson-template/README.md", "language_code": "th" }, diff --git a/translations/th/AGENTS.md b/translations/th/AGENTS.md index c8f51673c..778bd1c2d 100644 --- a/translations/th/AGENTS.md +++ b/translations/th/AGENTS.md @@ -1,30 +1,30 @@ # AGENTS.md -## ภาพรวมของโครงการ +## ภาพรวมโครงการ -นี่คือที่เก็บหลักสูตรการศึกษาสำหรับการสอนพื้นฐานการพัฒนาเว็บสำหรับผู้เริ่มต้น หลักสูตรนี้เป็นหลักสูตรครบวงจร 12 สัปดาห์ที่พัฒนาโดย Microsoft Cloud Advocates ซึ่งประกอบด้วยบทเรียนลงมือทำทั้งหมด 24 บทเรียนที่ครอบคลุม JavaScript, CSS และ HTML +นี่คือแหล่งจัดเก็บหลักสูตรการศึกษาสำหรับสอนพื้นฐานการพัฒนาเว็บแก่ผู้เริ่มต้น หลักสูตรเป็นคอร์สเรียนครบวงจรความยาว 12 สัปดาห์ที่พัฒนาโดย Microsoft Cloud Advocates โดยมีบทเรียนลงมือปฏิบัติ 24 บทเรียนที่ครอบคลุม JavaScript, CSS และ HTML ### ส่วนประกอบหลัก -- **เนื้อหาการศึกษา**: บทเรียนที่มีโครงสร้าง 24 บทเรียน จัดเป็นโมดูลตามโครงการ -- **โครงการเชิงปฏิบัติ**: Terrarium, เกมพิมพ์ดีด, ส่วนขยายเบราว์เซอร์, เกมอวกาศ, แอปธนาคาร, ตัวแก้ไขโค้ด และผู้ช่วยแชท AI -- **แบบทดสอบเชิงโต้ตอบ**: แบบทดสอบ 48 ชุด โดยแต่ละชุดมี 3 คำถาม (สำหรับประเมินก่อนและหลังบทเรียน) -- **รองรับหลายภาษา**: การแปลอัตโนมัติสำหรับมากกว่า 50 ภาษา ผ่าน GitHub Actions -- **เทคโนโลยี**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (สำหรับโครงการ AI) +- **เนื้อหาการศึกษา**: บทเรียนที่จัดโครงสร้าง 24 บทเรียน แบ่งเป็นโมดูลแบบใช้โปรเจกต์ +- **โปรเจกต์ฝึกปฏิบัติ**: Terrarium, Typing Game, ส่วนขยายเบราว์เซอร์, เกมอวกาศ, แอปธนาคาร, ตัวแก้ไขโค้ด, และผู้ช่วยแชท AI +- **แบบทดสอบเชิงโต้ตอบ**: แบบทดสอบ 48 ชุด ชุดละ 3 คำถาม (ประเมินก่อนและหลังบทเรียน) +- **รองรับหลายภาษา**: แปลอัตโนมัติสำหรับกว่า 50 ภาษาโดยใช้ GitHub Actions +- **เทคโนโลยี**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (สำหรับโปรเจกต์ AI) ### สถาปัตยกรรม -- ที่เก็บการศึกษาที่มีโครงสร้างตามบทเรียน -- โฟลเดอร์แต่ละบทเรียนประกอบด้วย README, ตัวอย่างโค้ด และคำตอบ -- โครงการแยกต่างหากในไดเรกทอรีต่างหาก (quiz-app, โครงการบทเรียนต่างๆ) -- ระบบแปลโดยใช้ GitHub Actions (co-op-translator) +- โครงสร้างฐานข้อมูลการสอนที่จัดตามบทเรียน +- โฟลเดอร์บทเรียนแต่ละบทมี README, ตัวอย่างโค้ด และคำตอบ +- โปรเจกต์แยกต่างหากในไดเรกทอรีต่างหาก (quiz-app, โปรเจกต์บทเรียนต่างๆ) +- ระบบแปลภาษาด้วย GitHub Actions (co-op-translator) - เอกสารให้บริการผ่าน Docsify และมีในรูปแบบ PDF -## คำสั่งการตั้งค่า +## คำสั่งตั้งค่า -ที่เก็บนี้สำหรับการบริโภคเนื้อหาการศึกษาหลัก สำหรับการทำงานกับโครงการเฉพาะ: +แหล่งจัดเก็บนี้เน้นการบริโภคเนื้อหาการศึกษาเป็นหลัก สำหรับการทำงานกับโปรเจกต์เฉพาะ: -### การตั้งค่าที่เก็บหลัก +### การตั้งค่าแหล่งจัดเก็บหลัก ```bash git clone https://github.com/microsoft/Web-Dev-For-Beginners.git @@ -46,63 +46,63 @@ npm run lint # รัน ESLint ```bash cd 7-bank-project/api npm install -npm start # เริ่มต้นเซิร์ฟเวอร์ API +npm start # เริ่มเซิร์ฟเวอร์ API npm run lint # รัน ESLint npm run format # จัดรูปแบบด้วย Prettier ``` -### โครงการส่วนขยายเบราว์เซอร์ +### โปรเจกต์ส่วนขยายเบราว์เซอร์ ```bash cd 5-browser-extension/solution npm install -# ปฏิบัติตามคำแนะนำการโหลดส่วนขยายเฉพาะของเบราว์เซอร์ +# ปฏิบัติตามคำแนะนำการโหลดส่วนขยายเฉพาะเบราว์เซอร์ ``` -### โครงการเกมอวกาศ +### โปรเจกต์เกมอวกาศ ```bash cd 6-space-game/solution npm install -# เปิดไฟล์ index.html ในเบราว์เซอร์หรืใช้ Live Server +# เปิดไฟล์ index.html ในเบราว์เซอร์หรือใช้ Live Server ``` -### โครงการแชท (Backend Python) +### โปรเจกต์แชท (Backend Python) ```bash cd 9-chat-project/solution/backend/python pip install openai -# ตั้งค่าตัวแปรสภาพแวดล้อม GITHUB_TOKEN +# ตั้งค่าตัวแปรแวดล้อม GITHUB_TOKEN python api.py ``` ## ขั้นตอนการพัฒนา -### สำหรับผู้ร่วมสร้างเนื้อหา +### สำหรับผู้มีส่วนร่วมเนื้อหา -1. **Fork ที่เก็บนี้** ไปยังบัญชี GitHub ของคุณ -2. **โคลน fork ของคุณ** ลงในเครื่อง +1. **Fork แหล่งจัดเก็บ** ไปยังบัญชี GitHub ของคุณ +2. **โคลน Fork ของคุณ** ลงในเครื่อง 3. **สร้างสาขาใหม่** สำหรับการเปลี่ยนแปลงของคุณ -4. ทำการเปลี่ยนแปลงเนื้อหาบทเรียนหรือโค้ดตัวอย่าง -5. ทดสอบการเปลี่ยนแปลงโค้ดในไดเรกทอรีโครงการที่เกี่ยวข้อง -6. ส่ง pull request ตามแนวทางการร่วมมือ +4. แก้ไขเนื้อหาบทเรียนหรือตัวอย่างโค้ด +5. ทดสอบการเปลี่ยนแปลงโค้ดในไดเรกทอรีโปรเจกต์ที่เกี่ยวข้อง +6. ส่ง pull request ตามแนวทางการมีส่วนร่วม ### สำหรับผู้เรียน -1. Fork หรือโคลนที่เก็บนี้ -2. ไปยังไดเรกทอรีบทเรียนตามลำดับ +1. Fork หรือโคลนแหล่งจัดเก็บ +2. เข้าไปในไดเรกทอรีของบทเรียนทีละบท 3. อ่านไฟล์ README สำหรับแต่ละบทเรียน 4. ทำแบบทดสอบก่อนบทเรียนที่ https://ff-quizzes.netlify.app/web/ -5. ทำงานกับตัวอย่างโค้ดในโฟลเดอร์บทเรียน -6. ทำแบบฝึกหัดและความท้าทายให้เสร็จ +5. ฝึกทำตัวอย่างโค้ดในโฟลเดอร์บทเรียน +6. ทำงานที่ได้รับมอบหมายและความท้าทาย 7. ทำแบบทดสอบหลังบทเรียน ### การพัฒนาแบบสด -- **เอกสาร**: รัน `docsify serve` ที่รากโปรเจ็ค (พอร์ต 3000) +- **เอกสาร**: รัน `docsify serve` ในรูท (พอร์ต 3000) - **Quiz App**: รัน `npm run dev` ในไดเรกทอรี quiz-app -- **โครงการ**: ใช้ส่วนขยาย VS Code Live Server สำหรับโครงการ HTML -- **โครงการ API**: รัน `npm start` ในไดเรกทอรี API ตามลำดับ +- **โปรเจกต์**: ใช้ส่วนขยาย VS Code Live Server สำหรับโปรเจกต์ HTML +- **โปรเจกต์ API**: รัน `npm start` ในไดเรกทอรี API ที่เกี่ยวข้อง ## คำแนะนำการทดสอบ @@ -118,74 +118,74 @@ npm run build # ตรวจสอบการสร้างให้ส ```bash cd 7-bank-project/api -npm run lint # ตรวจสอบปัญหาสไตล์โค้ด -node server.js # ยืนยันว่าเซิร์ฟเวอร์เริ่มทำงานโดยไม่มีข้อผิดพลาด +npm run lint # ตรวจสอบปัญหาเกี่ยวกับสไตล์ของโค้ด +node server.js # ตรวจสอบว่าเซิร์ฟเวอร์เริ่มทำงานโดยไม่มีข้อผิดพลาด ``` ### แนวทางการทดสอบทั่วไป -- ที่เก็บนี้เป็นที่เก็บการศึกษาโดยไม่มีการทดสอบอัตโนมัติครบถ้วน +- นี่คือแหล่งจัดเก็บเพื่อการศึกษา ไม่มีการทดสอบอัตโนมัติอย่างครอบคลุม - การทดสอบด้วยตนเองเน้นที่: - - ตัวอย่างโค้ดทำงานได้โดยไม่มีข้อผิดพลาด - - ลิงก์ในเอกสารทำงานอย่างถูกต้อง - - การสร้างโครงการสำเร็จ - - ตัวอย่างทำตามแนวปฏิบัติที่ดีที่สุด + - ตัวอย่างโค้ดรันโดยไม่มีข้อผิดพลาด + - ลิงก์ในเอกสารทำงานถูกต้อง + - การสร้างโปรเจกต์สำเร็จ + - ตัวอย่างเป็นไปตามแนวทางปฏิบัติที่ดีที่สุด ### การตรวจสอบก่อนส่ง - รัน `npm run lint` ในไดเรกทอรีที่มี package.json -- ตรวจสอบลิงก์ markdown ว่าถูกต้อง +- ตรวจสอบลิงก์ Markdown ว่าใช้งานได้ - ทดสอบตัวอย่างโค้ดในเบราว์เซอร์หรือ Node.js -- ตรวจสอบว่าการแปลรักษาโครงสร้างที่ถูกต้อง +- ตรวจสอบว่าแปลภาษายังคงโครงสร้างถูกต้อง ## แนวทางสไตล์โค้ด ### JavaScript -- ใช้ไวยากรณ์ ES6+ สมัยใหม่ -- ปฏิบัติตามการตั้งค่า ESLint มาตรฐานในโครงการ +- ใช้ไวยากรณ์ ES6+ +- ปฏิบัติตามการตั้งค่า ESLint มาตรฐานในโปรเจกต์ - ใช้ชื่อตัวแปรและฟังก์ชันที่มีความหมายเพื่อความชัดเจนทางการศึกษา - เพิ่มคอมเมนต์อธิบายแนวคิดสำหรับผู้เรียน -- ฟอร์แมตโดยใช้ Prettier เมื่อมีการตั้งค่า +- จัดรูปแบบด้วย Prettier เมื่อมีการตั้งค่า ### HTML/CSS -- ใช้องค์ประกอบ HTML5 ตามความหมาย -- หลักการออกแบบตอบสนอง (Responsive) -- กฎการตั้งชื่อตัวแปรคลาสที่ชัดเจน +- ใช้องค์ประกอบ HTML5 แบบ Semantic +- หลักการออกแบบที่ตอบสนองได้ +- การตั้งชื่อคลาสอย่างชัดเจน - คอมเมนต์อธิบายเทคนิค CSS สำหรับผู้เรียน ### Python - ปฏิบัติตามแนวทางสไตล์ PEP 8 -- ตัวอย่างโค้ดที่ชัดเจนและเน้นการศึกษา -- ใช้ type hint เมื่อช่วยให้เรียนรู้ได้ดีขึ้น +- ตัวอย่างโค้ดที่ชัดเจนและเหมาะสำหรับการศึกษา +- ใช้คำบอกประเภทเมื่อช่วยให้เรียนรู้ได้ดีขึ้น ### เอกสาร Markdown -- ลำดับหัวข้อชัดเจน -- บล็อกโค้ดพร้อมระบุภาษา +- โครงสร้างหัวข้อที่ชัดเจน +- บล็อกโค้ดพร้อมกำหนดภาษาที่ถูกต้อง - ลิงก์ไปยังแหล่งข้อมูลเพิ่มเติม - ภาพหน้าจอและรูปภาพในโฟลเดอร์ `images/` -- ข้อความ alt ของภาพเพื่อการเข้าถึง +- ข้อความ alt สำหรับภาพเพื่อการเข้าถึง ### การจัดระเบียบไฟล์ -- บทเรียนเรียงหมายเลข (1-getting-started-lessons, 2-js-basics, เป็นต้น) -- โครงการแต่ละอันมีไดเรกทอรี `solution/` และมักมี `start/` หรือ `your-work/` -- รูปภาพเก็บในโฟลเดอร์ `images/` ที่เฉพาะเจาะจงกับบทเรียน -- การแปลอยู่ในโครงสร้าง `translations/{language-code}/` +- การตั้งชื่อบทเรียนตามลำดับเลข (1-getting-started-lessons, 2-js-basics, เป็นต้น) +- โปรเจกต์แต่ละโปรเจกต์มีโฟลเดอร์ `solution/` และมักจะมี `start/` หรือ `your-work/` +- รูปภาพเก็บในโฟลเดอร์ `images/` เฉพาะบทเรียน +- แปลภาษาอยู่ในโครงสร้าง `translations/{language-code}/` ## การสร้างและปรับใช้ ### การปรับใช้ Quiz App (Azure Static Web Apps) -quiz-app ถูกตั้งค่าสำหรับการปรับใช้กับ Azure Static Web Apps: +quiz-app ตั้งค่าเพื่อปรับใช้กับ Azure Static Web Apps: ```bash cd quiz-app npm run build # สร้างโฟลเดอร์ dist/ -# ดีพลอยผ่าน workflow ของ GitHub Actions เมื่อ push ไปที่ main +# ดีพลอยผ่านเวิร์กโฟลว์ GitHub Actions เมื่อ push ไปยัง main ``` การตั้งค่า Azure Static Web Apps: @@ -193,7 +193,7 @@ npm run build # สร้างโฟลเดอร์ dist/ - **ตำแหน่งผลลัพธ์**: `dist` - **เวิร์กโฟลว์**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` -### การสร้างไฟล์เอกสาร PDF +### การสร้างเอกสาร PDF ```bash npm install # ติดตั้ง docsify-to-pdf @@ -203,80 +203,80 @@ npm run convert # สร้าง PDF จาก docs ### เอกสาร Docsify ```bash -npm install -g docsify-cli # ติดตั้ง Docsify ทั่วระบบ -docsify serve # ให้บริการที่ localhost:3000 +npm install -g docsify-cli # ติดตั้ง Docsify ทั่วโลก +docsify serve # ให้บริการบน localhost:3000 ``` -### การสร้างเฉพาะโครงการ +### การสร้างเฉพาะโปรเจกต์ -แต่ละไดเรกทอรีโครงการอาจมีขั้นตอนการสร้างของตัวเอง: -- โครงการ Vue: `npm run build` สร้าง bundle สำหรับโปรดักชัน -- โครงการสแตติก: ไม่มีขั้นตอนการสร้าง ให้บริการไฟล์โดยตรง +แต่ละโฟลเดอร์โปรเจกต์อาจมีขั้นตอนการสร้างของตัวเอง: +- โปรเจกต์ Vue: รัน `npm run build` เพื่อสร้าง production bundle +- โปรเจกต์สแตติก: ไม่มีขั้นตอนการสร้าง รันไฟล์โดยตรง -## แนวทางในการส่ง Pull Request +## แนวทางการส่ง Pull Request -### รูปแบบชื่อเรื่อง +### รูปแบบหัวข้อ -ใช้ชื่อเรื่องที่ชัดเจนและบอกบริเวณการเปลี่ยนแปลง: +ใช้ชื่อหัวข้อชัดเจน ระบุบริเวณที่แก้ไข: - `[Quiz-app] เพิ่มแบบทดสอบใหม่สำหรับบทเรียน X` -- `[Lesson-3] แก้ไขคำผิดในโครงการ terrarium` -- `[Translation] เพิ่มการแปลภาษาสเปนสำหรับบทเรียน 5` -- `[Docs] ปรับปรุงคำแนะนำการตั้งค่า` +- `[Lesson-3] แก้ไขคำผิดในโปรเจกต์ terrarium` +- `[Translation] เพิ่มคำแปลภาษาสเปนสำหรับบทเรียน 5` +- `[Docs] อัปเดตคำแนะนำการตั้งค่า` -### การตรวจสอบที่จำเป็น +### การตรวจสอบที่ต้องทำ ก่อนส่ง PR: 1. **คุณภาพโค้ด**: - - รัน `npm run lint` ในไดเรกทอรีโครงการที่ได้รับผลกระทบ - - แก้ไขข้อผิดพลาดและคำเตือนทั้งหมด + - รัน `npm run lint` ในโฟลเดอร์โปรเจกต์ที่เกี่ยวข้อง + - แก้ไขข้อผิดพลาดและคำเตือนทั้งหมดเกี่ยวกับ lint 2. **ตรวจสอบการสร้าง**: - - รัน `npm run build` ถ้ามี - - ตรวจสอบว่าไม่มีข้อผิดพลาดจากการสร้าง + - รัน `npm run build` หากมี + - ตรวจสอบให้แน่ใจว่าไม่มีข้อผิดพลาดในการสร้าง 3. **ตรวจสอบลิงก์**: - - ทดสอบลิงก์ markdown ทั้งหมด - - ตรวจสอบการอ้างอิงภาพว่าใช้งานได้ + - ทดสอบทุกลิงก์ Markdown + - ตรวจสอบการอ้างอิงภาพว่าถูกต้อง 4. **ตรวจสอบเนื้อหา**: - - ตรวจทานคำสะกดและไวยากรณ์ - - ตรวจสอบตัวอย่างโค้ดว่าถูกต้องและเหมาะสมสำหรับการศึกษา - - ตรวจสอบว่าแปลถูกต้องและรักษาความหมายต้นฉบับ + - พิสูจน์อักษรสำหรับการสะกดและไวยากรณ์ + - ตรวจสอบให้แน่ใจว่าตัวอย่างโค้ดถูกต้องและเหมาะสำหรับการศึกษา + - ตรวจสอบการแปลว่าคงความหมายเดิม ### ข้อกำหนดการมีส่วนร่วม -- ยอมรับ Microsoft CLA (ตรวจสอบอัตโนมัติใน PR แรก) +- ตกลงทำตาม Microsoft CLA (ตรวจสอบอัตโนมัติเมื่อ PR แรก) - ปฏิบัติตาม [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) -- ดู [CONTRIBUTING.md](./CONTRIBUTING.md) สำหรับแนวทางรายละเอียด -- อ้างถึงหมายเลข issue ในคำอธิบาย PR หากเกี่ยวข้อง +- ดู [CONTRIBUTING.md](./CONTRIBUTING.md) สำหรับแนวทางโดยละเอียด +- อ้างอิงหมายเลขปัญหาในคำอธิบาย PR หากมี ### กระบวนการตรวจสอบ -- PR ถูกตรวจสอบโดยผู้ดูแลและชุมชน -- เน้นความชัดเจนทางการศึกษาเป็นสำคัญ -- ตัวอย่างโค้ดควรเป็นไปตามแนวปฏิบัติที่ดีที่สุดปัจจุบัน -- การแปลต้องได้รับการตรวจสอบว่าถูกต้องและเหมาะสมทางวัฒนธรรม +- PR จะได้รับการตรวจสอบโดยเจ้าหน้าที่และชุมชน +- เน้นความชัดเจนด้านการศึกษา +- ตัวอย่างโค้ดควรทำตามแนวทางปฏิบัติที่ดีที่สุดปัจจุบัน +- การแปลจะได้รับการตรวจสอบความถูกต้องและเหมาะสมทางวัฒนธรรม -## ระบบแปลภาษา +## ระบบการแปล ### การแปลอัตโนมัติ - ใช้ GitHub Actions กับเวิร์กโฟลว์ co-op-translator -- แปลอัตโนมัติเป็นกว่า 50 ภาษา -- ไฟล์ต้นทางในไดเรกทอรีหลัก -- ไฟล์แปลในโครงสร้าง `translations/{language-code}/` +- แปลเป็นกว่า 50 ภาษาโดยอัตโนมัติ +- ไฟล์ต้นฉบับอยู่ในไดเรกทอรีหลัก +- ไฟล์แปลอยู่ในโฟลเดอร์ `translations/{language-code}/` -### การเพิ่มคุณภาพการแปลด้วยตนเอง +### การเพิ่มการแปลด้วยตนเอง -1. ค้นหาไฟล์ใน `translations/{language-code}/` -2. ปรับปรุงโดยรักษาโครงสร้างเดิม -3. ตรวจสอบว่าตัวอย่างโค้ดยังทำงานได้ -4. ทดสอบเนื้อหาแบบทดสอบในท้องถิ่น +1. ค้นหาไฟล์ในโฟลเดอร์ `translations/{language-code}/` +2. ปรับปรุงในขณะที่รักษาโครงสร้างไว้ +3. ตรวจสอบให้ตัวอย่างโค้ดยังคงทำงานได้ +4. ทดสอบเนื้อหาแบบทดสอบที่แปลแล้ว -### เมตาดาต้าแปลภาษา +### ข้อมูลเมตาการแปล -ไฟล์แปลจะมีส่วนหัว metadata: +ไฟล์แปลมีส่วนหัว metadata: ```markdown ``` -## การดีบักและแก้ปัญหา +## การดีบักและแก้ไขปัญหา ### ปัญหาทั่วไป -**แอปแบบทดสอบไม่เริ่มทำงาน**: +**Quiz app ไม่เริ่มทำงาน**: - ตรวจสอบเวอร์ชัน Node.js (แนะนำ v14+) - ลบ `node_modules` และ `package-lock.json` แล้วรัน `npm install` ใหม่ -- ตรวจสอบพอร์ตว่าง (ค่าเริ่มต้น: Vite ใช้พอร์ต 5173) +- ตรวจสอบพอร์ตว่าชนกันหรือไม่ (เริ่มต้น Vite ใช้พอร์ต 5173) -**เซิร์ฟเวอร์ API ไม่เริ่มทำงาน**: -- ตรวจสอบเวอร์ชัน Node.js ให้เป็นไปตามขั้นต่ำ (node >=10) -- ตรวจสอบว่าพอร์ทยังว่างอยู่ -- ติดตั้ง dependencies ทั้งหมดด้วย `npm install` +**API เซิร์ฟเวอร์ไม่เริ่ม**: +- ยืนยันว่าเวอร์ชัน Node.js ตรงตามขั้นต่ำ (node >=10) +- ตรวจสอบว่าพอร์ตถูกใช้งานอยู่หรือไม่ +- ตรวจสอบว่าติดตั้ง dependencies ครบด้วย `npm install` **ส่วนขยายเบราว์เซอร์ไม่โหลด**: -- ตรวจสอบว่า manifest.json ถูกฟอร์แมตอย่างถูกต้อง -- ดูข้อผิดพลาดในคอนโซลเบราว์เซอร์ -- ปฏิบัติตามคำแนะนำการติดตั้งของเบราว์เซอร์แต่ละตัว +- ยืนยันว่า manifest.json ฟอร์แม็ตถูกต้อง +- ตรวจสอบคอนโซลเบราว์เซอร์หา error +- ปฏิบัติตามคำแนะนำการติดตั้งส่วนขยายเฉพาะเบราว์เซอร์ -**ปัญหาโครงการแชท Python**: -- ตรวจสอบว่าติดตั้งแพ็กเกจ OpenAI แล้ว: `pip install openai` -- ตรวจสอบว่าตัวแปรสภาพแวดล้อม GITHUB_TOKEN ถูกตั้งค่าแล้ว -- ตรวจสอบสิทธิ์การเข้าถึงโมเดล GitHub +**ปัญหาโปรเจกต์แชท Python**: +- ตรวจสอบว่าแพ็กเกจ OpenAI ถูกติดตั้ง: `pip install openai` +- ยืนยันตัวแปรสภาพแวดล้อม GITHUB_TOKEN ถูกตั้งค่า +- ตรวจสอบการเข้าถึง GitHub Models **Docsify ไม่ให้บริการเอกสาร**: -- ติดตั้ง docsify-cli ทั่วไป: `npm install -g docsify-cli` -- รันจากไดเรกทอรีรากของที่เก็บนี้ +- ติดตั้ง docsify-cli ทั่วโลก: `npm install -g docsify-cli` +- รันจากโฟลเดอร์รูทของแหล่งจัดเก็บ - ตรวจสอบว่าไฟล์ `docs/_sidebar.md` มีอยู่ ### เคล็ดลับสภาพแวดล้อมการพัฒนา -- ใช้ VS Code กับส่วนขยาย Live Server สำหรับโครงการ HTML -- ติดตั้งส่วนขยาย ESLint และ Prettier สำหรับการฟอร์แมตที่สอดคล้อง -- ใช้ DevTools ของเบราว์เซอร์สำหรับดีบัก JavaScript -- สำหรับโปรเจ็กต์ Vue ให้ติดตั้งส่วนขยาย Vue DevTools บนเบราว์เซอร์ +- ใช้ VS Code พร้อมส่วนขยาย Live Server สำหรับโปรเจกต์ HTML +- ติดตั้งส่วนขยาย ESLint และ Prettier เพื่อให้รูปแบบสอดคล้อง +- ใช้ DevTools ของเบราว์เซอร์ในการดีบัก JavaScript +- สำหรับโปรเจกต์ Vue ให้ติดตั้ง Vue DevTools ส่วนขยายเบราว์เซอร์ -### การพิจารณาด้านประสิทธิภาพ +### พิจารณาด้านประสิทธิภาพ -- จำนวนไฟล์แปลมาก (50+ ภาษา) ทำให้การโคลนครบถ้วนมีขนาดใหญ่ -- ใช้ shallow clone หากทำงานแค่เนื้อหา: `git clone --depth 1` -- งดการค้นหาในโฟลเดอร์แปลภาษาเมื่อทำงานกับเนื้อหาอังกฤษ -- ขั้นตอนการสร้างอาจช้าในครั้งแรก (npm install, สร้าง Vite) +- ไฟล์แปลจำนวนมาก (50+ ภาษา) ทำให้การโคลนนิ่งเต็มรูปแบบมีขนาดใหญ่ +- ใช้ shallow clone ถ้าทำงานกับเนื้อหาเท่านั้น: `git clone --depth 1` +- ยกเว้นการค้นหาในโฟลเดอร์แปลเมื่อทำงานกับภาษาอังกฤษ +- ขั้นตอนสร้างอาจช้าครั้งแรก (npm install, การสร้าง Vite) -## การพิจารณาด้านความปลอดภัย +## พิจารณาด้านความปลอดภัย ### ตัวแปรสภาพแวดล้อม -- ห้ามคีย์ API ถูกคอมมิตในที่เก็บ -- ใช้ไฟล์ `.env` (มีใน `.gitignore` แล้ว) -- อธิบายตัวแปรสภาพแวดล้อมที่ต้องใช้ใน README ของแต่ละโครงการ +- ห้ามใส่คีย์ API ลงในแหล่งจัดเก็บโดยตรง +- ใช้ไฟล์ `.env` (มีอยู่ใน `.gitignore` แล้ว) +- อธิบายตัวแปรสภาพแวดล้อมที่ต้องใช้ใน README ของแต่ละโปรเจกต์ -### โครงการ Python +### โปรเจกต์ Python -- ใช้สภาพแวดล้อมเสมือน: `python -m venv venv` +- ใช้ virtual environment: `python -m venv venv` - อัปเดต dependencies อย่างสม่ำเสมอ -- โทเค็น GitHub ควรมีสิทธิ์ขั้นต่ำที่จำเป็น +- GitHub token ควรมีสิทธิ์ขั้นต่ำที่จำเป็น -### การเข้าถึงโมเดล GitHub +### การเข้าถึง GitHub Models -- ต้องใช้ Personal Access Tokens (PAT) สำหรับโมเดล GitHub -- โทเค็นควรเก็บเป็นตัวแปรสภาพแวดล้อม -- ห้ามคอมมิตโทเค็นหรือข้อมูลประจำตัว +- ต้องใช้ Personal Access Tokens (PAT) +- เก็บ token เป็นตัวแปรสภาพแวดล้อม +- ห้าม commit token หรือข้อมูลรับรองลงในแหล่งจัดเก็บ -## หมายเหตุเพิ่มเติม +## บันทึกเพิ่มเติม ### กลุ่มเป้าหมาย -- ผู้เริ่มต้นเรียนรู้การพัฒนาเว็บอย่างสมบูรณ์ +- ผู้เริ่มต้นเรียนรู้พัฒนาเว็บอย่างสมบูรณ์ - นักเรียนและผู้เรียนด้วยตนเอง -- ครูผู้ใช้หลักสูตรในห้องเรียน -- เนื้อหาออกแบบเพื่อการเข้าถึงและสร้างทักษะทีละขั้น +- ครูผู้ใช้หลักสูตรในชั้นเรียน +- ออกแบบเนื้อหาให้เข้าถึงได้และค่อยๆ สร้างทักษะ ### ปรัชญาการศึกษา -- วิธีการเรียนรู้แบบโครงการ -- มีการทดสอบความรู้บ่อยครั้ง (แบบทดสอบ) -- แบบฝึกหัดโค้ดแบบลงมือทำ +- แนวทางการเรียนรู้โดยใช้โปรเจกต์ +- การตรวจสอบความเข้าใจบ่อยครั้ง (แบบทดสอบ) +- แบบฝึกหัดเขียนโค้ดลงมือทำ - ตัวอย่างการใช้งานจริง -- เน้นพื้นฐานก่อนใช้เฟรมเวิร์ก +- ให้ความสำคัญพื้นฐานก่อนเริ่มใช้เฟรมเวิร์ก -### การดูแลรักษาที่เก็บ +### การดูแลรักษาแหล่งเก็บ -- ชุมชนผู้เรียนและผู้ร่วมมือที่แอคทีฟ +- ชุมชนผู้เรียนและผู้มีส่วนร่วมที่แอคทีฟ - อัปเดต dependencies และเนื้อหาอย่างสม่ำเสมอ -- มีผู้ดูแลคอยติดตามปัญหาและการสนทนา -- การอัปเดตการแปลอัตโนมัติผ่าน GitHub Actions +- ผู้ดูแลติดตามปัญหาและการสนทนา +- การอัปเดตการแปลภาษาส่งผ่าน GitHub Actions อัตโนมัติ -### ทรัพยากรที่เกี่ยวข้อง +### แหล่งข้อมูลที่เกี่ยวข้อง - [โมดูล Microsoft Learn](https://docs.microsoft.com/learn/) -- [ทรัพยากร Student Hub](https://docs.microsoft.com/learn/student-hub/) -- แนะนำ [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) สำหรับผู้เรียน -- หลักสูตรเพิ่มเติม: AI สร้างสรรค์, วิทยาศาสตร์ข้อมูล, ML, หลักสูตร IoT +- [แหล่งข้อมูล Student Hub](https://docs.microsoft.com/learn/student-hub/) +- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) แนะนำสำหรับผู้เรียน +- คอร์สเพิ่มเติม: Generative AI, Data Science, ML, IoT มีให้เลือกเรียน -### การทำงานกับโครงการเฉพาะ +### การทำงานกับโปรเจกต์เฉพาะ -สำหรับคำแนะนำเฉพาะเจาะจงของแต่ละโครงการ ดูไฟล์ README ใน: -- `quiz-app/README.md` - แอปแบบทดสอบด้วย Vue 3 +สำหรับคำแนะนำรายละเอียดของโปรเจกต์ต่างๆ ดูไฟล์ README ใน: +- `quiz-app/README.md` - แอปแบบทดสอบ Vue 3 - `7-bank-project/README.md` - แอปธนาคารพร้อมระบบยืนยันตัวตน - `5-browser-extension/README.md` - การพัฒนาส่วนขยายเบราว์เซอร์ - `6-space-game/README.md` - การพัฒนาเกมด้วย Canvas -- `9-chat-project/README.md` - โครงการผู้ช่วยแชท AI +- `9-chat-project/README.md` - โปรเจกต์ผู้ช่วยแชท AI ### โครงสร้าง Monorepo -แม้จะไม่ใช่ monorepo แบบดั้งเดิม แต่ที่เก็บนี้ประกอบด้วยโครงการอิสระหลายชุด: -- แต่ละบทเรียนเป็นอิสระ -- โครงการไม่แชร์ dependencies ร่วมกัน -- ทำงานกับโครงการแต่ละอันโดยไม่กระทบโครงการอื่น -- โคลนที่เก็บทั้งหมดเพื่อประสบการณ์หลักสูตรเต็มรูปแบบ +แม้ไม่ใช่ monorepo แบบดั้งเดิม แต่แหล่งเก็บนี้ประกอบด้วยโปรเจกต์อิสระหลายโปรเจกต์: +- บทเรียนแต่ละบทเป็นอิสระ +- โปรเจกต์ไม่แชร์ dependencies กัน +- ทำงานกับโปรเจกต์แต่ละตัวโดยไม่กระทบกัน +- โคลนแหล่งเก็บทั้งหมดเพื่อรับประสบการณ์หลักสูตรครบถ้วน --- -**ข้อจำกัดความรับผิดชอบ**: -เอกสารนี้ได้รับการแปลโดยใช้บริการแปลภาษา AI [Co-op Translator](https://github.com/Azure/co-op-translator) แม้เราจะพยายามให้ความถูกต้องสูงสุด โปรดทราบว่าการแปลโดยอัตโนมัติอาจมีข้อผิดพลาดหรือความไม่ถูกต้อง เอกสารต้นฉบับในภาษาต้นทางควรถูกพิจารณาเป็นแหล่งข้อมูลที่เชื่อถือได้ สำหรับข้อมูลสำคัญ แนะนำให้ใช้การแปลโดยมนุษย์ผู้เชี่ยวชาญ เราจะไม่รับผิดชอบต่อความเข้าใจผิดหรือการตีความผิดใด ๆ ที่เกิดจากการใช้การแปลนี้ +**ข้อแจ้งให้ทราบ**: +เอกสารนี้ถูกแปลโดยใช้บริการแปลภาษา AI [Co-op Translator](https://github.com/Azure/co-op-translator) แม้ว่าเราจะพยายามแปลอย่างถูกต้อง แต่โปรดทราบว่าการแปลโดยอัตโนมัติอาจมีข้อผิดพลาดหรือความไม่ถูกต้อง เอกสารต้นฉบับในภาษาต้นทางควรถูกพิจารณาเป็นแหล่งข้อมูลที่เชื่อถือได้ สำหรับข้อมูลที่สำคัญ แนะนำให้ใช้บริการแปลโดยมืออาชีพ เราจะไม่รับผิดชอบต่อความเข้าใจผิดหรือการตีความผิดใด ๆ ที่เกิดขึ้นจากการใช้การแปลนี้ \ No newline at end of file diff --git a/translations/th/README.md b/translations/th/README.md index c5da301d9..d42799519 100644 --- a/translations/th/README.md +++ b/translations/th/README.md @@ -12,27 +12,27 @@ # การพัฒนาเว็บสำหรับผู้เริ่มต้น - หลักสูตร -เรียนรู้พื้นฐานการพัฒนาเว็บด้วยหลักสูตรครอบคลุม 12 สัปดาห์ของเราโดยกลุ่ม Microsoft Cloud Advocates แต่ละบทเรียน 24 บท ลงลึกใน JavaScript, CSS และ HTML ผ่านโครงการปฏิบัติ เช่น เทอราเรียม ส่วนขยายเบราว์เซอร์ และเกมอวกาศ มีส่วนร่วมกับแบบทดสอบ การสนทนา และงานจริง พัฒนาทักษะของคุณและเพิ่มประสิทธิภาพการเก็บความรู้ด้วยหลักสูตรที่เน้นการเรียนรู้ผ่านโครงการ เริ่มต้นการเขียนโค้ดของคุณวันนี้! +เรียนรู้พื้นฐานของการพัฒนาเว็บด้วยหลักสูตรครบวงจร 12 สัปดาห์โดย Microsoft Cloud Advocates แต่ละบทเรียนจากทั้งหมด 24 บทจะเจาะลึก JavaScript, CSS, และ HTML ผ่านโครงการที่ทำจริง เช่น เทอราเรียม, ส่วนขยายเบราว์เซอร์ และเกมอวกาศ เข้าร่วมกับแบบทดสอบ, การอภิปราย และงานปฏิบัติ เพื่อเพิ่มทักษะของคุณและเพิ่มประสิทธิภาพการจดจำความรู้ด้วยวิธีการสอนที่เน้นโครงการ เริ่มต้นเส้นทางการเขียนโค้ดของคุณวันนี้! -เข้าร่วมชุมชน Azure AI Foundry Discord +เข้าร่วม Discord ของ Azure AI Foundry เพื่อพบปะผู้เชี่ยวชาญและนักพัฒนาร่วมกัน [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -ปฏิบัติตามขั้นตอนเหล่านี้เพื่อเริ่มใช้ทรัพยากรเหล่านี้: -1. **โฟร์กที่เก็บข้อมูล**: คลิก [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +ทำตามขั้นตอนเหล่านี้เพื่อเริ่มต้นใช้ทรัพยากรเหล่านี้: +1. **Fork ที่เก็บข้อมูล**: คลิก [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) 2. **โคลนที่เก็บข้อมูล**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -3. [**เข้าร่วม Azure AI Foundry Discord พบปะผู้เชี่ยวชาญและนักพัฒนาอื่นๆ**](https://discord.com/invite/ByRwuEEgH4) +3. [**เข้าร่วม The Azure AI Foundry Discord เพื่อพบผู้เชี่ยวชาญและนักพัฒนาร่วมกัน**](https://discord.com/invite/ByRwuEEgH4) ### 🌐 รองรับหลายภาษา -#### รองรับผ่าน GitHub Action (อัตโนมัติ & อัปเดตเสมอ) +#### รองรับผ่าน GitHub Action (อัตโนมัติ & อัพเดทตลอดเวลา) [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Khmer](../km/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](./README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) -> **ต้องการโคลนในเครื่องไหม?** +> **ต้องการโคลนแบบโลคอล?** > -> ที่เก็บนี้รวมคำแปลมากกว่า 50 ภาษา ซึ่งเพิ่มขนาดการดาวน์โหลดอย่างมาก หากต้องการโคลนโดยไม่รวมคำแปล ใช้การสั่ง checkout แบบ sparse: +> ที่เก็บข้อมูลนี้มีการแปลมากกว่า 50 ภาษา ซึ่งจะเพิ่มขนาดดาวน์โหลดอย่างมาก หากต้องการโคลนโดยไม่มีการแปล ให้ใช้ sparse checkout: > > **Bash / macOS / Linux:** > ```bash @@ -48,42 +48,42 @@ > git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" > ``` > -> สิ่งนี้จะให้ทุกอย่างที่คุณต้องการเพื่อทำหลักสูตรจบด้วยการดาวน์โหลดที่เร็วขึ้นมาก +> วิธีนี้จะให้ทุกอย่างที่คุณต้องการเพื่อสำเร็จหลักสูตรด้วยการดาวน์โหลดที่เร็วขึ้นมาก -**หากคุณต้องการให้มีการสนับสนุนภาษาเพิ่มเติม รายชื่ออยู่ที่ [นี่](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** +**หากคุณต้องการมีการแปลเพิ่มเติม ภาษาที่รองรับจะแสดงอยู่ที่นี่ [here](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) -#### 🧑‍🎓 _คุณเป็นนักเรียนไหม?_ +#### 🧑‍🎓 _คุณเป็นนักเรียนหรือไม่?_ -เยี่ยมชม [**หน้าศูนย์นักเรียน**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) ซึ่งคุณจะพบกับทรัพยากรสำหรับผู้เริ่มต้น, ชุดนักเรียน และแม้กระทั่งวิธีการรับคูปองใบรับรองฟรี นี่คือหน้าที่คุณควรบันทึกไว้และตรวจสอบเป็นระยะๆ เนื่องจากเราจะเปลี่ยนเนื้อหาเป็นรายเดือน +เยี่ยมชม [**หน้า Student Hub**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) ซึ่งคุณจะพบแหล่งข้อมูลสำหรับผู้เริ่มต้น, ชุดสำหรับนักเรียน และวิธีรับบัตรกำนัลใบรับรองฟรี นี่คือหน้าที่คุณควรบุ๊กมาร์กและตรวจสอบเป็นระยะ ๆ เนื่องจากเรามีการสลับเนื้อหาเป็นเดือน ๆ -### 📣 ประกาศ - มีความท้าทายใหม่โหมด GitHub Copilot Agent ให้ทำให้สำเร็จ! +### 📣 ประกาศ - โหมดท้าทาย GitHub Copilot Agent ใหม่ให้ได้ทำ! -เพิ่มความท้าทายใหม่ ค้นหาคำว่า "GitHub Copilot Agent Challenge 🚀" ในบทต่างๆ เป็นความท้าทายใหม่สำหรับคุณในการทำให้เสร็จโดยใช้ GitHub Copilot และโหมด Agent หากคุณไม่เคยใช้โหมด Agent มาก่อน มันสามารถไม่เพียงแค่สร้างข้อความแต่ยังสามารถสร้างและแก้ไขไฟล์, รันคำสั่ง และอื่นๆ ได้ +ท้าทายใหม่เพิ่มเข้ามา ดูคำว่า "GitHub Copilot Agent Challenge 🚀" ได้ในหลายบทเรียน นี่คือท้าทายใหม่สำหรับคุณที่จะทำโดยใช้ GitHub Copilot และโหมด Agent หากคุณไม่เคยใช้โหมด Agent มาก่อน โหมดนี้ไม่เพียงแต่สร้างข้อความได้ แต่ยังสามารถสร้างและแก้ไขไฟล์, รันคำสั่ง และอื่น ๆ ได้อีกด้วย ### 📣 ประกาศ - _โครงการใหม่ที่จะสร้างโดยใช้ Generative AI_ -เพิ่มโครงการผู้ช่วย AI ใหม่ล่าสุด ตรวจสอบโครงการได้ที่ [project](./9-chat-project/README.md) +โครงการผู้ช่วย AI ใหม่เพิ่งเพิ่มเข้ามา ดูได้ที่ [project](./9-chat-project/README.md) -### 📣 ประกาศ - _หลักสูตรใหม่_ สำหรับ Generative AI ใน JavaScript เพิ่งเปิดตัว +### 📣 ประกาศ - _หลักสูตรใหม่_ เกี่ยวกับ Generative AI สำหรับ JavaScript เปิดตัวแล้ว -อย่าพลาดหลักสูตร Generative AI ใหม่ของเรา! +อย่าพลาดหลักสูตรใหม่ของเราเกี่ยวกับ Generative AI! เยี่ยมชม [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) เพื่อเริ่มต้น! ![Background](../../translated_images/th/background.148a8d43afde5730.webp) -- บทเรียนครอบคลุมตั้งแต่พื้นฐานถึง RAG -- โต้ตอบกับตัวละครในประวัติศาสตร์ด้วย GenAI และแอป companion ของเรา -- เรื่องราวที่สนุกสนานและมีส่วนร่วม คุณจะได้เดินทางย้อนเวลา! +- บทเรียนครอบคลุมตั้งแต่พื้นฐานจนถึง RAG +- โต้ตอบกับตัวละครประวัติศาสตร์โดยใช้ GenAI และแอปคู่มือของเรา +- เล่าเรื่องสนุกและน่าติดตาม คุณจะได้เดินทางข้ามเวลา! ![character](../../translated_images/th/character.5c0dd8e067ffd693.webp) -แต่ละบทเรียนประกอบด้วยการบ้านให้ทำ แบบทดสอบความรู้ และความท้าทายเพื่อแนะนำคุณในหัวข้อต่างๆ เช่น: -- การเขียน prompt และวิศวกรรม prompt +แต่ละบทเรียนมีการมอบหมายให้ทำ, ตรวจสอบความรู้ และมีท้าทายเพื่อแนะนำคุณในการเรียนรู้หัวข้อต่าง ๆ เช่น: +- การตั้งค่า prompt และการออกแบบ prompt - การสร้างแอปข้อความและภาพ - แอปค้นหา @@ -91,131 +91,132 @@ -## 🌱 เริ่มต้นใช้งาน +## 🌱 เริ่มต้น -> **ครูผู้สอน** เราได้ [รวมคำแนะนำบางส่วน](for-teachers.md) เกี่ยวกับวิธีการใช้หลักสูตรนี้ เราขอรับฟังความคิดเห็นของคุณ [ในฟอรัมสนทนา](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! +> **ครูผู้สอน**, เราได้ [เพิ่มข้อเสนอแนะบางอย่าง](for-teachers.md) เกี่ยวกับวิธีการใช้หลักสูตรนี้ เราต้องการฟังความคิดเห็นของคุณ [ในฟอรัมอภิปรายของเรา](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! -**[ผู้เรียน](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)** สำหรับแต่ละบท เริ่มต้นด้วยแบบทดสอบก่อนบรรยายแล้วอ่านเนื้อหาบรรยาย ทำกิจกรรมต่างๆ แล้วตรวจสอบความเข้าใจของคุณด้วยแบบทดสอบหลังบรรยาย +**[ผู้เรียน](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)** สำหรับแต่ละบท เริ่มด้วยแบบทดสอบก่อนบรรยายและอ่านเนื้อหาบรรยาย พร้อมทำกิจกรรมต่าง ๆ และตรวจสอบความเข้าใจด้วยแบบทดสอบหลังบรรยาย -เพื่อเพิ่มประสบการณ์การเรียนรู้ของคุณ ให้เชื่อมต่อกับเพื่อนร่วมชั้นเพื่อทำโครงการร่วมกัน! เราสนับสนุนการสนทนาใน [ฟอรัมสนทนา](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) ซึ่งทีมผู้ดูแลของเราจะพร้อมตอบคำถามคุณ +เพื่อเพิ่มประสบการณ์การเรียนรู้ของคุณ เชื่อมต่อกับเพื่อนของคุณเพื่อทำโปรเจกต์ด้วยกัน! สนับสนุนให้มีการอภิปรายใน [ฟอรัมอภิปราย](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) ซึ่งทีมผู้ดูแลของเราจะพร้อมตอบคำถามของคุณ -เพื่อการศึกษาต่อเพิ่มเติม เราขอแนะนำให้สำรวจ [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) สำหรับวัสดุเรียนรู้เพิ่มเติม +เพื่อการศึกษาต่อ เราขอแนะนำอย่างยิ่งให้สำรวจ [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) สำหรับวัสดุการศึกษาที่เพิ่มเติม -### 📋 การติดตั้งสภาพแวดล้อมการพัฒนา +### 📋 การตั้งค่าสภาพแวดล้อมของคุณ -หลักสูตรนี้เตรียมสภาพแวดล้อมสำหรับการพัฒนาไว้ให้แล้ว! ขณะเริ่มต้น คุณสามารถเลือกที่จะรันหลักสูตรใน [Codespace](https://github.com/features/codespaces/) (_สภาพแวดล้อมผ่านเบราว์เซอร์ ไม่ต้องติดตั้ง_) หรือรันในเครื่องของคุณด้วยโปรแกรมแก้ไขข้อความ เช่น [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) +หลักสูตรนี้มีสภาพแวดล้อมสำหรับการพัฒนาให้พร้อมใช้งาน! เมื่อต้องการเริ่มต้น คุณสามารถเลือกที่จะรันหลักสูตรใน [Codespace](https://github.com/features/codespaces/) (_สภาพแวดล้อมที่ใช้งานผ่านเบราว์เซอร์โดยไม่ต้องติดตั้งอะไร_) หรือรันแบบโลคอลบนคอมพิวเตอร์ของคุณโดยใช้โปรแกรมแก้ไขข้อความเช่น [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) #### สร้างที่เก็บข้อมูลของคุณ -เพื่อความสะดวกในการบันทึกงานของคุณ แนะนำให้สร้างสำเนาของที่เก็บนี้ คุณสามารถทำได้โดยคลิกปุ่ม **Use this template** ที่ด้านบนของหน้า ซึ่งจะสร้างที่เก็บใหม่ในบัญชี GitHub ของคุณที่มีสำเนาของหลักสูตร +เพื่อให้คุณบันทึกงานของคุณได้ง่าย ๆ แนะนำให้คุณสร้างสำเนาของที่เก็บข้อมูลนี้ คุณสามารถทำได้โดยคลิกปุ่ม **Use this template** ที่ด้านบนของหน้า ซึ่งจะสร้างที่เก็บข้อมูลใหม่ในบัญชี GitHub ของคุณพร้อมสำเนาของหลักสูตรนี้ ทำตามขั้นตอนเหล่านี้: -1. **โฟร์กที่เก็บข้อมูล**: คลิกที่ปุ่ม "Fork" ที่มุมบนขวาของหน้านี้ +1. **Fork ที่เก็บข้อมูล**: คลิกปุ่ม "Fork" ที่มุมขวาบนของหน้านี้ 2. **โคลนที่เก็บข้อมูล**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -#### รันหลักสูตรใน Codespace +#### การรันหลักสูตรใน Codespace -ในสำเนาที่เก็บของคุณที่สร้างขึ้น คลิกปุ่ม **Code** แล้วเลือก **Open with Codespaces** จะสร้าง Codespace ใหม่ให้คุณทำงาน +ในสำเนาของที่เก็บข้อมูลที่คุณสร้าง คลิกปุ่ม **Code** และเลือก **Open with Codespaces** จะสร้าง Codespace ใหม่สำหรับคุณทำงาน ![Codespace](../../translated_images/th/createcodespace.0238bbf4d7a8d955.webp) -#### รันหลักสูตรในเครื่องของคุณ +#### การรันหลักสูตรแบบโลคอลบนคอมพิวเตอร์ของคุณ -หากอยากรันหลักสูตรนี้ในเครื่องของคุณ คุณจะต้องมีโปรแกรมแก้ไขข้อความ เบราว์เซอร์ และเครื่องมือบรรทัดคำสั่ง บทเรียนแรกของเรา, [แนะนำภาษาการเขียนโปรแกรมและเครื่องมือ](../../1-getting-started-lessons/1-intro-to-programming-languages), จะนำทางคุณผ่านตัวเลือกต่างๆ สำหรับเครื่องมือเหล่านี้เพื่อให้คุณเลือกสิ่งที่เหมาะสมกับคุณที่สุด +ในการรันหลักสูตรนี้แบบโลคอลบนคอมพิวเตอร์ คุณต้องใช้โปรแกรมแก้ไขข้อความ, เบราว์เซอร์ และเครื่องมือบรรทัดคำสั่ง บทเรียนแรกของเรา [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages) จะพาคุณไปรู้จักทางเลือกต่าง ๆ ของเครื่องมือเหล่านี้เพื่อให้คุณเลือกใช้ได้ตามที่เหมาะสมกับตัวเอง -เราขอแนะนำให้ใช้ [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) เป็นโปรแกรมแก้ไขของคุณ ซึ่งมี [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) ในตัวด้วย คุณสามารถดาวน์โหลด Visual Studio Code ได้ที่ [นี่](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) -1. โคลนที่เก็บรหัสของคุณลงในคอมพิวเตอร์ คุณสามารถทำได้โดยคลิกที่ปุ่ม **Code** แล้วคัดลอก URL: +คำแนะนำของเราคือใช้ [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) เป็นโปรแกรมแก้ไขของคุณ ซึ่งมาพร้อมกับ [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) ในตัว คุณสามารถดาวน์โหลด Visual Studio Code ได้ที่ [นี่](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) +1. โคลนที่เก็บของคุณมายังเครื่องคอมพิวเตอร์ของคุณ คุณสามารถทำได้โดยการคลิกที่ปุ่ม **Code** และคัดลอก URL: [CodeSpace](./images/createcodespace.png) - จากนั้น เปิด [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) ใน [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) และรันคำสั่งต่อไปนี้ โดยแทนที่ `` ด้วย URL ที่คุณเพิ่งคัดลอกมา: + จากนั้น เปิด [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) ภายใน [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) และรันคำสั่งต่อไปนี้ โดยแทนที่ `` ด้วย URL ที่คุณเพิ่งคัดลอกมา: ```bash git clone ``` -2. เปิดโฟลเดอร์ใน Visual Studio Code คุณสามารถทำได้โดยคลิก **File** > **Open Folder** และเลือกโฟลเดอร์ที่คุณเพิ่งโคลนมา +2. เปิดโฟลเดอร์ใน Visual Studio Code คุณสามารถทำได้โดยการคลิก **File** > **Open Folder** และเลือกโฟลเดอร์ที่คุณเพิ่งโคลนมา > ส่วนขยายที่แนะนำสำหรับ Visual Studio Code: > -> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - เพื่อดูตัวอย่างหน้า HTML ภายใน Visual Studio Code +> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - สำหรับดูตัวอย่างหน้า HTML ภายใน Visual Studio Code > * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - เพื่อช่วยให้คุณเขียนโค้ดได้เร็วขึ้น ## 📂 แต่ละบทเรียนประกอบด้วย: -- สเก็ตช์โน้ต (ไม่บังคับ) +- สเก็ตช์โน้ตเสริม (ไม่บังคับ) - วิดีโอเสริม (ไม่บังคับ) -- แบบทดสอบอบอุ่นก่อนบทเรียน +- แบบทดสอบอุ่นเครื่องก่อนบทเรียน - บทเรียนที่เขียนไว้ -- สำหรับบทเรียนที่ใช้โครงการเป็นฐาน มีคำแนะนำทีละขั้นตอนในการสร้างโครงการ -- เช็คความรู้ +- สำหรับบทเรียนที่เน้นโครงการ มีคำแนะนำทีละขั้นตอนในการสร้างโครงการ +- การตรวจสอบความรู้ - ความท้าทาย -- การอ่านเสริม +- การอ่านเพิ่มเติม - การบ้าน - [แบบทดสอบหลังบทเรียน](https://ff-quizzes.netlify.app/web/) -> **หมายเหตุเกี่ยวกับแบบทดสอบ**: แบบทดสอบทั้งหมดอยู่ในโฟลเดอร์ Quiz-app รวม 48 แบบทดสอบ แต่ละแบบทดสอบมีสามคำถาม สามารถเข้าถึงได้ที่ [นี่](https://ff-quizzes.netlify.app/web/) แอปแบบทดสอบสามารถรันแบบออฟไลน์หรือดีพลอยไปที่ Azure ตามคำแนะนำในโฟลเดอร์ `quiz-app` +> **บันทึกเกี่ยวกับแบบทดสอบ**: แบบทดสอบทั้งหมดอยู่ในโฟลเดอร์ Quiz-app มีทั้งหมด 48 แบบทดสอบ แต่ละแบบประกอบด้วย 3 คำถาม สามารถเข้าถึงได้ที่ [นี่](https://ff-quizzes.netlify.app/web/) แอปแบบทดสอบสามารถรันในเครื่องหรือปรับใช้บน Azure; ทำตามคำแนะนำในโฟลเดอร์ `quiz-app` ## 🗃️ บทเรียน -| | ชื่อโปรเจค | แนวคิดที่สอน | วัตถุประสงค์การเรียนรู้ | บทเรียนที่ลิงก์ | ผู้แต่ง | +| | ชื่อโปรเจค | แนวคิดที่สอน | วัตถุประสงค์การเรียนรู้ | บทเรียนที่เชื่อมโยง | ผู้แต่ง | | :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | -| 01 | Getting Started | แนะนำการเขียนโปรแกรมและเครื่องมือของงาน | เรียนรู้พื้นฐานของภาษาการเขียนโปรแกรมส่วนใหญ่และเกี่ยวกับซอฟต์แวร์ที่ช่วยนักพัฒนามืออาชีพทำงานของพวกเขา | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | Getting Started | พื้นฐานของ GitHub รวมถึงการทำงานเป็นทีม | วิธีใช้งาน GitHub ในโปรเจคของคุณ วิธีการร่วมมือกับผู้อื่นบนฐานโค้ด | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | Getting Started | การเข้าถึง | เรียนรู้พื้นฐานของเว็บที่สามารถเข้าถึงได้ | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS Basics | ประเภทข้อมูลของ JavaScript | พื้นฐานของประเภทข้อมูลใน JavaScript | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS Basics | ฟังก์ชันและเมธอด | เรียนรู้เกี่ยวกับฟังก์ชันและเมธอดในการจัดการการไหลของตรรกะแอปพลิเคชัน | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | -| 06 | JS Basics | การตัดสินใจด้วย JS | เรียนรู้วิธีสร้างเงื่อนไขในโค้ดของคุณโดยใช้วิธีการตัดสินใจ | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS Basics | อาร์เรย์และลูป | ทำงานกับข้อมูลโดยใช้ arrays และ loops ใน JavaScript | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML ในการปฏิบัติ | สร้าง HTML เพื่อสร้างเทอร์ราเรียมออนไลน์ โดยเน้นการสร้างเลย์เอาต์ | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS ในการปฏิบัติ | สร้าง CSS เพื่อจัดสไตล์เทอร์ราเรียมออนไลน์ โดยเน้นพื้นฐานของ CSS รวมถึงการทำให้หน้าเว็บตอบสนอง | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | closures ของ JavaScript, การจัดการ DOM | สร้าง JavaScript เพื่อทำให้เทอร์ราเรียมทำงานเป็นอินเทอร์เฟซลาก/วาง โดยเน้น closures และการจัดการ DOM | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [Typing Game](./4-typing-game/solution/README.md) | สร้างเกมพิมพ์ | เรียนรู้วิธีใช้เหตุการณ์คีย์บอร์ดเพื่อขับเคลื่อนตรรกะของแอป JavaScript ของคุณ | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | การทำงานกับเบราว์เซอร์ | เรียนรู้วิธีที่เบราว์เซอร์ทำงาน ประวัติของมัน และวิธีวางโครงสร้างส่วนแรกของส่วนขยายเบราว์เซอร์ | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | การสร้างแบบฟอร์ม เรียก API และเก็บตัวแปรใน local storage | สร้างส่วนประกอบ JavaScript ของส่วนเสริมเบราว์เซอร์ของคุณ เพื่อเรียกใช้ API โดยใช้ตัวแปรที่เก็บใน local storage | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | กระบวนการแบ็กกราวด์ในเบราว์เซอร์, ประสิทธิภาพเว็บ | ใช้กระบวนการแบ็กกราวด์ของเบราว์เซอร์เพื่อจัดการไอคอนส่วนขยาย; เรียนรู้เกี่ยวกับประสิทธิภาพเว็บและบางการเพิ่มประสิทธิภาพเพื่อทำให้ | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [Space Game](./6-space-game/solution/README.md) | การพัฒนาเกมขั้นสูงด้วย JavaScript | เรียนรู้เกี่ยวกับการสืบทอดโดยใช้ทั้ง Classes และ Composition และรูปแบบ Pub/Sub เพื่อเตรียมตัวสำหรับการสร้างเกม | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [Space Game](./6-space-game/solution/README.md) | การวาดบนแคนวาส | เรียนรู้เกี่ยวกับ Canvas API ซึ่งใช้สำหรับวาดองค์ประกอบบนหน้าจอ | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [Space Game](./6-space-game/solution/README.md) | การเคลื่อนย้ายวัตถุบนหน้าจอ | ค้นพบวิธีที่วัตถุสามารถเคลื่อนที่ได้โดยใช้พิกัดคาร์ทีเซียนและ Canvas API | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [Space Game](./6-space-game/solution/README.md) | การตรวจจับการชน | ทำให้องค์ประกอบชนกันและตอบสนองต่อกันโดยใช้การกดแป้นพิมพ์ พร้อมทั้งมีฟังก์ชันพักเวลาการทำงานเพื่อรับประกันประสิทธิภาพของเกม | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [Space Game](./6-space-game/solution/README.md) | การเก็บคะแนน | ทำคำนวณทางคณิตศาสตร์ตามสถานะและประสิทธิภาพของเกม | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [Space Game](./6-space-game/solution/README.md) | การสิ้นสุดและเริ่มเกมใหม่ | เรียนรู้เกี่ยวกับการสิ้นสุดและเริ่มเกมใหม่ รวมถึงการจัดการล้างข้อมูลและรีเซ็ตค่าตัวแปร | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [Banking App](./7-bank-project/solution/README.md) | เทมเพลต HTML และเส้นทางในเว็บแอป | เรียนรู้วิธีสร้างโครงสร้างเว็บไซต์หลายหน้าโดยใช้ routing และเทมเพลต HTML | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [Banking App](./7-bank-project/solution/README.md) | สร้างแบบฟอร์มเข้าสู่ระบบและลงทะเบียน | เรียนรู้เกี่ยวกับการสร้างฟอร์มและวิธีจัดการการตรวจสอบความถูกต้อง | [Forms](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [Banking App](./7-bank-project/solution/README.md) | วิธีการดึงข้อมูลและใช้งานข้อมูล | วิธีการไหลของข้อมูลเข้าและออกจากแอปของคุณ วิธีดึงข้อมูล เก็บข้อมูล และกำจัดข้อมูล | [Data](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [Banking App](./7-bank-project/solution/README.md) | แนวคิดการจัดการสถานะ | เรียนรู้ว่าแอปของคุณเก็บสถานะอย่างไร และวิธีจัดการสถานะนั้นด้วยโปรแกรม | [State Management](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Browser/VScode Code](../../8-code-editor) | การทำงานกับ VScode | เรียนรู้วิธีใช้งานโปรแกรมแก้ไขโค้ด | [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [AI Assistants](./9-chat-project/README.md) | การทำงานกับ AI | เรียนรู้วิธีสร้างผู้ช่วย AI ของคุณเอง | [AI Assistant project](./9-chat-project/README.md) | Chris | +| 01 | Getting Started | บทนำการเขียนโปรแกรมและเครื่องมือที่ใช้ | เรียนรู้พื้นฐานเบื้องหลังของภาษาการเขียนโปรแกรมส่วนใหญ่และเกี่ยวกับซอฟต์แวร์ที่ช่วยผู้พัฒนาอาชีพทำงานของตนเอง | [บทนำเกี่ยวกับภาษาการเขียนโปรแกรมและเครื่องมือ](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | Getting Started | พื้นฐานของ GitHub รวมถึงการทำงานร่วมกับทีม | วิธีการใช้ GitHub ในโปรเจคของคุณ วิธีการทำงานร่วมกับผู้อื่นบนฐานโค้ด | [บทนำสู่ GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | Getting Started | การเข้าถึง | เรียนรู้พื้นฐานของการเข้าใช้งานเว็บ | [พื้นฐานเกี่ยวกับการเข้าถึง](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS Basics | ประเภทข้อมูล JavaScript | พื้นฐานของประเภทข้อมูลใน JavaScript | [ประเภทข้อมูล](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS Basics | ฟังก์ชันและเมธอด | เรียนรู้เกี่ยวกับฟังก์ชันและเมธอดเพื่อจัดการลำดับการทำงานของแอปพลิเคชัน | [ฟังก์ชันและเมธอด](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | +| 06 | JS Basics | การตัดสินใจด้วย JS | เรียนรู้วิธีสร้างเงื่อนไขในโค้ดของคุณโดยใช้วิธีตัดสินใจ | [การตัดสินใจ](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS Basics | อาร์เรย์และลูป | ทำงานกับข้อมูลโดยใช้ arrays และ loops ใน JavaScript | [อาร์เรย์และลูป](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML ในการปฏิบัติ | สร้าง HTML เพื่อสร้างเทอราเรียมออนไลน์ โดยเน้นการสร้างเลย์เอาต์ | [บทนำสู่ HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS ในการปฏิบัติ | สร้าง CSS เพื่อจัดรูปแบบเทอราเรียมออนไลน์ โดยเน้นพื้นฐานของ CSS รวมถึงการทำให้หน้าเว็บตอบสนอง | [บทนำสู่ CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closures, การจัดการ DOM | สร้าง JavaScript ให้เทอราเรียมทำงานเป็นอินเทอร์เฟซลากและวาง โดยเน้น closures และการจัดการ DOM | [JavaScript Closures, การจัดการ DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [Typing Game](./4-typing-game/solution/README.md) | สร้างเกมพิมพ์ | เรียนรู้วิธีใช้เหตุการณ์คีย์บอร์ดเพื่อควบคุมลอจิกของแอป JavaScript ของคุณ | [การเขียนโปรแกรมเชิงเหตุการณ์](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [ส่วนขยายเบราว์เซอร์สีเขียว](./5-browser-extension/solution/README.md) | การทำงานกับเบราว์เซอร์ | เรียนรู้วิธีทำงานของเบราว์เซอร์ ประวัติศาสตร์ และวิธีสร้างส่วนแรกของส่วนขยายเบราว์เซอร์ | [เกี่ยวกับเบราว์เซอร์](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [ส่วนขยายเบราว์เซอร์สีเขียว](./5-browser-extension/solution/README.md) | การสร้างฟอร์ม เรียกใช้ API และจัดเก็บตัวแปรใน local storage | สร้างองค์ประกอบ JavaScript ของส่วนขยายเบราว์เซอร์เพื่อเรียกใช้ API โดยใช้ตัวแปรที่เก็บใน local storage | [API, ฟอร์ม และ local storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [ส่วนขยายเบราว์เซอร์สีเขียว](./5-browser-extension/solution/README.md) | กระบวนการเบื้องหลังในเบราว์เซอร์ ประสิทธิภาพเว็บ | ใช้กระบวนการเบื้องหลังของเบราว์เซอร์เพื่อจัดการไอคอนของส่วนขยาย เรียนรู้เกี่ยวกับประสิทธิภาพเว็บและการปรับปรุงบางอย่าง | [งานเบื้องหลังและประสิทธิภาพ](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [Space Game](./6-space-game/solution/README.md) | การพัฒนาเกมขั้นสูงด้วย JavaScript | เรียนรู้เกี่ยวกับการสืบทอดโดยใช้คลาสและคอมโพสิชันและรูปแบบ Pub/Sub เตรียมพร้อมสำหรับการสร้างเกม | [บทนำสู่การพัฒนาเกมขั้นสูง](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [Space Game](./6-space-game/solution/README.md) | การวาดลงบน canvas | เรียนรู้เกี่ยวกับ Canvas API ซึ่งใช้ในการวาดองค์ประกอบลงบนหน้าจอ | [การวาดลงบน Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [Space Game](./6-space-game/solution/README.md) | การเคลื่อนย้ายองค์ประกอบบนหน้าจอ | ค้นพบว่าวัตถุสามารถเคลื่อนที่ได้อย่างไรโดยใช้พิกัดคาร์ทีเซียนและ Canvas API | [การเคลื่อนย้ายองค์ประกอบ](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [Space Game](./6-space-game/solution/README.md) | การตรวจจับการชน | ทำให้องค์ประกอบชนและตอบสนองต่อกันโดยใช้การกดปุ่มและมีฟังก์ชันพักเพื่อรักษาประสิทธิภาพของเกม | [การตรวจจับการชน](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [Space Game](./6-space-game/solution/README.md) | การเก็บคะแนน | ทำการคำนวณทางคณิตศาสตร์ตามสถานะและประสิทธิภาพของเกม | [การเก็บคะแนน](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [Space Game](./6-space-game/solution/README.md) | การจบและเริ่มเกมใหม่ | เรียนรู้เกี่ยวกับการจบเกมและเริ่มเกมใหม่ รวมถึงการล้างข้อมูลและรีเซ็ตตัวแปรต่าง ๆ | [เงื่อนไขการจบเกม](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [Banking App](./7-bank-project/solution/README.md) | เทมเพลต HTML และเส้นทางในเว็บแอป | เรียนรู้วิธีสร้างโครงสร้างของเว็บไซต์หลายหน้าโดยใช้ routing และเทมเพลต HTML | [เทมเพลต HTML และเส้นทาง](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [Banking App](./7-bank-project/solution/README.md) | การสร้างฟอร์มเข้าสู่ระบบและสมัครสมาชิก | เรียนรู้เกี่ยวกับการสร้างฟอร์มและการจัดการการตรวจสอบความถูกต้อง | [ฟอร์ม](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [Banking App](./7-bank-project/solution/README.md) | วิธีการดึงและใช้ข้อมูล | การไหลของข้อมูลเข้าและออกจากแอปของคุณ วิธีดึงข้อมูล เก็บข้อมูล และจัดการข้อมูล | [ข้อมูล](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [Banking App](./7-bank-project/solution/README.md) | แนวคิดเกี่ยวกับการจัดการสถานะ | เรียนรู้การเก็บสถานะของแอปและวิธีการจัดการสถานะโดยใช้โปรแกรม | [การจัดการสถานะ](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [Browser/VScode Code](../../8-code-editor) | การใช้งาน VScode | เรียนรู้การใช้ตัวแก้ไขโค้ด | [ใช้ตัวแก้ไขโค้ด VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [AI Assistants](./9-chat-project/README.md) | การทำงานกับ AI | เรียนรู้การสร้างผู้ช่วย AI ของคุณเอง | [โปรเจคผู้ช่วย AI](./9-chat-project/README.md) | Chris | ## 🏫 การสอน หลักสูตรของเราออกแบบโดยยึดหลักการสอนสำคัญสองประการ: -* การเรียนรู้จากโครงการ +* การเรียนรู้โดยผ่านโปรเจค * แบบทดสอบบ่อยครั้ง -โปรแกรมสอนพื้นฐานของ JavaScript, HTML, และ CSS รวมทั้งเครื่องมือและเทคนิคล่าสุดที่นักพัฒนาเว็บใช้งานในปัจจุบัน นักเรียนจะได้มีโอกาสพัฒนาทักษะผ่านการสร้างเกมพิมพ์ เกมเทอร์ราเรียมเสมือนจริง ส่วนขยายเบราว์เซอร์ที่เป็นมิตรกับสิ่งแวดล้อม เกมสไตล์ space-invader และแอปธนาคารสำหรับธุรกิจ เมื่อจบชุดบทเรียนนี้ นักเรียนจะมีความเข้าใจแข็งแกร่งเกี่ยวกับการพัฒนาเว็บ +โปรแกรมสอนพื้นฐานของ JavaScript, HTML, และ CSS รวมถึงเครื่องมือและเทคนิคล่าสุดที่นักพัฒนาเว็บใช้ในปัจจุบัน นักเรียนจะมีโอกาสในการพัฒนาประสบการณ์จริงโดยสร้างเกมพิมพ์ เทอราเรียมเสมือนจริง ส่วนขยายเบราว์เซอร์ที่เป็นมิตรกับสิ่งแวดล้อม เกมสไตล์ Space Invader และแอปธนาคารสำหรับธุรกิจ เมื่อจบชุดบทเรียนนี้ นักเรียนจะมีความเข้าใจที่มั่นคงเกี่ยวกับการพัฒนาเว็บ -> 🎓 คุณสามารถเรียนบทเรียนแรกๆ ในหลักสูตรนี้เป็น [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) บน Microsoft Learn! +> 🎓 คุณสามารถเรียนบทเรียนแรก ๆ ของหลักสูตรนี้ในฐานะ [เส้นทางการเรียนรู้](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) บน Microsoft Learn! -ด้วยการทำให้เนื้อหาสอดคล้องกับโครงการ ขั้นตอนการเรียนรู้จะน่าดึงดูดใจมากขึ้นสำหรับนักเรียนและช่วยเพิ่มความจำแนวคิด เรายังเขียนบทเรียนเริ่มต้นเกี่ยวกับพื้นฐาน JavaScript เพื่อแนะนำแนวคิด พร้อมกับวิดีโอจากชุด "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" ซึ่งมีผู้เขียนบางส่วนมีส่วนร่วมในการสร้างหลักสูตรนี้ +โดยการทำให้เนื้อหาสอดคล้องกับโปรเจค กระบวนการเรียนรู้จะน่าสนใจยิ่งขึ้นสำหรับนักเรียน และช่วยเสริมสร้างความเข้าใจในแนวคิดต่าง ๆ เรายังได้เขียนบทเรียนเริ่มต้นพื้นฐานของ JavaScript เพื่อแนะนำแนวคิดพร้อมกับวิดีโอจากชุด "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" ซึ่งผู้เขียนบางท่านได้ร่วมสนับสนุนหลักสูตรนี้ -นอกจากนี้ แบบทดสอบแบบไม่กดดันก่อนเข้าชั้นเรียนช่วยให้นักเรียนตั้งเป้าหมายการเรียนรู้เรื่องใดเรื่องหนึ่ง ในขณะเดียวกัน แบบทดสอบหลังชั้นเรียนจะเสริมความจำของนักเรียน หลักสูตรนี้ออกแบบมาให้ยืดหยุ่นและสนุก และคุณสามารถเรียนทั้งชุดหรือแค่บางส่วนก็ได้ โครงการเริ่มจากง่ายและค่อย ๆ ซับซ้อนขึ้นในช่วง 12 สัปดาห์ +นอกจากนี้ แบบทดสอบเล็ก ๆ ก่อนเริ่มคลาสจะช่วยตั้งเป้าหมายของนักเรียนในการเรียนรู้หัวข้อ และแบบทดสอบอีกครั้งหลังคลาสช่วยเสริมสร้างความเข้าใจเพิ่มเติม หลักสูตรนี้ออกแบบให้ยืดหยุ่นและสนุกสนาน สามารถเรียนทั้งหมดหรือบางส่วนได้ โครงการเริ่มจากง่ายและซับซ้อนขึ้นเรื่อย ๆ จนจบในรอบ 12 สัปดาห์ -แม้เราจะหลีกเลี่ยงการนำ JavaScript frameworks มาใช้เพื่อเน้นทักษะพื้นฐานที่จำเป็นสำหรับนักพัฒนาเว็บก่อนที่จะเรียนรู้ framework ก้าวต่อไปที่ดีหลังจากจบบทเรียนนี้คือการเรียนรู้ Node.js ผ่านชุดวิดีโออื่นๆ: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". +แม้ว่าเราจะตั้งใจหลีกเลี่ยงการแนะนำ JavaScript frameworks เพื่อเน้นทักษะพื้นฐานที่จำเป็นสำหรับนักพัฒนาเว็บก่อนการใช้ framework ก้าวต่อไปที่ดีในการเรียนรู้หลังจากจบหลักสูตรนี้คือการศึกษาการใช้งาน Node.js ผ่านชุดวิดีโออื่น: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" + +> เยี่ยมชม [Code of Conduct](CODE_OF_CONDUCT.md) และ [Contributing](CONTRIBUTING.md) ของเรา เรายินดีรับฟังคำติชมที่สร้างสรรค์ของคุณ! -> เยี่ยมชม [Code of Conduct](CODE_OF_CONDUCT.md) และ [Contributing](CONTRIBUTING.md) ของเรา เรายินดีรับฟังคำติชมสร้างสรรค์ของคุณ! ## 🧭 การเข้าถึงแบบออฟไลน์ -คุณสามารถอ่านเอกสารนี้แบบออฟไลน์ได้ด้วยการใช้ [Docsify](https://docsify.js.org/#/) ให้ fork โครงการนี้, [ติดตั้ง Docsify](https://docsify.js.org/#/quickstart) บนเครื่องของคุณ จากนั้นในโฟลเดอร์รากของโครงการนี้ ให้พิมพ์ `docsify serve` เว็บไซต์จะถูกเสิร์ฟที่พอร์ต 3000 บน localhost ของคุณ: `localhost:3000` +คุณสามารถเรียกดูเอกสารนี้แบบออฟไลน์โดยใช้ [Docsify](https://docsify.js.org/#/). Fork รีโพนี้, [ติดตั้ง Docsify](https://docsify.js.org/#/quickstart) ในเครื่องของคุณ และจากนั้นในโฟลเดอร์ root ของรีโพนี้ พิมพ์ `docsify serve`. เว็บไซต์จะถูกให้บริการที่พอร์ต 3000 บน localhost ของคุณ: `localhost:3000` ## 📘 PDF -ไฟล์ PDF ของบทเรียนทั้งหมดสามารถดูได้ที่ [นี่](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) +สามารถดาวน์โหลดไฟล์ PDF ของบทเรียนทั้งหมดได้ที่ [นี่](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) -## 🎒 คอร์สอื่น ๆ +## 🎒 หลักสูตรอื่นๆ -ทีมของเราผลิตคอร์สอื่น ๆ ด้วย! ตรวจสอบได้ที่: +ทีมงานของเราผลิตหลักสูตรอื่นๆ ด้วย! ลองดูที่: ### LangChain @@ -257,23 +258,23 @@ [![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) -## การขอความช่วยเหลือ +## ขอความช่วยเหลือ -ถ้าคุณติดขัดหรือต้องการถามคำถามเกี่ยวกับการสร้างแอป AI เข้าร่วมกลุ่มผู้เรียนและนักพัฒนาที่มีประสบการณ์ในการสนทนาเกี่ยวกับ MCP นี่คือชุมชนที่สนับสนุนซึ่งเปิดรับคำถามและแบ่งปันความรู้กันอย่างอิสระ +หากคุณติดขัดหรืมีคำถามใด ๆ เกี่ยวกับการสร้างแอป AI เข้าร่วมกับผู้เรียนอื่น ๆ และนักพัฒนาที่มีประสบการณ์ในการพูดคุยเกี่ยวกับ MCP นี่คือชุมชนที่ให้การสนับสนุน ที่ซึ่งคำถามเป็นที่ต้อนรับและความรู้ได้รับการแบ่งปันอย่างเสรี [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -หากคุณมีความคิดเห็นเกี่ยวกับผลิตภัณฑ์หรือพบข้อผิดพลาดในระหว่างการสร้างโปรดเยี่ยมชม: +หากคุณมีความคิดเห็นเกี่ยวกับผลิตภัณฑ์หรือต้องการรายงานข้อผิดพลาดขณะสร้างโปรดเยี่ยมชม: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) ## ใบอนุญาต -รีโพสิทอรีนี้ได้รับอนุญาตภายใต้ใบอนุญาต MIT ดูไฟล์ [LICENSE](../../LICENSE) สำหรับข้อมูลเพิ่มเติม +ที่เก็บนี้ได้รับอนุญาตภายใต้ใบอนุญาต MIT ดูไฟล์ [LICENSE](../../LICENSE) สำหรับข้อมูลเพิ่มเติม --- **ข้อจำกัดความรับผิดชอบ**: -เอกสารนี้ได้รับการแปลโดยใช้บริการแปลภาษาด้วย AI [Co-op Translator](https://github.com/Azure/co-op-translator) แม้ว่าเราจะพยายามให้มีความถูกต้อง แต่โปรดทราบว่าการแปลโดยอัตโนมัติอาจมีข้อผิดพลาดหรือความไม่ถูกต้องได้ เอกสารต้นฉบับในภาษาต้นฉบับถือเป็นแหล่งข้อมูลที่ถูกต้องที่สุด สำหรับข้อมูลที่สำคัญ ขอแนะนำให้ใช้บริการแปลโดยมนุษย์มืออาชีพ เราจะไม่รับผิดชอบต่อความเข้าใจผิดหรือการตีความที่ผิดพลาดที่เกิดจากการใช้การแปลนี้ +เอกสารฉบับนี้ได้รับการแปลโดยใช้บริการแปลภาษา AI [Co-op Translator](https://github.com/Azure/co-op-translator) แม้ว่าเราจะพยายามให้มีความถูกต้อง โปรดทราบว่าการแปลอัตโนมัติอาจมีข้อผิดพลาดหรือความไม่ถูกต้อง เอกสารต้นฉบับในภาษาต้นทางถือเป็นแหล่งข้อมูลที่เชื่อถือได้ สำหรับข้อมูลที่สำคัญ แนะนำให้ใช้การแปลโดยมืออาชีพที่เป็นมนุษย์ เราไม่รับผิดชอบต่อความเข้าใจผิดหรือการตีความที่ผิดพลาดที่เกิดขึ้นจากการใช้การแปลนี้ \ No newline at end of file diff --git a/translations/th/lesson-template/README.md b/translations/th/lesson-template/README.md index 28970a2f3..0207c6fda 100644 --- a/translations/th/lesson-template/README.md +++ b/translations/th/lesson-template/README.md @@ -1,56 +1,79 @@ -# [หัวข้อบทเรียน] +# หัวข้อบทเรียน -![ฝังวิดีโอที่นี่](../../../lesson-template/video-url) +## 🎥 วิดีโอ -## [แบบทดสอบก่อนเรียน](../../../lesson-template/quiz-url) +> เพิ่มวิดีโอฝังหรือลิงก์บทเรียนที่นี่ -[อธิบายสิ่งที่เราจะได้เรียนรู้] +--- + +## แบบทดสอบก่อนบรรยาย + +> เพิ่มลิงก์แบบทดสอบที่นี่เมื่อมี + +--- + +ให้ภาพรวมสั้นๆ ว่านักเรียนจะได้เรียนรู้อะไรในบทเรียนนี้ + +--- -### บทนำ +### การแนะนำ -อธิบายสิ่งที่จะครอบคลุมในบทเรียนนี้ +ให้บทนำสั้นๆ อธิบายว่าบทเรียนนี้จะครอบคลุมเรื่องใด > หมายเหตุ -### ความรู้พื้นฐานที่ควรมีก่อนเรียน +--- + +### ความรู้เบื้องต้น -ขั้นตอนใดที่ควรทำความเข้าใจก่อนเริ่มบทเรียนนี้? +ระบุแนวคิดหรือหัวข้อที่นักเรียนควรรู้ก่อนเริ่มบทเรียนนี้ + +--- ### การเตรียมตัว -ขั้นตอนการเตรียมตัวก่อนเริ่มบทเรียนนี้ +ระบุขั้นตอนการตั้งค่าหรือเครื่องมือที่ต้องใช้ก่อนเริ่มบทเรียน --- -[ดำเนินการเรียนรู้เนื้อหาเป็นส่วนๆ] +### เนื้อหา + +อธิบายเนื้อหาบทเรียนเป็นส่วนๆ อย่างมีโครงสร้าง + +--- -## [หัวข้อ 1] +## หัวข้อ 1 -### งานที่ต้องทำ: +### งาน: -ทำงานร่วมกันเพื่อพัฒนาฐานโค้ดของคุณอย่างต่อเนื่องเพื่อสร้างโปรเจกต์ด้วยโค้ดที่แชร์ร่วมกัน: +ทำงานร่วมกันเพื่อพัฒนาโค้ดฐานของคุณอย่างต่อเนื่องในการสร้างโปรเจกต์ด้วยโค้ดที่ใช้ร่วมกัน: ```html code blocks ``` -✅ ตรวจสอบความเข้าใจ - ใช้ช่วงเวลานี้เพื่อกระตุ้นความคิดของนักเรียนด้วยคำถามปลายเปิด +✅ การตรวจสอบความรู้ +ใช้ช่วงเวลานี้เพื่อกระตุ้นความรู้ของนักเรียนด้วยคำถามแบบเปิด -## [หัวข้อ 2] +## หัวข้อ 2 +## หัวข้อ 3 -## [หัวข้อ 3] +🚀 ความท้าทาย +เพิ่มความท้าทายในการทำงานร่วมกันให้นักเรียนได้พัฒนาโปรเจกต์นี้ -🚀 ความท้าทาย: เพิ่มความท้าทายให้นักเรียนทำงานร่วมกันในชั้นเรียนเพื่อพัฒนาโปรเจกต์ +ไม่บังคับ: เพิ่มภาพหน้าจอ UI ของบทเรียนที่เสร็จสมบูรณ์หากเหมาะสม -ตัวเลือกเพิ่มเติม: เพิ่มภาพหน้าจอของส่วนติดต่อผู้ใช้ (UI) ของบทเรียนที่เสร็จสมบูรณ์หากเหมาะสม +## แบบทดสอบหลังบรรยาย -## [แบบทดสอบหลังเรียน](../../../lesson-template/quiz-url) +เพิ่มลิงก์แบบทดสอบที่นี่หลังจากเรียนจบบทเรียน -## ทบทวนและการศึกษาด้วยตนเอง +## การทบทวน & การศึกษาด้วยตนเอง -**กำหนดส่งงาน [MM/YY]**: [ชื่อการบ้าน](assignment.md) +**มอบหมายงานวันที่ [MM/YY]**: [ชื่อการบ้าน](assignment.md) --- + **ข้อจำกัดความรับผิดชอบ**: -เอกสารนี้ได้รับการแปลโดยใช้บริการแปลภาษา AI [Co-op Translator](https://github.com/Azure/co-op-translator) แม้ว่าเราจะพยายามให้การแปลมีความถูกต้องมากที่สุด แต่โปรดทราบว่าการแปลอัตโนมัติอาจมีข้อผิดพลาดหรือความไม่ถูกต้อง เอกสารต้นฉบับในภาษาดั้งเดิมควรถือเป็นแหล่งข้อมูลที่เชื่อถือได้ สำหรับข้อมูลที่สำคัญ ขอแนะนำให้ใช้บริการแปลภาษามืออาชีพ เราไม่รับผิดชอบต่อความเข้าใจผิดหรือการตีความผิดที่เกิดจากการใช้การแปลนี้ \ No newline at end of file +เอกสารนี้ได้รับการแปลโดยใช้บริการแปลภาษาด้วย AI [Co-op Translator](https://github.com/Azure/co-op-translator) ซึ่งแม้เราจะพยายามให้ความถูกต้องสูงสุด กรุณาทราบว่าการแปลอัตโนมัติอาจมีข้อผิดพลาดหรือความไม่ถูกต้อง เอกสารต้นฉบับในภาษาต้นทางถือเป็นแหล่งข้อมูลที่เชื่อถือได้ สำหรับข้อมูลที่สำคัญ แนะนำให้ใช้การแปลโดยผู้เชี่ยวชาญมนุษย์เป็นต้นเอง เราไม่รับผิดชอบต่อความเข้าใจผิดหรือการตีความผิดที่เกิดจากการใช้การแปลนี้ + \ No newline at end of file