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

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

Browse Source
pull/1793/head
localizeflow[bot] 5 months ago
parent 08efa3b0e3
commit 1198925a44
6 changed files with 427 additions and 427 deletions
Show Stats Download Patch File Download Diff File

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

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-04-06T18:36:30+00:00", "translation_date": "2026-04-20T16:29:40+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "el" "language_code": "el"
}, },

288
translations/el/AGENTS.md
Unescape View File

@ -2,27 +2,27 @@
## Επισκόπηση Έργου ## Επισκόπηση Έργου
Αυτό είναι ένα αποθετήριο εκπαιδευτικού προγράμματος για τη διδασκαλία των βασικών της ανάπτυξης ιστοσελίδων σε αρχάριους. Το πρόγραμμα αποτελείται από ένα ολοκληρωμένο μάθημα 12 εβδομάδων που έχει αναπτυχθεί από τους Microsoft Cloud Advocates, με 24 πρακτικά μαθήματα που καλύπτουν JavaScript, CSS και HTML. Αυτό είναι ένα εκπαιδευτικό αποθετήριο προγράμματος σπουδών για τη διδασκαλία των βασικών της ανάπτυξης ιστοσελίδων σε αρχάριους. Το πρόγραμμα σπουδών είναι ένα ολοκληρωμένο μάθημα 12 εβδομάδων που αναπτύχθηκε από τους Microsoft Cloud Advocates, με 24 πρακτικά μαθήματα που καλύπτουν JavaScript, CSS και HTML.
### Κύρια Στοιχεία ### Κύρια Στοιχεία
- **Εκπαιδευτικό Περιεχόμενο**: 24 δομημένα μαθήματα οργανωμένα σε μονάδες με έμφαση σε έργα - **Εκπαιδευτικό Περιεχόμενο**: 24 δομημένα μαθήματα οργανωμένα σε μονάδες βασισμένες σε έργα
- **Πρακτικά Έργα**: Terrarium, Παιχνίδι Πληκτρολόγησης, Επέκταση Περιηγητή, Παιχνίδι Διαστήματος, Εφαρμογή Τράπεζας, Επεξεργαστής Κώδικα και Βοηθός Συνομιλίας AI - **Πρακτικά Έργα**: Terrarium, Παιχνίδι Πληκτρολόγησης, Επέκταση Περιηγητή, Παιχνίδι Διαστήματος, Τραπεζική Εφαρμογή, Κώδικας Επεξεργαστή και Βοηθός Συνομιλίας με Τεχνητή Νοημοσύνη
- **Διαδραστικά Κουίζ**: 48 κουίζ με 3 ερωτήσεις το καθένα (εκτιμήσεις πριν/μετά το μάθημα) - **Διαδραστικά Κουίζ**: 48 κουίζ με 3 ερωτήσεις το καθένα (αξιολογήσεις πριν/μετά το μάθημα)
- **Υποστήριξη Πολλών Γλωσσών**: Αυτόματες μεταφράσεις για πάνω από 50 γλώσσες μέσω GitHub Actions - **Υποστήριξη Πολλαπλών Γλωσσών**: Αυτόματες μεταφράσεις για πάνω από 50 γλώσσες μέσω GitHub Actions
- **Τεχνολογίες**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (για έργα AI) - **Τεχνολογίες**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (για έργα ΤΝ)
### Αρχιτεκτονική ### Αρχιτεκτονική
- Εκπαιδευτικό αποθετήριο με δομή βασισμένη στα μαθήματα - Εκπαιδευτικό αποθετήριο με δομή βάσει μαθημάτων
- Κάθε φάκελος μαθήματος περιέχει README, παραδείγματα κώδικα και λύσεις - Οφάκελοι κάθε μαθήματος περιέχουν README, παραδείγματα κώδικα και λύσεις
- Αυτόνομα έργα σε ξεχωριστούς φακέλους (quiz-app, διάφορα έργα μαθημάτων) - Αυτόνομα έργα σε ξεχωριστούς φακέλους (quiz-app, διάφορα έργα μαθημάτων)
- Σύστημα μετάφρασης με χρήση GitHub Actions (co-op-translator) - Σύστημα μετάφρασης μέσω GitHub Actions (co-op-translator)
- Τεκμηρίωση διαθέσιμη μέσω Docsify και ως PDF - Τεκμηρίωση διατίθεται μέσω Docsify και ως PDF
## Εντολές Ρύθμισης ## Εντολές Ρύθμισης
Αυτό το αποθετήριο είναι κυρίως για την κατανάλωση εκπαιδευτικού περιεχομένου. Για εργασία με συγκεκριμένα έργα: Αυτό το αποθετήριο προορίζεται κυρίως για κατανάλωση εκπαιδευτικού περιεχομένου. Για εργασία με συγκεκριμένα έργα:
### Ρύθμιση Κύριου Αποθετηρίου ### Ρύθμιση Κύριου Αποθετηρίου
@ -36,12 +36,12 @@ cd Web-Dev-For-Beginners
```bash ```bash
cd quiz-app cd quiz-app
npm install npm install
npm run dev # Ξεκινήστε το διακομιστή ανάπτυξης npm run dev # Εκκίνηση διακομιστή ανάπτυξης
npm run build # Δημιουργία για παραγωγή npm run build # Δημιουργία για παραγωγή
npm run lint # Εκτέλεση ESLint npm run lint # Εκτέλεση ESLint
``` ```
### API Έργου Τράπεζας (Node.js + Express) ### API Τραπεζικού Έργου (Node.js + Express)
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
@ -56,7 +56,7 @@ npm run format # Μορφοποίηση με Prettier
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# Ακολουθήστε τις οδηγίες φόρτωσης επεκτάσεων ειδικές για τον περιηγητή # Ακολουθήστε τις οδηγίες φόρτωσης επεκτάσεων που είναι ειδικές για τον περιηγητή
``` ```
### Έργα Παιχνιδιού Διαστήματος ### Έργα Παιχνιδιού Διαστήματος
@ -67,41 +67,41 @@ npm install
# Ανοίξτε το index.html σε πρόγραμμα περιήγησης ή χρησιμοποιήστε Live Server # Ανοίξτε το index.html σε πρόγραμμα περιήγησης ή χρησιμοποιήστε Live Server
``` ```
### Έργο Συνομιλίας (Python Backend) ### Έργο Συνομιλίας (Backend Python)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# Ορίστε τη μεταβλητή περιβάλλοντος GITHUB_TOKEN # Ορισμός μεταβλητής περιβάλλοντος GITHUB_TOKEN
python api.py python api.py
``` ```
## Ροή Ανάπτυξης ## Ροή Ανάπτυξης
### Για Συνεργάτες Περιεχομένου ### Για Συνεισφέροντες Περιεχομένου
1. **Διακλάδωση (Fork)** του αποθετηρίου στο GitHub σας 1. **Δημιουργήστε fork** του αποθετηρίου στον λογαριασμό σας στο GitHub
2. **Κλωνοποίηση (Clone)** του fork τοπικά 2. **Κλωνοποιήστε το fork** τοπικά
3. **Δημιουργία νέου κλάδου** για τις αλλαγές σας 3. **Δημιουργήστε νέο κλαδί** για τις αλλαγές σας
4. Κάντε αλλαγές στο περιεχόμενο μαθημάτων ή στα παραδείγματα κώδικα 4. Κάντε αλλαγές στο περιεχόμενο των μαθημάτων ή τα παραδείγματα κώδικα
5. Δοκιμάστε τις αλλαγές κώδικα στους σχετικούς φακέλους έργων 5. Δοκιμάστε τις αλλαγές κώδικα στους αντίστοιχους φακέλους έργων
6. Υποβάλετε ζητήματα συγχώνευσης (pull requests) ακολουθώντας τις οδηγίες συμβολής 6. Υποβάλετε pull requests ακολουθώντας τις οδηγίες συνεισφοράς
### Για Μαθητές ### Για Μαθητές
1. Διακλάδωση ή κλωνοποίηση του αποθετηρίου 1. Κάντε fork ή κλωνοποιήστε το αποθετήριο
2. Πλοηγηθείτε στους φακέλους μαθημάτων με σειρά 2. Πλοηγηθείτε διαδοχικά στους φακέλους των μαθημάτων
3. Διαβάστε τα αρχεία README κάθε μαθήματος 3. Διαβάστε τα αρχεία README κάθε μαθήματος
4. Ολοκληρώστε τα κουίζ πριν το μάθημα στη διεύθυνση https://ff-quizzes.netlify.app/web/ 4. Ολοκληρώστε τα προ-μαθήματος κουίζ στο https://ff-quizzes.netlify.app/web/
5. Εργαστείτε στα παραδείγματα κώδικα στους φακέλους μαθημάτων 5. Επεξεργαστείτε τα παραδείγματα κώδικα στους φακέλους μαθημάτων
6. Ολοκληρώστε εργασίες και προκλήσεις 6. Ολοκληρώστε εργασίες και προκλήσεις
7. Κάντε τα κουίζ μετά το μάθημα 7. Πραγματοποιήστε τα μετα-μαθήματος κουίζ
### Ζωντανή Ανάπτυξη ### Ζωντανή Ανάπτυξη
- **Τεκμηρίωση**: Εκτελέστε `docsify serve` στο ριζικό φάκελο (θύρα 3000) - **Τεκμηρίωση**: Εκτελέστε `docsify serve` από τη ρίζα (θύρα 3000)
- **Quiz App**: Εκτελέστε `npm run dev` στον φάκελο quiz-app - **Quiz App**: Εκτελέστε `npm run dev` στον φάκελο quiz-app
- **Έργα**: Χρησιμοποιήστε την επέκταση Live Server του VS Code για έργα HTML - **Έργα**: Χρησιμοποιήστε το Live Server extension του VS Code για έργα HTML
- **API Έργα**: Εκτελέστε `npm start` στους αντίστοιχους φακέλους API - **API Έργα**: Εκτελέστε `npm start` στους αντίστοιχους φακέλους API
## Οδηγίες Δοκιμών ## Οδηγίες Δοκιμών
@ -110,85 +110,85 @@ python api.py
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Ελέγξτε για προβλήματα στυλ κώδικα npm run lint # Έλεγχος για θέματα στυλ κώδικα
npm run build # Επαληθεύστε ότι η κατασκευή ολοκληρώνεται με επιτυχία npm run build # Επαλήθευση επιτυχίας κατασκευής
``` ```
### Δοκιμές API Τράπεζας ### Δοκιμές Bank API
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Ελέγξτε για προβλήματα στυλ κώδικα npm run lint # Έλεγχος για θέματα στυλ κώδικα
node server.js # Επαληθεύστε ότι ο διακομιστής ξεκινά χωρίς σφάλματα node server.js # Επιβεβαίωση ότι ο διακομιστής ξεκινά χωρίς σφάλματα
``` ```
### Γενική Προσέγγιση Δοκιμών ### Γενική Προσέγγιση Δοκιμών
- Πρόκειται για εκπαιδευτικό αποθετήριο χωρίς πλήρεις αυτοματοποιημένες δοκιμές - Πρόκειται για εκπαιδευτικό αποθετήριο χωρίς ολοκληρωμένες αυτοματοποιημένες δοκιμές
- Η χειροκίνητη δοκιμή εστιάζει σε: - Οι χειροκίνητες δοκιμές εστιάζουν σε:
- Εκτέλεση παραδειγμάτων χωρίς σφάλματα - Εκτέλεση παραδειγμάτων κώδικα χωρίς σφάλματα
- Οι σύνδεσμοι στην τεκμηρίωση λειτουργούν σωστά - Οι σύνδεσμοι στην τεκμηρίωση λειτουργούν σωστά
- Οι διαδικασίες κατασκευής έργων ολοκληρώνονται επιτυχώς - Οι κατασκευές έργων ολοκληρώνονται επιτυχώς
- Τα παραδείγματα ακολουθούν βέλτιστες πρακτικές - Τα παραδείγματα ακολουθούν τις βέλτιστες πρακτικές
### Έλεγχοι Πριν την Υποβολή ### Έλεγχοι Πριν την Υποβολή
- Εκτελέστε `npm run lint` σε φακέλους με package.json - Εκτελέστε `npm run lint` στους φακέλους με package.json
- Επαληθεύστε ότι οι σύνδεσμοι markdown είναι έγκυροι - Επαληθεύστε ότι οι σύνδεσμοι markdown είναι έγκυροι
- Δοκιμάστε τα παραδείγματα κώδικα στον περιηγητή ή Node.js - Δοκιμάστε παραδείγματα κώδικα στον περιηγητή ή Node.js
- Ελέγξτε ότι οι μεταφράσεις διατηρούν τη σωστή δομή - Ελέγξτε ότι οι μεταφράσεις διατηρούν τη σωστή δομή
## Οδηγίες Στυλ Κώδικα ## Οδηγίες Στυλ Κώδικα
### JavaScript ### JavaScript
- Χρήση σύγχρονης σύνταξης ES6+ - Χρησιμοποιήστε τον σύγχρονο σύνταξη ES6+
- Ακολουθήστε τις τυπικές ρυθμίσεις ESLint που παρέχονται στα έργα - Ακολουθήστε τις τυπικές ρυθμίσεις ESLint που παρέχονται στα έργα
- Χρησιμοποιήστε ουσιαστικά ονόματα μεταβλητών και συναρτήσεων για εκπαιδευτική σαφήνεια - Χρησιμοποιήστε ουσιαστικά ονόματα μεταβλητών και συναρτήσεων για εκπαιδευτική σαφήνεια
- Προσθέστε σχόλια που εξηγούν έννοιες για τους μαθητές - Προσθέστε σχόλια που εξηγούν έννοιες για τους μαθητές
- Μορφοποιήστε με Prettier όπου έχει ρυθμιστεί - Μορφοποιήστε με Prettier όπου είναι ρυθμισμένο
### HTML/CSS ### HTML/CSS
- Σημαντικά στοιχεία HTML5 - Σημαντικά στοιχεία HTML5
- Αρχές σχεδίασης για ευέλικτο σχεδιασμό (responsive) - Αρχές σχεδιασμού προσαρμοστικής εμφάνισης (responsive)
- Καθαρούς κανόνες ονοματοδοσίας κλάσεων - Καθαρούς κανόνες ονοματολογίας κλάσεων
- Σχόλια που εξηγούν τις τεχνικές CSS για εκπαιδευτικούς σκοπούς - Σχόλια που εξηγούν τεχνικές CSS για μαθητές
### Python ### Python
- Οδηγίες στυλ PEP 8 - Χρήση οδηγιών στυλ PEP 8
- Καθαρά, εκπαιδευτικά παραδείγματα κώδικα - Καθαρά, εκπαιδευτικά παραδείγματα κώδικα
- Τύποι (type hints) όπου είναι χρήσιμο για τη μάθηση - Χρήση δηλώσεων τύπων όπου βοηθούν στην εκμάθηση
### Τεκμηρίωση Markdown ### Τεκμηρίωση σε Markdown
- Σαφής ιεραρχία επικεφαλίδων - Σαφή ιεραρχία επικεφαλίδων
- Μπλοκ κώδικα με καθορισμένη γλώσσα - Μπλοκ κώδικα με καθορισμένη γλώσσα
- Συνδέσμους σε επιπλέον πόρους - Σύνδεσμοι για επιπλέον πόρους
- Στιγμιότυπα και εικόνες στους φακέλους `images/` - Στιγμιότυπα και εικόνες στους φακέλους `images/`
- Εναλλακτικό κείμενο (alt text) για πρόσβαση - Εναλλακτικό κείμενο (alt text) για τις εικόνες για προσβασιμότητα
### Οργάνωση Αρχείων ### Οργάνωση Αρχείων
- Τα μαθήματα αριθμούνται διαδοχικά (1-getting-started-lessons, 2-js-basics, κ.λπ.) - Μαθήματα με αριθμημένη ακολουθία (1-getting-started-lessons, 2-js-basics κ.ά.)
- Κάθε έργο έχει φακέλους `solution/` και συχνά `start/` ή `your-work/` - Κάθε έργο έχει φακέλους `solution/` και συχνά `start/` ή `your-work/`
- Εικόνες αποθηκεύονται σε φακέλους `images/` ανά μάθημα - Εικόνες φυλαγμένες σε φακέλους `images/` κάθε μαθήματος
- Μεταφράσεις σε δομή `translations/{language-code}/` - Μεταφράσεις σε δομή `translations/{language-code}/`
## Κατασκευή και Ανάπτυξη ## Κατασκευή και Ανάπτυξη
### Ανάπτυξη Quiz App (Azure Static Web Apps) ### Ανάπτυξη Quiz App (Azure Static Web Apps)
Η εφαρμογή quiz-app είναι διαμορφωμένη για ανάπτυξη σε Azure Static Web Apps: Το quiz-app είναι ρυθμισμένο για ανάπτυξη σε Azure Static Web Apps:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Δημιουργεί τον φάκελο dist/ npm run build # Δημιουργεί φάκελο dist/
# Αναπτύσσει μέσω ροής εργασίας GitHub Actions κατά την αποστολή στον κλάδο main # Αναπτύσσει μέσω ροής εργασίας GitHub Actions κατά την ώθηση στο main
``` ```
Διαμόρφωση Azure Static Web Apps: Ρυθμίσεις Azure Static Web Apps:
- **Τοποθεσία εφαρμογής**: `/quiz-app` - **Τοποθεσία εφαρμογής**: `/quiz-app`
- **Τοποθεσία εξόδου**: `dist` - **Τοποθεσία εξόδου**: `dist`
- **Ροή εργασίας**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Ροή εργασίας**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
@ -196,7 +196,7 @@ npm run build # Δημιουργεί τον φάκελο dist/
### Δημιουργία PDF Τεκμηρίωσης ### Δημιουργία PDF Τεκμηρίωσης
```bash ```bash
npm install # Εγκατάσταση docsify-to-pdf npm install # Εγκαταστήστε το docsify-to-pdf
npm run convert # Δημιουργία PDF από docs npm run convert # Δημιουργία PDF από docs
``` ```
@ -204,75 +204,75 @@ npm run convert # Δημιουργία PDF από docs
```bash ```bash
npm install -g docsify-cli # Εγκαταστήστε το Docsify παγκοσμίως npm install -g docsify-cli # Εγκαταστήστε το Docsify παγκοσμίως
docsify serve # Υπηρετήστε στο localhost:3000 docsify serve # Εκτελέστε στον localhost:3000
``` ```
### Κατασκευές ανά Έργο ### Κατασκευές ανά Έργο
Κάθε φάκελος έργου μπορεί να έχει τη δική του διαδικασία κατασκευής: Κάθε φάκελος έργου μπορεί να έχει δική του διαδικασία κατασκευής:
- Vue έργα: `npm run build` δημιουργεί bundles παραγωγής - Έργα Vue: `npm run build` δημιουργεί παραγωγικά πακέτα
- Στατικά έργα: Δεν απαιτείται βήμα κατασκευής, εξυπηρετούνται απευθείας τα αρχεία - Στατικά έργα: Δεν απαιτείται βήμα κατασκευής, σερβίρονται απευθείας τα αρχεία
## Οδηγίες Pull Request ## Οδηγίες Pull Request
### Μορφή Τίτλου ### Μορφή Τίτλου
Χρησιμοποιήστε σαφείς, περιγραφικούς τίτλους που υποδεικνύουν την περιοχή αλλαγής: Χρησιμοποιήστε σαφείς, περιγραφικούς τίτλους που υποδεικνύουν την περιοχή αλλαγής:
- `[Quiz-app] Προσθήκη νέου κουίζ για μάθημα X` - `[Quiz-app] Προσθήκη νέου κουίζ για μάθημα Χ`
- `[Lesson-3] Διόρθωση τυπογραφικού λάθους στο έργο terrarium` - `[Lesson-3] Διόρθωση τυπογραφικού λάθους στο έργο terrarium`
- `[Translation] Προσθήκη ισπανικής μετάφρασης για μάθημα 5` - `[Translation] Προσθήκη ισπανικής μετάφρασης για το μάθημα 5`
- `[Docs] Ενημέρωση οδηγιών ρύθμισης` - `[Docs] Ενημέρωση οδηγιών ρύθμισης`
### Απαιτούμενοι Έλεγχοι ### Απαιτούμενοι Έλεγχοι
Πριν την υποβολή PR: Πριν από την υποβολή PR:
1. **Ποιότητα Κώδικα**: 1. **Ποιότητα Κώδικα**:
- Εκτελέστε `npm run lint` στους επηρεασμένους φακέλους έργων - Εκτελέστε `npm run lint` στους επηρεασμένους φακέλους έργων
- Διορθώστε όλα τα σφάλματα και προειδοποιήσεις lint - Διορθώστε όλα τα σφάλματα και προειδοποιήσεις linting
2. **Επαλήθευση Κατασκευής**: 2. **Επαλήθευση Κατασκευής**:
- Εκτελέστε `npm run build` αν ισχύει - Εκτελέστε `npm run build` εάν ισχύει
- Βεβαιωθείτε ότι δεν υπάρχουν σφάλματα κατασκευής - Βεβαιωθείτε ότι δεν υπάρχουν σφάλματα κατασκευής
3. **Επαλήθευση Συνδέσμων**: 3. **Επαλήθευση Συνδέσμων**:
- Δοκιμάστε όλους τους συνδέσμους markdown - Δοκιμάστε όλους τους συνδέσμους markdown
- Επαληθεύστε ότι οι αναφορές εικόνων λειτουργούν - Επαληθεύστε ότι οι αναφορές εικόνων λειτουργούν
4. **Ανασκόπηση Περιεχομένου**: 4. **Αναθεώρηση Περιεχομένου**:
- Διορθώστε ορθογραφία και γραμματική - Διόρθωση ορθογραφίας και γραμματικής
- Βεβαιωθείτε ότι τα παραδείγματα κώδικα είναι σωστά και εκπαιδευτικά - Επιβεβαίωση ότι τα παραδείγματα κώδικα είναι σωστά και εκπαιδευτικά
- Επαληθεύστε ότι οι μεταφράσεις διατηρούν την αρχική έννοια - Επαλήθευση σωστής διατήρησης νοήματος στις μεταφράσεις
### Απαιτήσεις Συμβολής ### Απαιτήσεις Συνεισφοράς
- Αποδοχή Microsoft CLA (αυτόματος έλεγχος στο πρώτο PR) - Αποδοχή του Microsoft CLA (αυτόματος έλεγχος στην πρώτη PR)
- Ακολουθήστε τον [Κώδικα Συμπεριφοράς Ανοικτού Κώδικα Microsoft](https://opensource.microsoft.com/codeofconduct/) - Ακολουθήστε τον [Κώδικα Συμπεριφοράς Ανοιχτού Κώδικα της Microsoft](https://opensource.microsoft.com/codeofconduct/)
- Δείτε το [CONTRIBUTING.md](./CONTRIBUTING.md) για λεπτομερείς οδηγίες - Διαβάστε το [CONTRIBUTING.md](./CONTRIBUTING.md) για λεπτομερείς οδηγίες
- Αναφέρετε αριθμούς ζητημάτων στη περιγραφή PR, εφόσον εφαρμόζεται - Αναφέρετε αριθμούς ζητημάτων στην περιγραφή PR αν ισχύει
### Διαδικασία Αναθεώρησης ### Διαδικασία Αναθεώρησης
- Τα PR αναθεωρούνται από διαχειριστές και κοινότητα - Οι PR ελέγχονται από συντηρητές και την κοινότητα
- Προτεραιότητα στην εκπαιδευτική σαφήνεια - Προτεραιότητα στην εκπαιδευτική σαφήνεια
- Τα παραδείγματα κώδικα πρέπει να ακολουθούν τις τρέχουσες βέλτιστες πρακτικές - Τα παραδείγματα κώδικα να ακολουθούν τις τρέχουσες βέλτιστες πρακτικές
- Οι μεταφράσεις ελέγχονται για ακρίβεια και πολιτιστική καταλληλότητα - Οι μεταφράσεις ελέγχονται για ακρίβεια και πολιτισμική καταλληλότητα
## Σύστημα Μετάφρασης ## Σύστημα Μετάφρασης
### Αυτόματη Μετάφραση ### Αυτόματη Μετάφραση
- Χρήση GitHub Actions με ροή εργασίας co-op-translator - Χρησιμοποιεί GitHub Actions με ροή εργασίας co-op-translator
- Μετάφραση σε πάνω από 50 γλώσσες αυτόματα - Μεταφράζει σε πάνω από 50 γλώσσες αυτόματα
- Αρχεία πηγής στους κύριους φακέλους - Αρχεία πηγής σε κύριους φακέλους
- Μεταφρασμένα αρχεία σε `translations/{language-code}/` - Τα μεταφρασμένα αρχεία βρίσκονται σε `translations/{language-code}/`
### Προσθήκη Χειροκίνητων Βελτιώσεων ### Προσθήκη Χειροκίνητων Βελτιώσεων Μετάφρασης
1. Βρείτε το αρχείο σε `translations/{language-code}/` 1. Εντοπίστε το αρχείο σε `translations/{language-code}/`
2. Κάντε βελτιώσεις διατηρώντας τη δομή 2. Κάντε βελτιώσεις διατηρώντας τη δομή
3. Εξασφαλίστε ότι τα παραδείγματα κώδικα παραμένουν λειτουργικά 3. Εξασφαλίστε ότι τα παραδείγματα κώδικα παραμένουν λειτουργικά
4. Δοκιμάστε το τοπικό κουίζ αν υπάρχει 4. Δοκιμάστε όλο το τοπικοποιημένο περιεχόμενο κουίζ
### Μεταδεδομένα Μετάφρασης ### Μεταδεδομένα Μετάφρασης
@ -289,120 +289,120 @@ CO_OP_TRANSLATOR_METADATA:
--> -->
``` ```
## Αντιμετώπιση Σφαλμάτων και Επίλυση Προβλημάτων ## Αντιμετώπιση και Επίλυση Προβλημάτων
### Συνηθισμένα Προβλήματα ### Συνήθη Θέματα
**Το quiz app δεν ξεκινά**: **Η εφαρμογή Quiz δεν ξεκινά**:
- Ελέγξτε την έκδοση Node.js (συνιστάται v14+) - Ελέγξτε την έκδοση Node.js (συνιστάται v14+)
- Διαγράψτε τους φακέλους `node_modules` και το αρχείο `package-lock.json`, εκτελέστε ξανά `npm install` - Διαγράψτε `node_modules` και `package-lock.json`, εκτελέστε ξανά `npm install`
- Ελέγξτε για συγκρούσεις θυρών (ο προεπιλεγμένος Vite χρησιμοποιεί θύρα 5173) - Ελέγξτε για σύγκρουση θυρών (προεπιλογή: Vite χρησιμοποιεί θύρα 5173)
**Ο server του API δεν ξεκινά**: **Ο διακομιστής API δεν ξεκινά**:
- Βεβαιωθείτε ότι η έκδοση Node.js είναι >=10 - Επαληθεύστε ότι η έκδοση Node.js είναι ≥10
- Ελέγξτε αν θύρα είναι ήδη σε χρήση - Ελέγξτε αν η θύρα είναι ήδη σε χρήση
- Εξασφαλίστε ότι όλες οι εξαρτήσεις έχουν εγκατασταθεί με `npm install` - Βεβαιωθείτε ότι όλες οι εξαρτήσεις είναι εγκατεστημένες με `npm install`
**Η επέκταση περιηγητή δεν φορτώνει**: **Η επέκταση περιηγητή δεν φορτώνει**:
- Βεβαιωθείτε ότι το manifest.json είναι σωστά διαμορφωμένο - Επαληθεύστε ότι το manifest.json είναι σωστά μορφοποιημένο
- Ελέγξτε την κονσόλα του περιηγητή για σφάλματα - Ελέγξτε τα σφάλματα στην κονσόλα περιηγητή
- Ακολουθήστε τις οδηγίες εγκατάστασης για επεκτάσεις συγκεκριμένου περιηγητή - Ακολουθήστε τις οδηγίες εγκατάστασης για την επέκταση ανά περιηγητή
**Προβλήματα στο έργο συνομιλίας Python**: **Προβλήματα στο έργο συνομιλίας Python**:
- Εγκαταστήστε το πακέτο OpenAI: `pip install openai` - Βεβαιωθείτε ότι το πακέτο OpenAI είναι εγκατεστημένο: `pip install openai`
- Βεβαιωθείτε ότι το περιβάλλον μεταβλητής GITHUB_TOKEN είναι ρυθμισμένο - Επαληθεύστε ότι το περιβάλλον GITHUB_TOKEN έχει οριστεί
- Ελέγξτε τα δικαιώματα πρόσβασης στα GitHub Models - Ελέγξτε τα δικαιώματα πρόσβασης στα GitHub Models
**Το Docsify δεν εξυπηρετεί τεκμηρίωση**: **Η Docsify δεν σερβίρει τεκμηρίωση**:
- Εγκαταστήστε το docsify-cli παγκοσμίως: `npm install -g docsify-cli` - Εγκαταστήστε docsify-cli παγκοσμίως: `npm install -g docsify-cli`
- Εκτελέστε από το ριζικό φάκελο του αποθετηρίου - Εκτελέστε από την ρίζα του αποθετηρίου
- Βεβαιωθείτε ότι το αρχείο `docs/_sidebar.md` υπάρχει - Ελέγξτε ότι υπάρχει το αρχείο `docs/_sidebar.md`
### Συμβουλές Περιβάλλοντος Ανάπτυξης ### Συμβουλές Περιβάλλοντος Ανάπτυξης
- Χρησιμοποιήστε VS Code με την επέκταση Live Server για έργα HTML - Χρησιμοποιήστε VS Code με το Live Server extension για έργα HTML
- Εγκαταστήστε τις επεκτάσεις ESLint και Prettier για συνεπή μορφοποίηση - Εγκαταστήστε τις επεκτάσεις ESLint και Prettier για ομοιόμορφη μορφοποίηση
- Χρησιμοποιήστε τα εργαλεία ανάπτυξης του περιηγητή για αποσφαλμάτωση JavaScript - Χρησιμοποιήστε τα DevTools του περιηγητή για αποσφαλμάτωση JavaScript
- Για έργα Vue, εγκαταστήστε την επέκταση Vue DevTools στον περιηγητή - Για έργα Vue, εγκαταστήστε την επέκταση Vue DevTools για περιηγητές
### Θέματα Απόδοσης ### Θέματα Απόδοσης
- Ο μεγάλος αριθμός μεταφρασμένων αρχείων (πάνω από 50 γλώσσες) καθιστά τους πλήρεις κλώνους μεγάλους - Ο μεγάλος αριθμός μεταφρασμένων αρχείων (50+ γλώσσες) κάνει τα πλήρη κλωνοποιημένα αρχεία μεγάλα
- Χρησιμοποιήστε shallow clone αν εργάζεστε μόνο με περιεχόμενο: `git clone --depth 1` - Χρησιμοποιήστε επιφανειακό κλώνο αν εργάζεστε μόνο με το περιεχόμενο: `git clone --depth 1`
- Αποφύγετε τη συμπερίληψη μεταφράσεων σε αναζητήσεις όταν εργάζεστε σε αγγλικό περιεχόμενο - Εξαιρέστε τις μεταφράσεις από αναζητήσεις όταν δουλεύετε σε αγγλικό περιεχόμενο
- Οι διαδικασίες κατασκευής μπορεί να είναι αργές στην πρώτη εκτέλεση (npm install, Vite build) - Οι διαδικασίες κατασκευής μπορεί να είναι αργές στην πρώτη εκτέλεση (npm install, κατασκευή Vite)
## Θέματα Ασφαλείας ## Θέματα Ασφαλείας
### Περιβάλλον Μεταβλητών ### Μεταβλητές Περιβάλλοντος
- Τα κλειδιά API δεν πρέπει ποτέ να δεσμεύονται στο αποθετήριο - Τα κλειδιά API δεν πρέπει ποτέ να αποθηκεύονται στο αποθετήριο
- Χρησιμοποιήστε αρχεία `.env` (ήδη στο `.gitignore`) - Χρησιμοποιήστε αρχεία `.env` (ήδη στο `.gitignore`)
- Τεκμηριώστε τις απαιτούμενες περιβαλλοντικές μεταβλητές στα README των έργων - Καταγράψτε τις απαιτούμενες μεταβλητές περιβάλλοντος στα README των έργων
### Έργα Python ### Έργα Python
- Χρησιμοποιήστε εικονικά περιβάλλοντα: `python -m venv venv` - Χρησιμοποιήστε εικονικά περιβάλλοντα: `python -m venv venv`
- Κρατήστε τις εξαρτήσεις ενημερωμένες - Διατηρήστε τις εξαρτήσεις ενημερωμένες
- Τα tokens GitHub πρέπει να έχουν ελάχιστα απαιτούμενα δικαιώματα - Τα GitHub tokens πρέπει να έχουν τα ελάχιστα απαιτούμενα δικαιώματα
### Πρόσβαση στα GitHub Models ### Πρόσβαση σε GitHub Models
- Απαιτούνται Personal Access Tokens (PAT) - Απαιτούνται Personal Access Tokens (PAT) για GitHub Models
- Τα tokens πρέπει να αποθηκεύονται ως περιβάλλον μεταβλητές - Τα tokens πρέπει να αποθηκεύονται ως μεταβλητές περιβάλλοντος
- Ποτέ μην δεσμεύετε tokens ή διαπιστευτήρια - Ποτέ μην αποθηκεύετε tokens ή διαπιστευτήρια στο αποθετήριο
## Πρόσθετες Σημειώσεις ## Πρόσθετες Σημειώσεις
### Στοχευμένο Κοινό ### Στόχος Κοινού
- Απόλυτοι αρχάριοι στην ανάπτυξη ιστοσελίδων - Απόλυτα αρχάριοι στην ανάπτυξη ιστοσελίδων
- Μαθητές και αυτοδίδακτοι - Φοιτητές και αυτοδίδακτοι
- Εκπαιδευτικοί που χρησιμοποιούν το πρόγραμμα σε τάξεις - Εκπαιδευτικοί που χρησιμοποιούν το πρόγραμμα στην τάξη
- Το περιεχόμενο σχεδιάστηκε με προσβασιμότητα και σταδιακή ανάπτυξη δεξιοτήτων - Το περιεχόμενο σχεδιάστηκε για προσβασιμότητα και σταδιακή ανάπτυξη δεξιοτήτων
### Εκπαιδευτική Φιλοσοφία ### Εκπαιδευτική Φιλοσοφία
- Προσέγγιση μάθησης βασισμένη σε έργα - Προσέγγιση μάθησης βασισμένη σε έργα
- Συχνές αξιολογήσεις γνώσης (κουίζ) - Συχνές αξιολογήσεις γνώσεων (κουίζ)
- Πρακτικές ασκήσεις κώδικα - Πρακτικές ασκήσεις κωδικοποίησης
- Παραδείγματα εφαρμογών πραγματικού κόσμου - Παραδείγματα εφαρμογών πραγματικού κόσμου
- Εστίαση στα βασικά πριν τα πλαίσια εργασίας - Εστίαση στα βασικά πριν τα frameworks
### Συντήρηση Αποθετηρίου ### Διαχείριση Αποθετηρίου
- Ενεργή κοινότητα μαθητών και συνεργατών - Ενεργή κοινότητα μαθητών και συνεισφερόντων
- Τακτικές ενημερώσεις εξαρτήσεων και περιεχομένου - Τακτικές ενημερώσεις εξαρτήσεων και περιεχομένου
- Παρακολούθηση ζητημάτων και συζητήσεων από τους διαχειριστές - Παρακολούθηση ζητημάτων και συζητήσεων από συντηρητές
- Αυτόματες ενημερώσεις μεταφράσεων μέσω GitHub Actions - Αυτοματοποιημένες ενημερώσεις μεταφράσεων μέσω GitHub Actions
### Σχετικοί Πόροι ### Σχετικοί Πόροι
- [Microsoft Learn modules](https://docs.microsoft.com/learn/) - [Μονάδες Microsoft Learn](https://docs.microsoft.com/learn/)
- [Πόροι Student Hub](https://docs.microsoft.com/learn/student-hub/) - [Πόροι Student Hub](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) συνιστάται για μαθητές - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) συνιστάται για μαθητές
- Πρόσθετα μαθήματα: Generative AI, Data Science, ML, IoT curricula διαθέσιμα - Πρόσθετα μαθήματα: Γενετική ΤΝ, Επιστήμη Δεδομένων, ML, IoT διαθέσιμα
### Εργασία με Συγκεκριμένα Έργα ### Εργασία με Συγκεκριμένα Έργα
Για λεπτομερείς οδηγίες στα επιμέρους έργα, ανατρέξτε στα αρχεία README στα: Για λεπτομερείς οδηγίες για κάθε έργο, ανατρέξτε στα README αρχεία:
- `quiz-app/README.md` - Εφαρμογή quiz Vue 3 - `quiz-app/README.md` - Εφαρμογή quiz Vue 3
- `7-bank-project/README.md` - Εφαρμογή τραπεζικού με αυθεντικοποίηση - `7-bank-project/README.md` - Τραπεζική εφαρμογή με ταυτοποίηση
- `5-browser-extension/README.md` - Ανάπτυξη επέκτασης περιηγητή - `5-browser-extension/README.md` - Ανάπτυξη επέκτασης περιηγητή
- `6-space-game/README.md` - Ανάπτυξη παιχνιδιού με Canvas - `6-space-game/README.md` - Ανάπτυξη παιχνιδιού με καμβά
- `9-chat-project/README.md` - Έργο βοηθού συνομιλίας AI - `9-chat-project/README.md` - Έργο βοηθού συνομιλίας με ΤΝ
### Δομή Monorepo ### Δομή Monorepo
Αν και δεν είναι παραδοσιακό monorepo, αυτό το αποθετήριο περιέχει πολλαπλά ανεξάρτητα έργα: Αν και δεν είναι παραδοσιακό monorepo, αυτό το αποθετήριο περιέχει πολλαπλά ανεξάρτητα έργα:
- Κάθε μάθημα είναι αυτόνομο - Κάθε μάθημα είναι αυτόνομο
- Τα έργα δεν μοιράζονται εξαρτήσεις - Τα έργα δεν μοιράζονται εξαρτήσεις
- Μπορείτε να εργαστείτε σε μεμονωμένα έργα χωρίς να επηρεάζονται τα υπόλοιπα - Εργαστείτε σε μεμονωμένα έργα χωρίς να επηρεάζετε τα άλλα
- Κλωνοποιήστε ολόκληρο το repo για πλήρη εμπειρία προγράμματος - Κλωνοποιήστε ολόκληρο το αποθετήριο για πλήρη εμπειρία προγράμματος σπουδών
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Αποποίηση ευθυνών**: **Αποποίηση ευθυνών**:
Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας την υπηρεσία μετάφρασης με τεχνητή νοημοσύνη [Co-op Translator](https://github.com/Azure/co-op-translator). Παρόλο που προσπαθούμε για ακρίβεια, παρακαλούμε να γνωρίζετε ότι οι αυτοματοποιημένες μεταφράσεις μπορεί να περιέχουν λάθη ή ανακρίβειες. Το πρωτότυπο έγγραφο στη μητρική του γλώσσα πρέπει να θεωρείται η επίσημη πηγή. Για κρίσιμες πληροφορίες συνιστάται η επαγγελματική μετάφραση από ανθρώπους. Δεν φέρουμε ευθύνη για τυχόν παρεξηγήσεις ή λανθασμένες ερμηνείες που απορρέουν από τη χρήση αυτής της μετάφρασης. Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας την υπηρεσία αυτόματης μετάφρασης AI [Co-op Translator](https://github.com/Azure/co-op-translator). Παρόλο που προσπαθούμε για ακρίβεια, παρακαλούμε να γνωρίζετε ότι οι αυτοματοποιημένες μεταφράσεις μπορεί να περιέχουν σφάλματα ή ανακρίβειες. Το πρωτότυπο έγγραφο στη μητρική του γλώσσα πρέπει να θεωρείται η αυθεντική πηγή. Για κρίσιμες πληροφορίες, συνιστάται επαγγελματική ανθρώπινη μετάφραση. Δεν φέρουμε ευθύνη για οποιεσδήποτε παρερμηνείες ή παρανοήσεις προκύψουν από τη χρήση αυτής της μετάφρασης.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

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

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-04-06T18:38:38+00:00", "translation_date": "2026-04-20T16:32:07+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "sv" "language_code": "sv"
}, },

234
translations/sv/AGENTS.md
Unescape View File

@ -2,36 +2,36 @@
## Projektöversikt ## Projektöversikt
Detta är ett utbildningscurriculum-repository för att undervisa grundläggande webbutveckling för nybörjare. Curriculumet är en omfattande 12-veckors kurs 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 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.
### Viktiga komponenter ### Viktiga komponenter
- **Utbildningsinnehåll**: 24 strukturerade lektioner organiserade i projektbaserade moduler - **Utbildningsinnehåll**: 24 strukturerade lektioner organiserade i projektbaserade moduler
- **Praktiska projekt**: Terrarium, Typningsspel, Webbläsartillägg, Rymdspel, Bankapp, Kodredigerare och AI-chattassistent - **Praktiska projekt**: Terrarium, Skrivspel, Webbläsartillägg, Rymdspel, Bankapp, Kodredigerare och AI-chattassistent
- **Interaktiva quiz**: 48 quiz med 3 frågor vardera (före/efter lektion) - **Interaktiva quiz**: 48 quiz med 3 frågor vardera (före- och efter-lektionsbedömningar)
- **Fler språkstöd**: Automatiska översättningar till 50+ språk via GitHub Actions - **Flerspråkigt stöd**: Automatiska översättningar till 50+ språk via GitHub Actions
- **Teknologier**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (för AI-projekt) - **Teknologier**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (för AI-projekt)
### Arkitektur ### Arkitektur
- Utbildningsrepository med lektionbaserad struktur - Utbildningsrepository med lektionsbaserad struktur
- Varje lektionsmapp innehåller README, kodexempel och lösningar - Varje lektionsmapp innehåller README, kodexempel och lösningar
- Fristående projekt i separata kataloger (quiz-app, olika lektionsprojekt) - Självständiga projekt i separata kataloger (quiz-app, olika lektionsprojekt)
- Översättningssystem med GitHub Actions (co-op-translator) - Översättningssystem som använder GitHub Actions (co-op-translator)
- Dokumentation serveras via Docsify och finns som PDF - Dokumentation tillgänglig via Docsify och som PDF
## Installationskommandon ## Installationskommandon
Detta repository är huvudsakligen 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 arbete med specifika projekt:
### Huvudrepository Setup ### Huvudrepositoryinstallation
```bash ```bash
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners cd Web-Dev-For-Beginners
``` ```
### Quiz App Setup (Vue 3 + Vite) ### Quiz App Installation (Vue 3 + Vite)
```bash ```bash
cd quiz-app cd quiz-app
@ -72,7 +72,7 @@ npm install
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# Ställ in miljövariabeln GITHUB_TOKEN # Sätt miljövariabeln GITHUB_TOKEN
python api.py python api.py
``` ```
@ -80,29 +80,29 @@ python api.py
### För innehållsbidragare ### För innehållsbidragare
1. **Gaffla repositoryt** till ditt GitHub-konto 1. **Forka repositoryt** till ditt GitHub-konto
2. **Klona din gaffel** lokalt 2. **Klona din fork** lokalt
3. **Skapa en ny branch** för dina ändringar 3. **Skapa en ny branch** för dina ändringar
4. Gör ändringar i lektionsinnehåll eller kodexempel 4. Gör ändringar av lektioninnehåll eller kodexempel
5. Testa eventuella kodändringar i relevanta projektkataloger 5. Testa kodändringar i relevanta projektmappar
6. Skicka pull requests enligt riktlinjer för bidrag 6. Skicka pull requests enligt riktlinjerna för bidrag
### För elever ### För elever
1. Gaffla eller klona repositoryt 1. Forka eller klona repositoryt
2. Navigera sekventiellt till lektionskatalogerna 2. Navigera sekventiellt till lektionsmappar
3. Läs README-filer för varje lektion 3. Läs README-filer för varje lektion
4. Gör förlektion-quiz på https://ff-quizzes.netlify.app/web/ 4. Genomför quiz före lektioner på https://ff-quizzes.netlify.app/web/
5. Arbeta med kodexempel i lektionsmapparna 5. Arbeta igenom kodexempel i lektionsmappar
6. Slutför uppgifter och utmaningar 6. Slutför uppgifter och utmaningar
7. Gör efterlektion-quiz 7. Gör quiz efter lektioner
### Livsutveckling ### Live-utveckling
- **Dokumentation**: Kör `docsify serve` i root (port 3000) - **Dokumentation**: Kör `docsify serve` i rotmappen (port 3000)
- **Quiz App**: Kör `npm run dev` i quiz-app-mappen - **Quiz App**: Kör `npm run dev` i quiz-app-katalogen
- **Projekt**: Använd VS Code Live Server-extension för HTML-projekt - **Projekt**: Använd VS Code Live Server-tillägg för HTML-projekt
- **API-projekt**: Kör `npm start` i respektive API-kataloger - **API-projekt**: Kör `npm start` i respektive API-katalog
## Testinstruktioner ## Testinstruktioner
@ -111,7 +111,7 @@ python api.py
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Kontrollera kodstilproblem npm run lint # Kontrollera kodstilproblem
npm run build # Verifiera att byggnaden lyckas npm run build # Verifiera att kompilering lyckas
``` ```
### Bank API-testning ### Bank API-testning
@ -127,24 +127,24 @@ node server.js # Verifiera att servern startar utan fel
- Detta är ett utbildningsrepository utan omfattande automatiserade tester - Detta är ett utbildningsrepository utan omfattande automatiserade tester
- Manuell testning fokuserar på: - Manuell testning fokuserar på:
- Kodexempel körs utan fel - Kodexempel körs utan fel
- Länkar i dokumentationen fungerar korrekt - Länkar i dokumentation fungerar korrekt
- Projekt bygger klart utan fel - Projekt bygger klart utan problem
- Exempel följer bästa praxis - Exempel följer bästa praxis
### Kontroll före inskickning ### Kontroll före inskickning
- Kör `npm run lint` i kataloger med package.json - Kör `npm run lint` i kataloger med package.json
- Verifiera att alla markdownlänkar är giltiga - Verifiera att markdown-länkar är giltiga
- Testa kodexempel i webbläsare eller Node.js - Testa kodexempel i webbläsare eller Node.js
- Kontrollera att översättningar bibehåller korrekt struktur - Kontrollera att översättningar behåller korrekt struktur
## Kodstilriktlinjer ## Kodstilriktlinjer
### JavaScript ### JavaScript
- Använd modern ES6+-syntax - Använd modern ES6+ syntax
- Följ standard ESLint-konfigurationer i projekten - Följ standard ESLint-konfigurationer i projekten
- Använd meningsfulla variabel- och funktionsnamn för utbildningsklarhet - Använd meningsfulla variabel- och funktionsnamn för tydlighet i utbildningen
- Lägg till kommentarer som förklarar koncept för elever - Lägg till kommentarer som förklarar koncept för elever
- Formatera med Prettier där det är konfigurerat - Formatera med Prettier där det är konfigurerat
@ -152,19 +152,19 @@ node server.js # Verifiera att servern startar utan fel
- Semantiska HTML5-element - Semantiska HTML5-element
- Responsiva designprinciper - Responsiva designprinciper
- Tydliga klassnamngivningskonventioner - Klara och tydliga klassnamn
- Kommentarer som förklarar CSS-tekniker för elever - Kommentarer som förklarar CSS-tekniker för elever
### Python ### Python
- PEP 8-stilriktlinjer - Följ PEP 8-stilriktlinjer
- Tydliga, pedagogiska kodexempel - Tydliga, pedagogiska kodexempel
- Typanvisningar där det är hjälpsamt för lärandet - Typanvisningar där det är hjälpsamt för lärande
### Markdown-dokumentation ### Markdown-dokumentation
- Tydlig rubrikhierarki - Tydlig rubrikhierarki
- Kodblock med språkspecifikation - Kodblock med språkangivelse
- Länkar till ytterligare resurser - Länkar till ytterligare resurser
- Skärmdumpar och bilder i `images/`-mappar - Skärmdumpar och bilder i `images/`-mappar
- Alt-text för bilder för tillgänglighet - Alt-text för bilder för tillgänglighet
@ -172,28 +172,28 @@ node server.js # Verifiera att servern startar utan fel
### Filorganisation ### Filorganisation
- Lektioner numrerade sekventiellt (1-getting-started-lessons, 2-js-basics, etc.) - Lektioner numrerade sekventiellt (1-getting-started-lessons, 2-js-basics, etc.)
- Varje projekt har `solution/` och ofta `start/` eller `your-work/` kataloger - Varje projekt har `solution/` och ofta `start/` eller `your-work/`-mappar
- Bilder lagras i lektionsspecifika `images/`-mappar - Bilder lagras i lektion-specifika `images/`-mappar
- Översättningar i `translations/{language-code}/` struktur - Översättningar i `translations/{language-code}/`-struktur
## Bygg och distribution ## Bygg och distribution
### Quiz App Distribution (Azure Static Web Apps) ### Distribution av Quiz App (Azure Static Web Apps)
Quiz-appen är konfigurerad för Azure Static Web Apps-distribution: quiz-app är konfigurerad för deployment via Azure Static Web Apps:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Skapar mappen dist/ 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: Azure Static Web Apps-konfiguration:
- **App-läge**: `/quiz-app` - **App-lokalisation**: `/quiz-app`
- **Utmatningsplats**: `dist` - **Output-lokalisation**: `dist`
- **Arbetsflöde**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Arbetsflöde**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### Dokumentations-PDF-generering ### PDF-generering av dokumentation
```bash ```bash
npm install # Installera docsify-to-pdf npm install # Installera docsify-to-pdf
@ -207,11 +207,11 @@ npm install -g docsify-cli # Installera Docsify globalt
docsify serve # Servera på localhost:3000 docsify serve # Servera på localhost:3000
``` ```
### Projektspecifika byggprocesser ### Projekt-specifika byggprocesser
Varje projektkatalog kan ha egen byggprocess: Varje projektkatalog kan ha sin egen byggprocess:
- Vue-projekt: `npm run build` skapar produktionspaket - Vue-projekt: `npm run build` skapar produktionspaket
- Statisk projekt: Ingen byggsteg, servera filer direkt - Statiska projekt: Ingen byggsteg, servera filer direkt
## Pull Request-riktlinjer ## Pull Request-riktlinjer
@ -219,34 +219,34 @@ Varje projektkatalog kan ha egen byggprocess:
Använd tydliga, beskrivande titlar som anger ändringsområde: Använd tydliga, beskrivande titlar som anger ändringsområde:
- `[Quiz-app] Lägg till nytt quiz för lektion X` - `[Quiz-app] Lägg till nytt quiz för lektion X`
- `[Lesson-3] Rätta stavfel i terrariumprojekt` - `[Lesson-3] Åtgärda stavfel i terrariumprojekt`
- `[Translation] Lägg till spansk översättning för lektion 5` - `[Translation] Lägg till spansk översättning för lektion 5`
- `[Docs] Uppdatera installationsinstruktioner` - `[Docs] Uppdatera installationsinstruktioner`
### Obligatoriska kontroller ### Obligatoriska kontroller
Innan PR skickas in: Innan PR skickas:
1. **Kodkvalitet**: 1. **Kodkvalitet**:
- Kör `npm run lint` i berörda projektkataloger - Kör `npm run lint` i berörda projektmappar
- Fixa alla lint-fel och varningar - Åtgärda alla lintfel och varningar
2. **Byggverifiering**: 2. **Byggverifiering**:
- Kör `npm run build` om tillämpligt - Kör `npm run build` om tillämpligt
- Säkerställ inga byggfel - Säkerställ att inga byggfel uppstår
3. **Länkverifiering**: 3. **Länkvalidering**:
- Testa alla markdownlänkar - Testa alla markdown-länkar
- Kontrollera att bildreferenser fungerar - Verifiera bildreferenser fungerar
4. **Innehållsgranskning**: 4. **Innehållsgranskning**:
- Korrekturläs för stavning och grammatik - Korrekturläs för stavning och grammatik
- Säkerställ att kodexempel är korrekta och pedagogiska - Säkerställ kodexempel är korrekta och pedagogiska
- Verifiera att översättningar bevarar ursprungligt innehåll - Kontrollera att översättningar bevarar ursprungligt budskap
### Krav på bidrag ### Bidragskrav
- Godkänn Microsoft CLA (automatiskt vid första PR) - Acceptera Microsoft CLA (automatisk kontroll vid första PR)
- Följ [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - Följ [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- Se [CONTRIBUTING.md](./CONTRIBUTING.md) för detaljerade riktlinjer - Se [CONTRIBUTING.md](./CONTRIBUTING.md) för detaljerade riktlinjer
- Referera ärendenummer i PR-beskrivning om tillämpligt - Referera ärendenummer i PR-beskrivning om tillämpligt
@ -254,29 +254,29 @@ Innan PR skickas in:
### Granskningsprocess ### Granskningsprocess
- PR granskas av underhållare och community - PR granskas av underhållare och community
- Utbildningsklarhet prioriteras - Pedagogisk tydlighet prioriteras
- Kodexempel ska följa aktuella bästa praxis - Kodexempel ska följa aktuella bästa praxis
- Översättningar granskas för korrekthet och kulturell lämplighet - Översättningar granskas för korrekthet och kulturell anpassning
## Översättningssystem ## Översättningssystem
### Automatisk översättning ### Automatisk översättning
- Använder GitHub Actions med co-op-translator workflow - Använder GitHub Actions med co-op-translator arbetsflöde
- Översätter automatiskt till 50+ språk - Översätter automatiskt till 50+ språk
- Källfiler i huvudkataloger - Källfiler i huvudkataloger
- Översatta filer i `translations/{language-code}/` kataloger - Översatta filer i `translations/{language-code}/`-mappar
### Lägga till manuella förbättringar ### Lägga till manuella förbättringar
1. Lokalisera fil i `translations/{language-code}/` 1. Lokalisera fil i `translations/{language-code}/`
2. Gör förbättringar samtidigt som struktur bevaras 2. Gör förbättringar med bibehållen struktur
3. Säkerställ att kodexempel förblir fungerande 3. Säkerställ att kodexempel fortsätter att fungera
4. Testa eventuell lokaliserad quiz-innehåll 4. Testa lokaliserat quiz-innehåll
### Översättningsmetadata ### Metadata för översättningar
Översatta filer inkluderar metadataheader: Översatta filer inkluderar metadata-header:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -289,87 +289,87 @@ CO_OP_TRANSLATOR_METADATA:
--> -->
``` ```
## Felsökning och Problemlösning ## Felsökning och problemlösning
### Vanliga problem ### Vanliga problem
**Quiz app startar inte**: **Quiz app startar inte**:
- Kontrollera Node.js-version (v14+ rekommenderas) - Kontrollera Node.js-version (v14+ rekommenderas)
- Ta bort `node_modules` och `package-lock.json`, kör `npm install` igen - Ta bort `node_modules` och `package-lock.json`, kör `npm install` igen
- Kontrollera portkonflikter (default: Vite använder port 5173) - Kontrollera portkonflikter (standard: Vite använder port 5173)
**API-server startar inte**: **API-server startar inte**:
- Kontrollera Node.js-version uppfyller miniminivå (node >=10) - Verifiera att Node.js-version uppfyller minimikrav (node >=10)
- Kontrollera att port ej används av annat - Kontrollera om port redan används
- Säkerställ att alla beroenden är installerade med `npm install` - Se till att alla beroenden är installerade med `npm install`
**Webbläsartillägg laddas inte**: **Webbläsartillägg laddas inte**:
- Kontrollera att manifest.json är korrekt formaterad - Verifiera att manifest.json är korrekt formaterad
- Kolla webbläsarkonsolen för fel - Kontrollera webbläsarkonsol för fel
- Följ webbläsarspecifika installationsinstruktioner - Följ webbläsarspecifika installationsinstruktioner för tillägg
**Problem med Python chat-projekt**: **Problem med Python-chattprojekt**:
- Säkerställ att OpenAI-paket är installerat: `pip install openai` - Säkerställ att OpenAI-paket är installerat: `pip install openai`
- Verifiera att GITHUB_TOKEN miljövariabel är satt - Kontrollera att miljövariabeln GITHUB_TOKEN är satt
- Kontrollera GitHub Models-åtkomstbehörigheter - Kontrollera tillgång till GitHub Models
**Docsify serverar inte dokumentation**: **Docsify serverar inte dokumentation**:
- Installera docsify-cli globalt: `npm install -g docsify-cli` - Installera docsify-cli globalt: `npm install -g docsify-cli`
- Kör från repositoryts rotkatalog - Kör från repositories rotkatalog
- Kontrollera att `docs/_sidebar.md` finns - Kontrollera att `docs/_sidebar.md` finns
### Utvecklingsmiljötips ### Tips för utvecklingsmiljö
- Använd VS Code med Live Server-extension för HTML-projekt - Använd VS Code med Live Server-tillägg för HTML-projekt
- Installera ESLint- och Prettier-extensions för konsekvent formatering - Installera ESLint och Prettier-tillägg för konsekvent formatering
- Använd webbläsarens DevTools för JavaScript-felsökning - Använd webbläsarens utvecklarverktyg för att felsöka JavaScript
- För Vue-projekt, installera Vue DevTools-webbläsartillägg - För Vue-projekt, installera Vue DevTools webbläsartillägg
### Prestandabetraktelser ### Prestandaöverväganden
- Stort antal översatta filer (50+ språk) gör hela klon stora - Stort antal översatta filer (50+ språk) gör att fulla kloner blir stora
- Använd shallow clone om du bara jobbar med innehåll: `git clone --depth 1` - Använd shallow clone vid arbete enbart med innehåll: `git clone --depth 1`
- Exkludera översättningar från sökningar vid arbete med engelskt innehåll - Exkludera översättningar från sökningar vid arbete med engelskt innehåll
- Byggprocesser kan vara långsamma vid första körning (npm install, Vite build) - Byggprocesser kan vara långsamma vid första körning (npm install, Vite build)
## Säkerhetshänsyn ## Säkerhetsöverväganden
### Miljövariabler ### Miljövariabler
- API-nycklar ska aldrig committas till repository - API-nycklar ska aldrig committas till repositoryt
- Använd `.env`-filer (redan i `.gitignore`) - Använd `.env`-filer (är redan med i `.gitignore`)
- Dokumentera nödvändiga miljövariabler i projektens README-filer - Dokumentera nödvändiga miljövariabler i projekts README-filer
### Python-projekt ### Python-projekt
- Använd virtuella miljöer: `python -m venv venv` - Använd virtuella miljöer: `python -m venv venv`
- Håll beroenden uppdaterade - Håll beroenden uppdaterade
- GitHub-token bör ha minimala nödvändiga behörigheter - GitHub-token bör ha minimala tillåtna behörigheter
### GitHub Models-åtkomst ### GitHub Models access
- Personliga access tokens (PAT) krävs för GitHub Models - Personliga Access Tokens (PAT) krävs för GitHub Models
- Tokens ska sparas som miljövariabler - Tokens bör lagras som miljövariabler
- Commita aldrig tokens eller autentiseringsuppgifter - Aldrig commit tokens eller inloggningsuppgifter
## Ytterligare anmärkningar ## Ytterligare anteckningar
### Målgrupp ### Målgrupp
- Kompletta nybörjare inom webbutveckling - Kompletta nybörjare i webbutveckling
- Studenter och självstudenter - Studenter och självstudenter
- Lärare som använder curriculum i klassrum - Lärare som använder curriculum i klassrum
- Innehållet är utformat för tillgänglighet och gradvis färdighetsträning - Innehåll designat för tillgänglighet och gradvis kompetensuppbyggnad
### Pedagogisk filosofi ### Pedagogisk filosofi
- Projektbaserat lärande - Projektbaserat lärande
- Frekventa kunskapskontroller (quiz) - Frekventa kunskapskontroller (quiz)
- Praktiska programmeringsövningar - Praktiska kodningsövningar
- Verklighetsnära exempel - Exempel från verkliga applikationer
- Fokus på grunderna före ramverk - Fokus på grunder innan ramverk
### Underhåll av repository ### Repositoryunderhåll
- Aktiv community av elever och bidragsgivare - Aktiv community av elever och bidragsgivare
- Regelbundna uppdateringar av beroenden och innehåll - Regelbundna uppdateringar av beroenden och innehåll
@ -381,28 +381,28 @@ CO_OP_TRANSLATOR_METADATA:
- [Microsoft Learn-moduler](https://docs.microsoft.com/learn/) - [Microsoft Learn-moduler](https://docs.microsoft.com/learn/)
- [Student Hub-resurser](https://docs.microsoft.com/learn/student-hub/) - [Student Hub-resurser](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) rekommenderas för elever - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) rekommenderas för elever
- Ytterligare kurser: Generativ AI, Data Science, ML, IoT-curricula tillgängliga - Ytterligare kurser: Generativ AI, Data Science, ML, IoT curriculum tillgängliga
### Arbeta med specifika projekt ### Arbeta med specifika projekt
För detaljerade instruktioner om enskilda projekt, se README-filer i: För detaljerade instruktioner om individuella projekt, se README-filer i:
- `quiz-app/README.md` - Vue 3 quiz-applikation - `quiz-app/README.md` - Vue 3 quizapplikation
- `7-bank-project/README.md` - Bankapplikation med autentisering - `7-bank-project/README.md` - Bankapplikation med autentisering
- `5-browser-extension/README.md` - Utveckling av webbläsartillägg - `5-browser-extension/README.md` - Webbläsartilläggsutveckling
- `6-space-game/README.md` - Canvasbaserat spelutveckling - `6-space-game/README.md` - Canvas-baserat spel
- `9-chat-project/README.md` - AI-chattassistentprojekt - `9-chat-project/README.md` - AI-chattassistentprojekt
### Monorepo-struktur ### Monorepo-struktur
Även om detta inte är ett traditionellt monorepo, innehåller detta repository flera oberoende projekt: Även om det inte är ett traditionellt monorepo innehåller detta repository flera oberoende projekt:
- Varje lektion är självständig - Varje lektion är självständig
- Projekt delar inte beroenden - Projekt delar inte beroenden
- Arbeta med enskilda projekt utan att påverka andra - Arbeta med individuella projekt utan påverkan på andra
- Klona hela repo för fullständig curriculumupplevelse - Klona hela repositoryt för hela curriculum-upplevelsen
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Ansvarsfriskrivning**: **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 observera att automatiska översättningar kan innehålla fel eller unøyaktigheter. Det ursprungliga dokumentet på dess ursprungliga språ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. 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.
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->

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

@ -493,7 +493,7 @@
}, },
"AGENTS.md": { "AGENTS.md": {
"original_hash": "a362efd06d64d4134a0cfe8515a86d34", "original_hash": "a362efd06d64d4134a0cfe8515a86d34",
"translation_date": "2026-04-06T18:37:35+00:00", "translation_date": "2026-04-20T16:30:58+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "th" "language_code": "th"
}, },

324
translations/th/AGENTS.md
Unescape View File

@ -2,27 +2,27 @@
## ภาพรวมของโครงการ ## ภาพรวมของโครงการ
นี่คือที่เก็บหลักสูตรการศึกษาเพื่อสอนพื้นฐานการพัฒนาเว็บสำหรับผู้เริ่มต้น หลักสูตรนี้เป็นคอร์ส 12 สัปดาห์ที่ครอบคลุมพัฒนาโดย Microsoft Cloud Advocates มีบทเรียนเชิงปฏิบัติ 24 บทที่ครอบคลุม JavaScript, CSS และ HTML นี่คือที่เก็บหลักสูตรการศึกษาสำหรับการสอนพื้นฐานการพัฒนาเว็บสำหรับผู้เริ่มต้น หลักสูตรนี้เป็นหลักสูตรครบวงจร 12 สัปดาห์ที่พัฒนาโดย Microsoft Cloud Advocates ซึ่งประกอบด้วยบทเรียนลงมือทำทั้งหมด 24 บทเรียนที่ครอบคลุม JavaScript, CSS และ HTML
### ส่วนประกอบสำคัญ ### ส่วนประกอบหลัก
- **เนื้อหาการศึกษา**: บทเรียนที่มีโครงสร้าง 24 บท จัดเป็นโมดูลตามโปรเจกต์ - **เนื้อหาการศึกษา**: บทเรียนที่มีโครงสร้าง 24 บทเรียน จัดเป็นโมดูลตามโครงการ
- **โปรเจกต์เชิงปฏิบัติ**: Terrarium, เกมพิมพ์, ส่วนขยายเบราว์เซอร์, เกมอวกาศ, แอปธนาคาร, ตัวแก้ไขโค้ด และผู้ช่วยแชท AI - **โครงการเชิงปฏิบัติ**: Terrarium, เกมพิมพ์ดีด, ส่วนขยายเบราว์เซอร์, เกมอวกาศ, แอปธนาคาร, ตัวแก้ไขโค้ด และผู้ช่วยแชท AI
- **แบบทดสอบเชิงโต้ตอบ**: แบบทดสอบ 48 ชุด แต่ละชุดมี 3 คำถาม (ก่อนและหลังบทเรียน) - **แบบทดสอบเชิงโต้ตอบ**: แบบทดสอบ 48 ชุด โดยแต่ละชุดมี 3 คำถาม (สำหรับประเมินก่อนและหลังบทเรียน)
- **รองรับหลายภาษา**: การแปลอัตโนมัติสำหรับกว่า 50 ภาษาโดยใช้ GitHub Actions - **รองรับหลายภาษา**: การแปลอัตโนมัติสำหรับมากกว่า 50 ภาษา ผ่าน GitHub Actions
- **เทคโนโลยี**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (สำหรับโปรเจกต์ AI) - **เทคโนโลยี**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (สำหรับโครงการ AI)
### สถาปัตยกรรม ### สถาปัตยกรรม
- ที่เก็บข้อมูลเพื่อการศึกษาโดยมีโครงสร้างตามบทเรียน - ที่เก็บการศึกษาที่มีโครงสร้างตามบทเรียน
- โฟลเดอร์บทเรียนแต่ละอันมี README, ตัวอย่างโค้ด และวิธีแก้ไข - โฟลเดอร์แต่ละบทเรียนประกอบด้วย README, ตัวอย่างโค้ด และคำตอบ
- โปรเจกต์แยกในไดเรกทอรีแยกต่างหาก (quiz-app, โปรเจกต์บทเรียนต่างๆ) - โครงการแยกต่างหากในไดเรกทอรีต่างหาก (quiz-app, โครงการบทเรียนต่างๆ)
- ระบบแปลโดยใช้ GitHub Actions (co-op-translator) - ระบบแปลโดยใช้ GitHub Actions (co-op-translator)
- เอกสารให้บริการผ่าน Docsify และมีให้ดาวน์โหลดเป็น PDF - เอกสารให้บริการผ่าน Docsify และมีในรูปแบบ PDF
## คำสั่งตั้งค่า ## คำสั่งการตั้งค่า
ที่เก็บนี้เน้นสำหรับการบริโภคเนื้อหาการศึกษาเป็นหลัก สำหรับการทำงานกับโปรเจกต์เฉพาะ: ที่เก็บนี้สำหรับการบริโภคเนื้อหาการศึกษาหลัก สำหรับการทำงานกับโครงการเฉพาะ:
### การตั้งค่าที่เก็บหลัก ### การตั้งค่าที่เก็บหลัก
@ -38,36 +38,36 @@ cd quiz-app
npm install npm install
npm run dev # เริ่มเซิร์ฟเวอร์พัฒนา npm run dev # เริ่มเซิร์ฟเวอร์พัฒนา
npm run build # สร้างสำหรับการผลิต npm run build # สร้างสำหรับการผลิต
npm run lint # ใช้ ESLint npm run lint # รัน ESLint
``` ```
### โครงการธนาคาร API (Node.js + Express) ### Bank Project API (Node.js + Express)
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm install npm install
npm start # เริ่มเซิร์ฟเวอร์ API npm start # เริ่มต้นเซิร์ฟเวอร์ API
npm run lint # รัน ESLint npm run lint # รัน ESLint
npm run format # จัดรูปแบบด้วย Prettier npm run format # จัดรูปแบบด้วย Prettier
``` ```
### โปรเจกต์ส่วนขยายเบราว์เซอร์ ### โครงการส่วนขยายเบราว์เซอร์
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
npm install npm install
# ปฏิบัติตามคำแนะนำการโหลดส่วนขยายเฉพาะเบราว์เซอร์ # ปฏิบัติตามคำแนะนำการโหลดส่วนขยายเฉพาะของเบราว์เซอร์
``` ```
### โปรเจกต์เกมอวกาศ ### โครงการเกมอวกาศ
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
npm install npm install
# เปิดไฟล์ index.html ในเบราว์เซอร์หรือใช้ Live Server # เปิดไฟล์ index.html ในเบราว์เซอร์หรืใช้ Live Server
``` ```
### โปรเจกต์แชท (Python Backend) ### โครงการแชท (Backend Python)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
@ -76,33 +76,33 @@ pip install openai
python api.py python api.py
``` ```
## เวิร์กโฟลว์การพัฒนา ## ขั้นตอนการพัฒนา
### สำหรับผู้มีส่วนร่วมเนื้อหา ### สำหรับผู้ร่วมสร้างเนื้อหา
1. **Fork ที่เก็บ** ไปยังบัญชี GitHub ของคุณ 1. **Fork ที่เก็บนี้** ไปยังบัญชี GitHub ของคุณ
2. **Clone fork ของคุณ** มายังเครื่องท้องถิ่น 2. **โคลน fork ของคุณ** ลงในเครื่อง
3. **สร้างสาขาใหม่** สำหรับการเปลี่ยนแปลงของคุณ 3. **สร้างสาขาใหม่** สำหรับการเปลี่ยนแปลงของคุณ
4. แก้ไขเนื้อหาบทเรียนหรือตัวอย่างโค้ด 4. ทำการเปลี่ยนแปลงเนื้อหาบทเรียนหรือโค้ดตัวอย่าง
5. ทดสอบการเปลี่ยนแปลงโค้ดในไดเรกทอรีโปรเจกต์ที่เกี่ยวข้อง 5. ทดสอบการเปลี่ยนแปลงโค้ดในไดเรกทอรีโครงการที่เกี่ยวข้อง
6. ส่ง pull request ตามแนวทางการมีส่วนร่วม 6. ส่ง pull request ตามแนวทางการร่วมมือ
### สำหรับผู้เรียน ### สำหรับผู้เรียน
1. Fork หรือ clone ที่เก็บ 1. Fork หรือโคลนที่เก็บนี้
2. ไปที่ไดเรกทอรีบทเรียนตามลำดับ 2. ไปยังไดเรกทอรีบทเรียนตามลำดับ
3. อ่านไฟล์ README ของแต่ละบทเรียน 3. อ่านไฟล์ README สำหรับแต่ละบทเรียน
4. ทำแบบทดสอบก่อนบทเรียนที่ https://ff-quizzes.netlify.app/web/ 4. ทำแบบทดสอบก่อนบทเรียนที่ https://ff-quizzes.netlify.app/web/
5. ทำงานผ่านตัวอย่างโค้ดในโฟลเดอร์บทเรียน 5. ทำงานกับตัวอย่างโค้ดในโฟลเดอร์บทเรียน
6. ทำแบบฝึกหัดและความท้าทายให้ครบ 6. ทำแบบฝึกหัดและความท้าทายให้เสร็จ
7. ทำแบบทดสอบหลังบทเรียน 7. ทำแบบทดสอบหลังบทเรียน
### การพัฒนาแบบสด ### การพัฒนาแบบสด
- **เอกสาร**: รัน `docsify serve` ในรากของที่เก็บ (พอร์ต 3000) - **เอกสาร**: รัน `docsify serve` ที่รากโปรเจ็ค (พอร์ต 3000)
- **Quiz App**: รัน `npm run dev` ในไดเรกทอรี quiz-app - **Quiz App**: รัน `npm run dev` ในไดเรกทอรี quiz-app
- **โปรเจกต์**: ใช้ส่วนขยาย VS Code Live Server สำหรับโปรเจก HTML - **โครงการ**: ใช้ส่วนขยาย VS Code Live Server สำหรับโครงการ HTML
- **โปรเจกต์ API**: รัน `npm start` ในไดเรกทอรี API ที่เกี่ยวข้อง - **โครงการ API**: รัน `npm start` ในไดเรกทอรี API ตามลำดับ
## คำแนะนำการทดสอบ ## คำแนะนำการทดสอบ
@ -110,8 +110,8 @@ python api.py
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # ตรวจสอบข้อผิดพลาดของสไตล์โค้ด npm run lint # ตรวจสอบปัญหาสไตล์โค้ด
npm run build # ยืนยันการสร้างสำเร็จ npm run build # ตรวจสอบการสร้างให้สำเร็จ
``` ```
### การทดสอบ Bank API ### การทดสอบ Bank API
@ -119,73 +119,73 @@ npm run build # ยืนยันการสร้างสำเร็
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # ตรวจสอบปัญหาสไตล์โค้ด npm run lint # ตรวจสอบปัญหาสไตล์โค้ด
node server.js # ตรวจสอบว่าเซิร์ฟเวอร์เริ่มทำงานโดยไม่มีข้อผิดพลาด node server.js # ยืนยันว่าเซิร์ฟเวอร์เริ่มทำงานโดยไม่มีข้อผิดพลาด
``` ```
### แนวทางการทดสอบทั่วไป ### แนวทางการทดสอบทั่วไป
- ที่เก็บนี้เป็นเพื่อการศึกษา ไม่มีการทดสอบอัตโนมัติครบถ้วน - ที่เก็บนี้เป็นที่เก็บการศึกษาโดยไม่มีการทดสอบอัตโนมัติครบถ้วน
- การทดสอบด้วยมือเน้นที่: - การทดสอบด้วยตนเองเน้นที่:
- ตัวอย่างโค้ดทำงานโดยไม่มีข้อผิดพลาด - ตัวอย่างโค้ดทำงานได้โดยไม่มีข้อผิดพลาด
- ลิงก์ในเอกสารทำงานได้ถูกต้อง - ลิงก์ในเอกสารทำงานอย่างถูกต้อง
- การสร้างโปรเจกต์เสร็จสมบูรณ์ - การสร้างโครงการสำเร็จ
- ตัวอย่างปฏิบัติตามแนวทางที่ดีที่สุด - ตัวอย่างทำตามแนวปฏิบัติที่ดีที่สุด
### การตรวจสอบก่อนส่ง ### การตรวจสอบก่อนส่ง
- รัน `npm run lint` ในไดเรกทอรีที่มี package.json - รัน `npm run lint` ในไดเรกทอรีที่มี package.json
- ตรวจสอบลิงก์ markdown ว่าถูกต้อง - ตรวจสอบลิงก์ markdown ว่าถูกต้อง
- ทดสอบตัวอย่างโค้ดในเบราว์เซอร์หรือ Node.js - ทดสอบตัวอย่างโค้ดในเบราว์เซอร์หรือ Node.js
- ตรวจสอบว่าแปลยังคงโครงสร้างถูกต้อง - ตรวจสอบว่าการแปลรักษาโครงสร้างที่ถูกต้อง
## แนวทางสไตล์โค้ด ## แนวทางสไตล์โค้ด
### JavaScript ### JavaScript
- ใช้ไวยากรณ์ ES6+ สมัยใหม่ - ใช้ไวยากรณ์ ES6+ สมัยใหม่
- ปฏิบัติตามการตั้งค่า ESLint มาตรฐานที่จัดไว้ในโปรเจกต์ - ปฏิบัติตามการตั้งค่า ESLint มาตรฐานในโครงการ
- ใช้ชื่อตัวแปรและฟังก์ชันที่มีความหมายเพื่อความชัดเจนด้านการศึกษา - ใช้ชื่อตัวแปรและฟังก์ชันที่มีความหมายเพื่อความชัดเจนทางการศึกษา
- เพิ่มคอมเมนต์อธิบายแนวคิดสำหรับผู้เรียน - เพิ่มคอมเมนต์อธิบายแนวคิดสำหรับผู้เรียน
- จัดรูปแบบด้วย Prettier ตามการตั้งค่าที่กำหนด - ฟอร์แมตโดยใช้ Prettier เมื่อมีการตั้งค่า
### HTML/CSS ### HTML/CSS
- ใช้องค์ประกอบ HTML5 อย่างมีความหมาย - ใช้องค์ประกอบ HTML5 ตามความหมาย
- หลักการออกแบบตอบสนอง (responsive) - หลักการออกแบบตอบสนอง (Responsive)
- การตั้งชื่อคลาสที่ชัดเจน - กฎการตั้งชื่อตัวแปรคลาสที่ชัดเจน
- คอมเมนต์อธิบายเทคนิค CSS สำหรับผู้เรียน - คอมเมนต์อธิบายเทคนิค CSS สำหรับผู้เรียน
### Python ### Python
- ปฏิบัติตามแนวทางสไตล์ PEP 8 - ปฏิบัติตามแนวทางสไตล์ PEP 8
- ตัวอย่างโค้ดที่ชัดเจนและเน้นการสอน - ตัวอย่างโค้ดที่ชัดเจนและเน้นการศึกษา
- ใช้ type hints เมื่อเหมาะสมเพื่อช่วยการเรียนรู้ - ใช้ type hint เมื่อช่วยให้เรียนรู้ได้ดีขึ้น
### เอกสาร Markdown ### เอกสาร Markdown
- โครงสร้างหัวข้อชัดเจน - ลำดับหัวข้อชัดเจน
- บล็อกโค้ดระบุภาษาชัดเจน - บล็อกโค้ดพร้อมระบุภาษา
- ลิงก์ไปยังแหล่งข้อมูลเพิ่มเติม - ลิงก์ไปยังแหล่งข้อมูลเพิ่มเติม
- สกรีนช็อตและรูปภาพในโฟลเดอร์ `images/` - ภาพหน้าจอและรูปภาพในโฟลเดอร์ `images/`
- ใช้ข้อความ alt สำหรับรูปภาพเพื่อการเข้าถึง - ข้อความ alt ของภาพเพื่อการเข้าถึง
### การจัดระเบียบไฟล์ ### การจัดระเบียบไฟล์
- บทเรียนเรียงตามหมายเลข (1-getting-started-lessons, 2-js-basics, ฯลฯ) - บทเรียนเรียงหมายเลข (1-getting-started-lessons, 2-js-basics, เป็นต้น)
- โปรเจกต์แต่ละอันมีไดเรกทอรี `solution/` และบ่อยครั้งมี `start/` หรือ `your-work/` - โครงการแต่ละอันมีไดเรกทอรี `solution/` และมักมี `start/` หรือ `your-work/`
- รูปภาพเก็บในโฟลเดอร์ `images/` ของแต่ละบทเรียน - รูปภาพเก็บในโฟลเดอร์ `images/` ที่เฉพาะเจาะจงกับบทเรียน
- ไฟล์แปลในโครงสร้าง `translations/{language-code}/` - การแปลอยู่ในโครงสร้าง `translations/{language-code}/`
## การสร้างและการปรับใช้ ## การสร้างและปรับใช้
### การปรับใช้ Quiz App (Azure Static Web Apps) ### การปรับใช้ Quiz App (Azure Static Web Apps)
quiz-app ถูกตั้งค่าสำหรับการปรับใช้ใน Azure Static Web Apps: quiz-app ถูกตั้งค่าสำหรับการปรับใช้กับ Azure Static Web Apps:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # สร้างโฟลเดอร์ dist/ npm run build # สร้างโฟลเดอร์ dist/
# ดีพลอยผ่าน GitHub Actions workflow เมื่อมีการ push ไปยัง main # ดีพลอยผ่าน workflow ของ GitHub Actions เมื่อ push ไปที่ main
``` ```
การตั้งค่า Azure Static Web Apps: การตั้งค่า Azure Static Web Apps:
@ -193,7 +193,7 @@ npm run build # สร้างโฟลเดอร์ dist/
- **ตำแหน่งผลลัพธ์**: `dist` - **ตำแหน่งผลลัพธ์**: `dist`
- **เวิร์กโฟลว์**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **เวิร์กโฟลว์**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### การสร้างเอกสาร PDF ### การสร้างไฟล์เอกสาร PDF
```bash ```bash
npm install # ติดตั้ง docsify-to-pdf npm install # ติดตั้ง docsify-to-pdf
@ -204,79 +204,79 @@ npm run convert # สร้าง PDF จาก docs
```bash ```bash
npm install -g docsify-cli # ติดตั้ง Docsify ทั่วระบบ npm install -g docsify-cli # ติดตั้ง Docsify ทั่วระบบ
docsify serve # ให้บริการบน localhost:3000 docsify serve # ให้บริการที่ localhost:3000
``` ```
### การสร้างโปรเจกต์เฉพาะ ### การสร้างเฉพาะโครงการ
แต่ละไดเรกทอรีโปรเจกต์อาจมีขั้นตอนการสร้างของตัวเอง: แต่ละไดเรกทอรีโครงการอาจมีขั้นตอนการสร้างของตัวเอง:
- โปรเจกต์ Vue: รัน `npm run build` เพื่อสร้างโปรดักชันบันเดิล - โครงการ Vue: `npm run build` สร้าง bundle สำหรับโปรดักชัน
- โปรเจกต์สแตติก: ไม่มีขั้นตอนสร้าง ให้เสิร์ฟไฟล์โดยตรง - โครงการสแตติก: ไม่มีขั้นตอนการสร้าง ให้บริการไฟล์โดยตรง
## แนวทางสำหรับ Pull Request ## แนวทางในการส่ง Pull Request
### รูปแบบชื่อหัวข้อ ### รูปแบบชื่อเรื่อง
ใช้หัวข้อที่ชัดเจนและบ่งชี้ส่วนที่เปลี่ยนแปลง: ใช้ชื่อเรื่องที่ชัดเจนและบอกบริเวณการเปลี่ยนแปลง:
- `[Quiz-app] เพิ่มแบบทดสอบใหม่สำหรับบทเรียน X` - `[Quiz-app] เพิ่มแบบทดสอบใหม่สำหรับบทเรียน X`
- `[Lesson-3] แก้ไขการพิมพ์ในโปรเจกต์ terrarium` - `[Lesson-3] แก้ไขคำผิดในโครงการ terrarium`
- `[Translation] เพิ่มการแปลภาษาสเปนสำหรับบทเรียน 5` - `[Translation] เพิ่มการแปลภาษาสเปนสำหรับบทเรียน 5`
- `[Docs] อัปเดตคำแนะนำการตั้งค่า` - `[Docs] ปรับปรุงคำแนะนำการตั้งค่า`
### การตรวจสอบที่จำเป็น ### การตรวจสอบที่จำเป็น
ก่อนส่ง PR: ก่อนส่ง PR:
1. **คุณภาพโค้ด**: 1. **คุณภาพโค้ด**:
- รัน `npm run lint` ในไดเรกทอรีโปรเจกต์ที่เกี่ยวข้อง - รัน `npm run lint` ในไดเรกทอรีโครงการที่ได้รับผลกระทบ
- แก้ไขข้อผิดพลาดและคำเตือนทั้งหมด - แก้ไขข้อผิดพลาดและคำเตือนทั้งหมด
2. **การตรวจสอบการสร้าง**: 2. **ตรวจสอบการสร้าง**:
- รัน `npm run build` หากมี - รัน `npm run build` ถ้ามี
- ยืนยันว่าไม่มีข้อผิดพลาดในการสร้าง - ตรวจสอบว่าไม่มีข้อผิดพลาดจากการสร้าง
3. **การตรวจสอบลิงก์**: 3. **ตรวจสอบลิงก์**:
- ทดสอบลิงก์ markdown ทั้งหมด - ทดสอบลิงก์ markdown ทั้งหมด
- ตรวจสอบลิงก์รูปภาพทำงาน - ตรวจสอบการอ้างอิงภาพว่าใช้งานได้
4. **การตรวจทานเนื้อหา**: 4. **ตรวจสอบเนื้อหา**:
- ตรวจสอบการสะกดและไวยากรณ์ - ตรวจทานคำสะกดและไวยากรณ์
- ยืนยันว่าตัวอย่างโค้ดถูกต้องและเหมาะแก่การเรียนการสอน - ตรวจสอบตัวอย่างโค้ดว่าถูกต้องและเหมาะสมสำหรับการศึกษา
- ตรวจสอบว่าการแปลยังคงความหมายต้นฉบับ - ตรวจสอบว่าแปลถูกต้องและรักษาความหมายต้นฉบับ
### ข้อกำหนดการมีส่วนร่วม ### ข้อกำหนดการมีส่วนร่วม
- ยอมรับ Microsoft CLA (ตรวจสอบอัตโนมัติใน PR แรก) - ยอมรับ Microsoft CLA (ตรวจสอบอัตโนมัติใน PR แรก)
- ปฏิบัติตาม [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) - ปฏิบัติตาม [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/)
- ดู [CONTRIBUTING.md](./CONTRIBUTING.md) สำหรับแนวทางโดยละเอียด - ดู [CONTRIBUTING.md](./CONTRIBUTING.md) สำหรับแนวทางรายละเอียด
- อ้างอิงหมายเลข issue ในคำอธิบาย PR หากเกี่ยวข้อง - อ้างถึงหมายเลข issue ในคำอธิบาย PR หากเกี่ยวข้อง
### กระบวนการทบทวน ### กระบวนการตรวจสอบ
- PR จะได้รับการทบทวนโดยผู้ดูแลและชุมชน - PR ถูกตรวจสอบโดยผู้ดูแลและชุมชน
- ใส่ใจเรื่องความชัดเจนทางการศึกษาเป็นอันดับแรก - เน้นความชัดเจนทางการศึกษาเป็นสำคัญ
- ตัวอย่างโค้ดควรเป็นไปตามแนวทางปฏิบัติที่ดีที่สุดปัจจุบัน - ตัวอย่างโค้ดควรเป็นไปตามแนวปฏิบัติที่ดีที่สุดปัจจุบัน
- การแปลตรวจสอบความแม่นยำและเหมาะสมทางวัฒนธรรม - การแปลต้องได้รับการตรวจสอบว่าถูกต้องและเหมาะสมทางวัฒนธรรม
## ระบบแปลภาษา ## ระบบแปลภาษา
### การแปลอัตโนมัติ ### การแปลอัตโนมัติ
- ใช้ GitHub Actions กับเวิร์กโฟลว์ co-op-translator - ใช้ GitHub Actions กับเวิร์กโฟลว์ co-op-translator
- แปลเป็น 50+ ภาษาโดยอัตโนมัติ - แปลอัตโนมัติเป็นกว่า 50 ภาษา
- ไฟล์ต้นฉบับในไดเรกทอรีหลัก - ไฟล์ต้นทางในไดเรกทอรีหลัก
- ไฟล์แปลในโครงสร้าง `translations/{language-code}/` - ไฟล์แปลในโครงสร้าง `translations/{language-code}/`
### การเพิ่มการแปลด้วยมือ ### การเพิ่มคุณภาพการแปลด้วยตนเอง
1. ค้นหาไฟล์ใน `translations/{language-code}/` 1. ค้นหาไฟล์ใน `translations/{language-code}/`
2. ปรับปรุงพร้อมคงโครงสร้างเดิม 2. ปรับปรุงโดยรักษาโครงสร้างเดิม
3. แน่ใจว่าตัวอย่างโค้ดยังใช้งานได้ 3. ตรวจสอบว่าตัวอย่างโค้ดยังทำงานได้
4. ทดสอบเนื้อหาแบบทดสอบท้องถิ่น 4. ทดสอบเนื้อหาแบบทดสอบในท้องถิ่น
### เมตาดาต้าการแปล ### เมตาดาต้าแปลภาษา
ไฟล์แปลประกอบด้วยส่วนหัวเมตาดาต้า: ไฟล์แปลจะมีส่วนหัว metadata:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -289,120 +289,120 @@ CO_OP_TRANSLATOR_METADATA:
--> -->
``` ```
## การแก้ไขปัญหาและการดีบัก ## การดีบักและแก้ปัญหา
### ปัญหาทั่วไป ### ปัญหาทั่วไป
**แอปแบบทดสอบไม่เริ่มทำงาน**: **แอปแบบทดสอบไม่เริ่มทำงาน**:
- ตรวจสอบเวอร์ชัน Node.js (แนะนำ v14+) - ตรวจสอบเวอร์ชัน Node.js (แนะนำ v14+)
- ลบ `node_modules` และ `package-lock.json` แล้วรัน `npm install` อีกครั้ง - ลบ `node_modules` และ `package-lock.json` แล้วรัน `npm install` ใหม่
- ตรวจสอบความขัดแย้งของพอร์ต (พอร์ตเริ่มต้น: Vite ใช้ 5173) - ตรวจสอบพอร์ตว่าง (ค่าเริ่มต้น: Vite ใช้พอร์ต 5173)
**เซิร์ฟเวอร์ API ไม่เริ่มทำงาน**: **เซิร์ฟเวอร์ API ไม่เริ่มทำงาน**:
- ตรวจสอบว่ามีเวอร์ชัน Node.js ขั้นต่ำ (node >=10) - ตรวจสอบเวอร์ชัน Node.js ให้เป็นไปตามขั้นต่ำ (node >=10)
- ตรวจสอบว่าพอร์ตยังว่างอยู่ - ตรวจสอบว่าพอร์ทยังว่างอยู่
- ยืนยันว่าติดตั้ง dependencies ด้วย `npm install` ครบถ้วน - ติดตั้ง dependencies ทั้งหมดด้วย `npm install`
**ส่วนขยายเบราว์เซอร์ไม่โหลด**: **ส่วนขยายเบราว์เซอร์ไม่โหลด**:
- ตรวจสอบไฟล์ manifest.json ว่าถูกต้อง - ตรวจสอบว่า manifest.json ถูกฟอร์แมตอย่างถูกต้อง
- ดูคอนโซลเบราว์เซอร์เพื่อตรวจหาข้อผิดพลาด - ดูข้อผิดพลาดในคอนโซลเบราว์เซอร์
- ปฏิบัติตามคำแนะนำการติดตั้งส่วนขยายเฉพาะเบราว์เซอร์ - ปฏิบัติตามคำแนะนำการติดตั้งของเบราว์เซอร์แต่ละตัว
**ปัญหาโปรเจกต์แชท Python**: **ปัญหาโครงการแชท Python**:
- ติดตั้งแพ็กเกจ OpenAI: `pip install openai` - ตรวจสอบว่าติดตั้งแพ็กเกจ OpenAI แล้ว: `pip install openai`
- ตรวจสอบว่าตัวแปรสภาพแวดล้อม GITHUB_TOKEN ถูกตั้ง - ตรวจสอบว่าตัวแปรสภาพแวดล้อม GITHUB_TOKEN ถูกตั้งค่าแล้ว
- ตรวจสอบสิทธิ์การเข้าถึง GitHub Models - ตรวจสอบสิทธิ์การเข้าถึงโมเดล GitHub
**Docsify ไม่เสิร์ฟเอกสาร**: **Docsify ไม่ให้บริการเอกสาร**:
- ติดตั้ง docsify-cli ทั่วโลก: `npm install -g docsify-cli` - ติดตั้ง docsify-cli ทั่วไป: `npm install -g docsify-cli`
- รันจากไดเรกทอรีรากของที่เก็บ - รันจากไดเรกทอรีรากของที่เก็บนี้
- ตรวจสอบว่า `docs/_sidebar.md` มีอยู่ - ตรวจสอบว่าไฟล์ `docs/_sidebar.md` มีอยู่
### เคล็ดลับสภาพแวดล้อมการพัฒนา ### เคล็ดลับสภาพแวดล้อมการพัฒนา
- ใช้ VS Code พร้อมส่วนขยาย Live Server สำหรับโปรเจกต์ HTML - ใช้ VS Code กับส่วนขยาย Live Server สำหรับโครงการ HTML
- ติดตั้งส่วนขยาย ESLint และ Prettier เพื่อจัดรูปแบบให้สอดคล้อง - ติดตั้งส่วนขยาย ESLint และ Prettier สำหรับการฟอร์แมตที่สอดคล้อง
- ใช้ DevTools ของเบราว์เซอร์ดีบัก JavaScript - ใช้ DevTools ของเบราว์เซอร์สำหรับดีบัก JavaScript
- สำหรับโปรเจกต์ Vue ให้ติดตั้งส่วนขยาย Vue DevTools ในเบราว์เซอร์ - สำหรับโปรเจ็กต์ Vue ให้ติดตั้งส่วนขยาย Vue DevTools บนเบราว์เซอร์
### การพิจารณาด้านประสิทธิภาพ ### การพิจารณาด้านประสิทธิภาพ
- มีไฟล์แปลจำนวนมาก (50+ ภาษา) ทำให้การโคลนเต็มมีขนาดใหญ่ - จำนวนไฟล์แปลมาก (50+ ภาษา) ทำให้การโคลนครบถ้วนมีขนาดใหญ่
- ใช้ shallow clone หากทำงานที่เนื้อหาเท่านั้น: `git clone --depth 1` - ใช้ shallow clone หากทำงานแค่เนื้อหา: `git clone --depth 1`
- ยกเว้นการค้นหาในไฟล์แปลเมื่อทำงานกับเนื้อหาอังกฤษ - งดการค้นหาในโฟลเดอร์แปลภาษาเมื่อทำงานกับเนื้อหาอังกฤษ
- กระบวนการสร้างอาจช้าครั้งแรก (npm install, การสร้าง Vite) - ขั้นตอนการสร้างอาจช้าในครั้งแรก (npm install, สร้าง Vite)
## การพิจารณาด้านความปลอดภัย ## การพิจารณาด้านความปลอดภัย
### ตัวแปรสภาพแวดล้อม ### ตัวแปรสภาพแวดล้อม
- ห้ามเก็บกุญแจ API ในที่เก็บโค้ด - ห้ามคีย์ API ถูกคอมมิตในที่เก็บ
- ใช้ไฟล์ `.env` (มีระบุใน `.gitignore` แล้ว) - ใช้ไฟล์ `.env` (มีใน `.gitignore` แล้ว)
- เอกสารตัวแปรสภาพแวดล้อมที่ต้องใช้ใน README ของโปรเจกต์ - อธิบายตัวแปรสภาพแวดล้อมที่ต้องใช้ใน README ของแต่ละโครงการ
### โปรเจกต์ Python ### โครงการ Python
- ใช้ virtual environments: `python -m venv venv` - ใช้สภาพแวดล้อมเสมือน: `python -m venv venv`
- อัปเดต dependencies อย่างสม่ำเสมอ - อัปเดต dependencies อย่างสม่ำเสมอ
- โทเค็น GitHub ควรมีสิทธิ์ขั้นต่ำที่จำเป็น - โทเค็น GitHub ควรมีสิทธิ์ขั้นต่ำที่จำเป็น
### การเข้าถึง GitHub Models ### การเข้าถึงโมเดล GitHub
- ต้องใช้ Personal Access Tokens (PAT) สำหรับ GitHub Models - ต้องใช้ Personal Access Tokens (PAT) สำหรับโมเดล GitHub
- ควรเก็บโทเค็นเป็นตัวแปรสภาพแวดล้อม - โทเค็นควรเก็บเป็นตัวแปรสภาพแวดล้อม
- หลีกเลี่ยงการคอมมิตโทเค็นหรือข้อมูลรับรอง - ห้ามคอมมิตโทเค็นหรือข้อมูลประจำตัว
## หมายเหตุเพิ่มเติม ## หมายเหตุเพิ่มเติม
### กลุ่มเป้าหมาย ### กลุ่มเป้าหมาย
- ผู้เริ่มต้นที่สมบูรณ์ในการพัฒนาเว็บ - ผู้เริ่มต้นเรียนรู้การพัฒนาเว็บอย่างสมบูรณ์
- นักเรียนและผู้เรียนด้วยตนเอง - นักเรียนและผู้เรียนด้วยตนเอง
- ครูผู้สอนที่ใช้หลักสูตรในห้องเรียน - ครูผู้ใช้หลักสูตรในห้องเรียน
- เนื้อหาออกแบบเพื่อการเข้าถึงและการพัฒนาทักษะอย่างค่อยเป็นค่อยไป - เนื้อหาออกแบบเพื่อการเข้าถึงและสร้างทักษะทีละขั้น
### ปรัชญาการศึกษา ### ปรัชญาการศึกษา
- การเรียนรู้ผ่านโปรเจกต์ - วิธีการเรียนรู้แบบโครงการ
- การทดสอบความรู้บ่อยครั้ง (แบบทดสอบ) - มีการทดสอบความรู้บ่อยครั้ง (แบบทดสอบ)
- แบบฝึกหัดเขียนโค้ดเชิงปฏิบัติ - แบบฝึกหัดโค้ดแบบลงมือทำ
- ตัวอย่างการประยุกต์ในโลกจริง - ตัวอย่างการใช้งานจริง
- เน้นพื้นฐานก่อนเรียนรู้เฟรมเวิร์ก - เน้นพื้นฐานก่อนใช้เฟรมเวิร์ก
### การบำรุงรักษาที่เก็บ ### การดูแลรักษาที่เก็บ
- ชุมชนผู้เรียนและผู้มีส่วนร่วมแอคทีฟ - ชุมชนผู้เรียนและผู้ร่วมมือที่แอคทีฟ
- อัปเดต dependencies และเนื้อหาเป็นประจำ - อัปเดต dependencies และเนื้อหาอย่างสม่ำเสมอ
- ติดตามปัญหาและการสนทนาโดยผู้ดูแล - มีผู้ดูแลคอยติดตามปัญหาและการสนทนา
- การอัปเดตการแปลเป็นอัตโนมัติผ่าน GitHub Actions - การอัปเดตการแปลอัตโนมัติผ่าน GitHub Actions
### แหล่งข้อมูลที่เกี่ยวข้อง ### ทรัพยากรที่เกี่ยวข้อง
- [โมดูล Microsoft Learn](https://docs.microsoft.com/learn/) - [โมดูล Microsoft Learn](https://docs.microsoft.com/learn/)
- [ทรัพยากร Student Hub](https://docs.microsoft.com/learn/student-hub/) - [ทรัพยากร Student Hub](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) แนะนำสำหรับผู้เรียน - แนะนำ [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) สำหรับผู้เรียน
- คอร์สเพิ่มเติม: Generative AI, Data Science, ML, หลักสูตร IoT มีให้ใช้งาน - หลักสูตรเพิ่มเติม: AI สร้างสรรค์, วิทยาศาสตร์ข้อมูล, ML, หลักสูตร IoT
### การทำงานกับโปรเจกต์เฉพาะ ### การทำงานกับโครงการเฉพาะ
คำแนะนำโดยละเอียดสำหรับโปรเจกต์แต่ละอันดูได้จากไฟล์ README ใน: สำหรับคำแนะนำเฉพาะเจาะจงของแต่ละโครงการ ดูไฟล์ README ใน:
- `quiz-app/README.md` - แอปแบบทดสอบ Vue 3 - `quiz-app/README.md` - แอปแบบทดสอบด้วย Vue 3
- `7-bank-project/README.md` - แอปธนาคารพร้อมระบบตรวจสอบสิทธิ์ - `7-bank-project/README.md` - แอปธนาคารพร้อมระบบยืนยันตัวตน
- `5-browser-extension/README.md` - การพัฒนาส่วนขยายเบราว์เซอร์ - `5-browser-extension/README.md` - การพัฒนาส่วนขยายเบราว์เซอร์
- `6-space-game/README.md` - การพัฒนาเกมด้วย Canvas - `6-space-game/README.md` - การพัฒนาเกมด้วย Canvas
- `9-chat-project/README.md` - โปรเจกต์ผู้ช่วยแชท AI - `9-chat-project/README.md` - โครงการผู้ช่วยแชท AI
### โครงสร้าง Monorepo ### โครงสร้าง Monorepo
แม้ไม่ใช่ monorepo แบบดั้งเดิม ที่เก็บนี้มีโปรเจกต์อิสระหลายโปรเจกต์: แม้จะไม่ใช่ monorepo แบบดั้งเดิม แต่ที่เก็บนี้ประกอบด้วยโครงการอิสระหลายชุด:
- บทเรียนแต่ละอันเป็นเอกเทศ - แต่ละบทเรียนเป็นอิสระ
- โปรเจกต์ไม่แชร์ dependencies กัน - โครงการไม่แชร์ dependencies ร่วมกัน
- ทำงานโปรเจกต์เดี่ยวได้โดยไม่กระทบโปรเจกต์อื่น - ทำงานกับโครงการแต่ละอันโดยไม่กระทบโครงการอื่น
- โคลนที่เก็บทั้งหมดเพื่อรับประสบการณ์หลักสูตรเต็มรูปแบบ - โคลนที่เก็บทั้งหมดเพื่อประสบการณ์หลักสูตรเต็มรูปแบบ
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**ข้อจำกัดความรับผิดชอบ**: **ข้อจำกัดความรับผิดชอบ**:
เอกสารนี้ได้รับการแปลโดยใช้บริการแปลภาษาอัตโนมัติ [Co-op Translator](https://github.com/Azure/co-op-translator) แม้ว่าเราจะพยายามให้ถูกต้อง โปรดทราบว่าการแปลอัตโนมัติอาจมีข้อผิดพลาดหรือความไม่ถูกต้องได้ เอกสารต้นฉบับในภาษาต้นทางควรถือเป็นแหล่งข้อมูลที่เชื่อถือได้ สำหรับข้อมูลที่มีความสำคัญ แนะนำให้ใช้การแปลโดยมนุษย์มืออาชีพ เราไม่รับผิดชอบต่อความเข้าใจผิดหรือการตีความที่ผิดพลาดใดๆ ที่เกิดขึ้นจากการใช้การแปลนี้ เอกสารนี้ได้รับการแปลโดยใช้บริการแปลภาษา AI [Co-op Translator](https://github.com/Azure/co-op-translator) แม้เราจะพยายามให้ความถูกต้องสูงสุด โปรดทราบว่าการแปลโดยอัตโนมัติอาจมีข้อผิดพลาดหรือความไม่ถูกต้อง เอกสารต้นฉบับในภาษาต้นทางควรถูกพิจารณาเป็นแหล่งข้อมูลที่เชื่อถือได้ สำหรับข้อมูลสำคัญ แนะนำให้ใช้การแปลโดยมนุษย์ผู้เชี่ยวชาญ เราจะไม่รับผิดชอบต่อความเข้าใจผิดหรือการตีความผิดใด ๆ ที่เกิดจากการใช้การแปลนี้
<!-- CO-OP TRANSLATOR DISCLAIMER END --> <!-- CO-OP TRANSLATOR DISCLAIMER END -->
Write Preview
Loading…
Cancel
Save