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
update-translations
localizeflow[bot] 5 months ago
parent 120ab74c70
commit ae46f697d9
6 changed files with 442 additions and 442 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-24T16:20:57+00:00", "translation_date": "2026-04-24T16:46:58+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "el" "language_code": "el"
}, },

308
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, Typing Game, Browser Extension, Space Game, Banking App, Code Editor και AI Chat Assistant
- **Διαδραστικά Quiz**: 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
## Εντολές Ρύθμισης ## Εντολές Ρύθμισης
Αυτό το αποθετήριο είναι κυρίως για κατανάλωση εκπαιδευτικού περιεχομένου. Για εργασία με συγκεκριμένα έργα: Αυτό το αποθετήριο προορίζεται κυρίως για κατανάλωση εκπαιδευτικού περιεχομένου. Για εργασία με συγκεκριμένα έργα:
### Ρύθμιση Κύριου Αποθετηρίου ### Ρύθμιση Κύριου Αποθετηρίου
@ -41,22 +41,22 @@ 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
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
# Ακολουθήστε τις οδηγίες φόρτωσης επεκτάσεων ανά πρόγραμμα περιήγησης # Ακολουθήστε τις οδηγίες φόρτωσης επεκτάσεων ειδικές για το πρόγραμμα περιήγησης
``` ```
### Έργα Παιχνιδιού Διαστήματος ### Έργα Παιχνιδιού Διαστήματος
@ -67,7 +67,7 @@ npm install
# Ανοίξτε το index.html σε πρόγραμμα περιήγησης ή χρησιμοποιήστε το Live Server # Ανοίξτε το index.html σε πρόγραμμα περιήγησης ή χρησιμοποιήστε το Live Server
``` ```
### Έργο Συνομιλίας (Backend Python) ### Έργο Chat (Backend Python)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
@ -76,32 +76,32 @@ pip install openai
python api.py python api.py
``` ```
## Ροή Εργασίας Ανάπτυξης ## Ροή Ανάπτυξης
### Για Συμβολή Περιεχομένου ### Για Συνεργάτες Περιεχομένου
1. **Κάντε Fork το αποθετήριο** στον λογαριασμό σας στο GitHub 1. **Φορκάρετε το αποθετήριο** στον λογαριασμό σας στο GitHub
2. **Κλωνοποιήστε το Fork σας** τοπικά 2. **Κλωνοποιήστε το fork σας** τοπικά
3. **Δημιουργήστε ένα νέο branch** για τις αλλαγές σας 3. **Δημιουργήστε νέο branch** για τις αλλαγές σας
4. Κάντε αλλαγές στο περιεχόμενο των μαθημάτων ή στα παραδείγματα κώδικα 4. Κάντε αλλαγές στο περιεχόμενο των μαθημάτων ή στα παραδείγματα κώδικα
5. Δοκιμάστε οποιεσδήποτε αλλαγές κώδικα στους αντίστοιχους καταλόγους έργων 5. Δοκιμάστε τις αλλαγές κώδικα στους αντίστοιχους καταλόγους έργων
6. Υποβάλετε pull requests σύμφωνα με τις οδηγίες συμβολής 6. Υποβάλετε pull requests ακολουθώντας τις οδηγίες συνεισφοράς
### Για Μαθητές ### Για Μαθητές
1. Κάντε fork ή κλωνοποίηση του αποθετηρίου 1. Φορκάρετε ή κλωνοποιήστε το αποθετήριο
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 - **Έργα**: Χρησιμοποιήστε την επέκταση Live Server του VS Code για έργα HTML
- **API Έργα**: Εκτελέστε `npm start` στους αντίστοιχους καταλόγους API - **API Έργα**: Εκτελέστε `npm start` στους αντίστοιχους καταλόγους API
## Οδηγίες Δοκιμών ## Οδηγίες Δοκιμών
@ -110,152 +110,152 @@ 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
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Ελέγξτε για ζητήματα στυλ κώδικα npm run lint # Ελέγξτε για προβλήματα στο στυλ κώδικα
node server.js # Επαληθεύστε ότι ο διακομιστής ξεκινά χωρίς σφάλματα node server.js # Επαληθεύστε ότι ο διακομιστής ξεκινά χωρίς σφάλματα
``` ```
### Γενική Προσέγγιση Δοκιμών ### Γενική Προσέγγιση Δοκιμών
- Πρόκειται για εκπαιδευτικό αποθετήριο χωρίς πλήρεις αυτοματοποιημένες δοκιμές - Αυτό είναι εκπαιδευτικό αποθετήριο χωρίς πλήρεις αυτοματοποιημένες δοκιμές
- Οι χειροκίνητες δοκιμές επικεντρώνονται σε: - Οι χειροκίνητες δοκιμές εστιάζουν σε:
- Εκτέλεση παραδειγμάτων κώδικα χωρίς σφάλματα - Παράδειγματα κώδικα να εκτελούνται χωρίς σφάλματα
- Εργασία συνδέσμων στην τεκμηρίωση - Οι σύνδεσμοι στην τεκμηρίωση να λειτουργούν σωστά
- Επιτυχής ολοκλήρωση build έργων - Ολοκληρωμένα επιτυχημένα builds έργων
- Παραδείγματα που ακολουθούν βέλτιστες πρακτικές - Παραδείγματα να ακολουθούν καλές πρακτικές
### Έλεγχοι Πριν την Υποβολή ### Έλεγχοι Πριν την Υποβολή
- Εκτελέστε `npm run lint` σε καταλόγους που έχουν package.json - Εκτελέστε `npm run lint` σε καταλόγους με package.json
- Επαληθεύστε ότι οι σύνδεσμοι markdown είναι έγκυροι - Ελέγξτε την εγκυρότητα των συνδέσμων markdown
- Δοκιμάστε παραδείγματα κώδικα στον περιηγητή ή στο Node.js - Δοκιμάστε παραδείγματα κώδικα σε browser ή 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
- Καθαρά, εκπαιδευτικά παραδείγματα κώδικα - Καθαρά, εκπαιδευτικά παραδείγματα κώδικα
- Σημειώσεις τύπων όπου βοηθούν στη μάθηση - Τύποι όπου βοηθούν στην εκμάθηση
### Τεκμηρίωση Markdown ### Τεκμηρίωση Markdown
- Σαφής ιεραρχία επικεφαλίδων - Καθαρή ιεραρχία κεφαλίδων
- Μπλοκ κώδικα με καθορισμό γλώσσας - Μπλοκ κώδικα με καθορισμένη γλώσσα
- Σύνδεσμοι για επιπλέον πόρους - Σύνδεσμοι σε επιπλέον πόρους
- Στιγμιότυπα και εικόνες στους καταλόγους `images/` - Στιγμιότυπα και εικόνες στους φακέλους `images/`
- Εναλλακτικό κείμενο για πρόσβαση σε εικόνες - Εναλλακτικό κείμενο για τις εικόνες για πρόσβαση
### Οργάνωση Αρχείων ### Οργάνωση Αρχείων
- Μαθήματα αριθμημένα διαδοχικά (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 κατά το push στο 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`
### Δημιουργία PDF Τεκμηρίωσης ### Δημιουργία PDF Τεκμηρίωσης
```bash ```bash
npm install # Εγκαταστήστε το docsify-to-pdf npm install # Εγκαταστήστε το docsify-to-pdf
npm run convert # Δημιουργήστε PDF από το docs npm run convert # Δημιουργία PDF από docs
``` ```
### Τεκμηρίωση Docsify ### Docsify Τεκμηρίωση
```bash ```bash
npm install -g docsify-cli # Εγκαταστήστε το Docsify παγκοσμίως npm install -g docsify-cli # Εγκαταστήστε το Docsify παγκοσμίως
docsify serve # Εκτελέστε στο localhost:3000 docsify serve # Εξυπηρέτηση στο localhost:3000
``` ```
### Κατασκευές Ειδικές για Έργα ### Builds Ανά Έργο
Κάθε κατάλογος έργου μπορεί να έχει τη δική του διαδικασία κατασκευής: Κάθε φάκελος έργου μπορεί να έχει δική του διαδικασία build:
- Έργα Vue: `npm run build` δημιουργεί παραγωγικά bundles - Vue έργα: `npm run build` δημιουργεί bundles παραγωγής
- Στατικά έργα: Δεν απαιτείται βήμα κατασκευής, εξυπηρέτηση αρχείων απευθείας - Στατικά έργα: Δεν υπάρχει βήμα build, σερβίρετε τα αρχεία απευθείας
## Οδηγίες 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` στους επηρεαζόμενους καταλόγους έργων
- Διορθώστε όλα τα λάθη και τις προειδοποιήσεις linting - Διορθώστε όλα τα λάθη και προειδοποιήσεις lint
2. **Επαλήθευση Κατασκευής**: 2. **Επαλήθευση Build**:
- Εκτελέστε `npm run build` όπου εφαρμόζεται - Εκτελέστε `npm run build` όπου εφαρμόζεται
- Βεβαιωθείτε ότι δεν υπάρχουν σφάλματα κατασκευής - Βεβαιωθείτε ότι δεν υπάρχουν σφάλματα build
3. **Επαλήθευση Συνδέσμων**: 3. **Επικύρωση Συνδέσμων**:
- Δοκιμάστε όλους τους συνδέσμους markdown - Δοκιμάστε όλους τους συνδέσμους markdown
- Επαληθεύστε ότι οι αναφορές εικόνων λειτουργούν - Επιβεβαιώστε ότι οι εικόνες φορτώνουν σωστά
4. **Ανασκόπηση Περιεχομένου**: 4. **Ανασκόπηση Περιεχομένου**:
- Διορθώστε ορθογραφικά και γραμματικά λάθη - Διορθώστε ορθογραφία και γραμματική
- Βεβαιωθείτε ότι τα παραδείγματα κώδικα είναι σωστά και εκπαιδευτικά - Βεβαιωθείτε ότι τα παραδείγματα κώδικα είναι σωστά και εκπαιδευτικά
- Επαληθεύστε ότι οι μεταφράσεις διατηρούν την αρχική σημασία - Επιβεβαιώστε ότι οι μεταφράσεις διατηρούν το αρχικό νόημα
### Απαιτήσεις Συμβολής ### Απαιτήσεις Συνεισφοράς
- Αποδοχή Microsoft CLA (αυτόματος έλεγχος στο πρώτο PR) - Αποδοχή του Microsoft CLA (αυτόματος έλεγχος στην πρώτη PR)
- Τήρηση του [Κώδικα Συμπεριφοράς Open Source της Microsoft](https://opensource.microsoft.com/codeofconduct/) - Ακολουθήστε τον [Κώδικα Συμπεριφοράς Ανοιχτού Κώδικα Microsoft](https://opensource.microsoft.com/codeofconduct/)
- Ανατρέξτε στο [CONTRIBUTING.md](./CONTRIBUTING.md) για λεπτομερείς οδηγίες - Δείτε το [CONTRIBUTING.md](./CONTRIBUTING.md) για λεπτομερείς οδηγίες
- Αναφορά αριθμών θεμάτων στην περιγραφή PR όπου ισχύει - Αναφέρετε αριθμούς issue στην περιγραφή PR αν ισχύει
### Διαδικασία Ανασκόπησης ### Διαδικασία Ανασκόπησης
- Τα PR ελέγχονται από διαχειριστές και την κοινότητα - Οι PR ελέγχονται από διαχειριστές και κοινότητα
- Προτεραιότητα στην εκπαιδευτική σαφήνεια - Η εκπαιδευτική σαφήνεια είναι προτεραιότητα
- Τα παραδείγματα κώδικα πρέπει να ακολουθούν τρέχουσες βέλτιστες πρακτικές - Τα παραδείγματα κώδικα πρέπει να ακολουθούν τις τρέχουσες βέλτιστες πρακτικές
- Οι μεταφράσεις ελέγχονται για ακρίβεια και πολιτισμική καταλληλότητα - Οι μεταφράσεις ελέγχονται για ακρίβεια και πολιτισμική καταλληλότητα
## Σύστημα Μετάφρασης ## Σύστημα Μετάφρασης
@ -264,19 +264,19 @@ docsify serve # Εκτελέστε στο localhost:3000
- Χρησιμοποιεί 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. Δοκιμάστε τυχόν τοπικά κουίζ που έχουν εντοπιστεί
### Μεταδεδομένα Μετάφρασης ### Μεταδεδομένα Μετάφρασης
Τα μεταφρασμένα αρχεία περιλαμβάνουν επικεφαλίδα μεταδεδομένων: Τα μεταφρασμένα αρχεία περιέχουν κεφαλίδα μεταδεδομένων:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -289,91 +289,91 @@ CO_OP_TRANSLATOR_METADATA:
--> -->
``` ```
## Αντιμετώπιση Σφαλμάτων και Επίλυση Προβλημάτων ## Αποσφαλμάτωση και Επίλυση Προβλημάτων
### Συνήθη Ζητήματα ### Συχνά Προβλήματα
**Δεν ξεκινά η εφαρμογή του quiz**: **Το quiz app δεν ξεκινάει**:
- Ελέγξτε την έκδοση 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 πληροί τις ελάχιστες απαιτήσεις (node >=10) - Ελέγξτε ότι η έκδοση Node.js είναι >=10
- Ελέγξτε αν η θύρα χρησιμοποιείται ήδη - Ελέγξτε αν η θύρα χρησιμοποιείται ήδη
- Βεβαιωθείτε ότι έχουν εγκατασταθεί όλες οι εξαρτήσεις με `npm install` - Βεβαιωθείτε ότι έχουν εγκατασταθεί όλες οι εξαρτήσεις με `npm install`
**Δεν φορτώνει το πρόσθετο περιηγητή**: **Η επέκταση περιηγητή δεν φορτώνει**:
- Επαληθεύστε ότι το manifest.json είναι σωστά μορφοποιημένο - Επιβεβαιώστε ότι το manifest.json είναι σωστά διαμορφωμένο
- Ελέγξτε την κονσόλα του περιηγητή για σφάλματα - Ελέγξτε την κονσόλα του browser για σφάλματα
- Ακολουθήστε τις οδηγίες εγκατάστασης πρόσθετου που είναι ειδικές για τον περιηγητή - Ακολουθήστε τις οδηγίες εγκατάστασης της επέκτασης για τον αντίστοιχο browser
**Προβλήματα στο έργο συνομιλίας Python**: **Προβλήματα έργου chat Python**:
- Βεβαιωθείτε ότι το πακέτο OpenAI είναι εγκατεστημένο: `pip install openai` - Βεβαιωθείτε ότι το πακέτο OpenAI είναι εγκατεστημένο: `pip install openai`
- Επαληθεύστε ότι η μεταβλητή περιβάλλοντος GITHUB_TOKEN είναι ορισμένη - Ελέγξτε ότι η μεταβλητή περιβάλλοντος GITHUB_TOKEN είναι ορισμένη
- Ελέγξτε τα δικαιώματα πρόσβασης στα GitHub Models - Ελέγξτε τα δικαιώματα πρόσβασης στα GitHub Models
**Δεν εξυπηρετεί η Docsify τα docs**: **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 του browser για αποσφαλμάτωση JavaScript
- Για έργα Vue, εγκαταστήστε την επέκταση Vue DevTools στον περιηγητή - Για έργα Vue, εγκαταστήστε την επέκταση Vue DevTools του browser
### Παράγοντες Απόδοσης ### Θέματα Απόδοσης
- Ο μεγάλος αριθμός μεταφρασμένων αρχείων (50+ γλώσσες) κάνει τις κλωνοποιήσεις πλήρεις βαριές - Μεγάλος αριθμός μεταφρασμένων αρχείων (50+ γλώσσες) σημαίνει μεγάλα ολοκληρωτικά κλώνους
- Χρησιμοποιήστε shallow clone αν εργάζεστε μόνο με περιεχόμενο: `git clone --depth 1` - Χρησιμοποιήστε ρηχό κλώνο αν εργάζεστε μόνο με περιεχόμενο: `git clone --depth 1`
- Εξαιρέστε τις μεταφράσεις από τις αναζητήσεις όταν εργάζεστε στα Αγγλικά - Αποκλείστε τις μεταφράσεις από τις αναζητήσεις όταν εργάζεστε με αγγλικό περιεχόμενο
- Οι διαδικασίες κατασκευής μπορεί να είναι αργές στην πρώτη εκτέλεση (npm install, vite build) - Οι διαδικασίες build μπορεί να είναι αργές στην πρώτη εκτέλεση (npm install, Vite build)
## Θέματα Ασφαλείας ## Θέματα Ασφαλείας
### Μεταβλητές Περιβάλλοντος ### Μεταβλητές Περιβάλλοντος
- Τα API keys δεν πρέπει να δεσμεύονται στο αποθετήριο - Τα κλειδιά API δεν πρέπει ποτέ να δεσμεύονται στο αποθετήριο
- Χρησιμοποιήστε αρχεία `.env` (ήδη στο `.gitignore`) - Χρησιμοποιήστε αρχεία `.env` (ήδη στο `.gitignore`)
- Τεκμηριώστε τις απαιτούμενες μεταβλητές περιβάλλοντος στα README των έργων - Τεκμηριώστε τις απαιτούμενες μεταβλητές περιβάλλοντος στα README των έργων
### Έργα Python ### Έργα Python
- Χρησιμοποιήστε εικονικά περιβάλλοντα: `python -m venv venv` - Χρησιμοποιήστε εικονικά περιβάλλοντα: `python -m venv venv`
- Κρατήστε τις εξαρτήσεις ενημερωμένες - Κρατήστε ενημερωμένες τις εξαρτήσεις
- Τα GitHub tokens πρέπει να έχουν τα ελάχιστα αναγκαία δικαιώματα - Τα tokens GitHub πρέπει να έχουν ελάχιστα απαιτούμενα δικαιώματα
### Πρόσβαση GitHub Models ### Πρόσβαση σε GitHub Models
- Χρειάζονται Personal Access Tokens (PAT) για GitHub Models - Απαιτούνται Personal Access Tokens (PAT) για GitHub Models
- Αποθηκεύονται ως μεταβλητές περιβάλλοντος - Τα tokens να αποθηκεύονται ως μεταβλητές περιβάλλοντος
- Μην δεσμεύετε ποτέ tokens ή διαπιστευτήρια - Ποτέ μη δεσμεύετε tokens ή διαπιστευτήρια στον κώδικα
## Πρόσθετες Σημειώσεις ## Πρόσθετες Σημειώσεις
### Στόχος Κοινού ### Στόχος Κοινού
- Αρχάριοι πλήρως στην ανάπτυξη ιστοσελίδων - Απόλυτα αρχάριοι στην ανάπτυξη ιστοσελίδων
- Φοιτητές και αυτοδίδακτοι - Μαθητές και αυτοδίδακτοι
- Εκπαιδευτικοί που χρησιμοποιούν το πρόγραμμα σε αίθουσες διδασκαλίας - Καθηγητές που χρησιμοποιούν το πρόγραμμα σε τάξεις
- Το περιεχόμενο σχεδιάζεται για προσβασιμότητα και σταδιακή ανάπτυξη δεξιοτήτων - Το περιεχόμενο σχεδιάστηκε για προσβασιμότητα και σταδιακή ανάπτυξη δεξιοτήτων
### Εκπαιδευτική Φιλοσοφία ### Εκπαιδευτική Φιλοσοφία
- Προσέγγιση μάθησης με βάση έργα - Προσέγγιση μάθησης βασισμένη σε έργα
- Συχνές αξιολογήσεις γνώσεων (κουίζ) - Συχνές επαληθεύσεις γνώσης (κουίζ)
- Πρακτικές ασκήσεις προγραμματισμού - Πρακτικές ασκήσεις κώδικα
- Παραδείγματα εφαρμογών πραγματικού κόσμου - Παραδείγματα εφαρμογών πραγματικού κόσμου
- Εστίαση στα θεμέλια πριν από τα frameworks - Εστίαση στα θεμελιώδη πριν τα πλαίσια εργασίας
### Συντήρηση Αποθετηρίου ### Συντήρηση Αποθετηρίου
- Ενεργή κοινότητα μαθητών και συμβολής - Ενεργή κοινότητα μαθητών και συνεργατών
- Τακτικές ενημερώσεις εξαρτήσεων και περιεχομένου - Τακτικές ενημερώσεις εξαρτήσεων και περιεχομένου
- Παρακολούθηση θεμάτων και συζητήσεων από τους διαχειριστές - Παρακολούθηση ζητημάτων και συζητήσεων από διαχειριστές
- Αυτόματες ενημερώσεις μεταφράσεων μέσω GitHub Actions - Αυτόματες ενημερώσεις μεταφράσεων μέσω GitHub Actions
### Σχετικοί Πόροι ### Σχετικοί Πόροι
@ -385,24 +385,24 @@ CO_OP_TRANSLATOR_METADATA:
### Εργασία με Συγκεκριμένα Έργα ### Εργασία με Συγκεκριμένα Έργα
Για λεπτομερείς οδηγίες για μεμονωμένα έργα, ανατρέξτε στα αρχεία README στα: Για αναλυτικές οδηγίες σε μεμονωμένα έργα, ανατρέξτε στα αρχεία README:
- `quiz-app/README.md` - Εφαρμογή quiz με 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` - Ανάπτυξη παιχνιδιού καμβά
- `9-chat-project/README.md` - Έργο βοηθού συνομιλίας AI - `9-chat-project/README.md` - Έργο βοηθού συνομιλίας AI
### Δομή Monorepo ### Δομή Μονό-αποθετηρίου (Monorepo)
Αν και δεν είναι παραδοσιακό monorepo, το αποθετήριο περιέχει πολλαπλά ανεξάρτητα έργα: Παρότι δεν είναι παραδοσιακό monorepo, αυτό το αποθετήριο περιέχει πολλαπλά ανεξάρτητα έργα:
- Κάθε μάθημα είναι αυτόνομο - Κάθε μάθημα είναι αυτόνομο
- Τα έργα δεν μοιράζονται εξαρτήσεις - Τα έργα δεν μοιράζονται εξαρτήσεις
- Εργαστείτε σε ανεξάρτητα έργα χωρίς να επηρεάζετε τα άλλα - Εργαστείτε σε μεμονωμένα έργα χωρίς να επηρεάζετε άλλα
- Κλωνοποιήστε ολόκληρο το αποθετήριο για πλήρη εμπειρία προγράμματος σπουδών - Κλωνοποιήστε ολόκληρο το αποθετήριο για την πλήρη εμπειρία προγράμματος σπουδών
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Αποποίηση ευθυνών**: **Αποποίηση ευθύνης**:
Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας υπηρεσία μετάφρασης AI [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-24T16:23:42+00:00", "translation_date": "2026-04-24T16:49:31+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "sv" "language_code": "sv"
}, },

248
translations/sv/AGENTS.md
Unescape View File

@ -2,36 +2,36 @@
## Projektöversikt ## Projektöversikt
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. Detta är ett utbildningsprogram för att lära ut grunderna i webbutveckling för nybörjare. Kursplanen är en omfattande 12-veckors kurs utvecklad av Microsoft Cloud Advocates, med 24 praktiska lektioner som täcker JavaScript, CSS och HTML.
### Viktiga komponenter ### Huvudkomponenter
- **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-chatassistent - **Praktiska projekt**: Terrarium, Typningsspel, Browser Extension, Rymdspel, Bankapp, Kodeditor och AI-chattassistent
- **Interaktiva quiz**: 48 quiz med 3 frågor vardera (för- och efterlektionstest) - **Interaktiva quiz**: 48 quiz med 3 frågor vardera (före/efter lektionstest)
- **Fler språkstöd**: Automatiska översättningar till över 50 språk via GitHub Actions - **Fler språkstö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
- Utbildningsrepo med lektionbaserad struktur - Utbildningsförråd med lektionsbaserad struktur
- Varje lektionsmapp innehåller README, kodexempel och lösningar - Varje lektionsmapp innehåller README, kodexempel och lösningar
- Självständiga projekt i separata kataloger (quiz-app, olika lektionsprojekt) - Fristående projekt i separata kataloger (quiz-app, olika lektionsprojekt)
- Översättningssystem via GitHub Actions (co-op-translator) - Översättningssystem med GitHub Actions (co-op-translator)
- Dokumentation serverad via Docsify och tillgänglig som PDF - Dokumentation serveras via Docsify och finns som PDF
## Setup-kommandon ## Setup-kommandon
Detta repository är främst för konsumtion av utbildningsinnehåll. För att arbeta med specifika projekt: Detta förråd är främst för utbildningsinnehållskonsumtion. För arbete med specifika projekt:
### Huvudrepo Setup ### Huvudförrådets installation
```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 Apps Setup (Vue 3 + Vite) ### Quiz App Setup (Vue 3 + Vite)
```bash ```bash
cd quiz-app cd quiz-app
@ -51,7 +51,7 @@ npm run lint # Kör ESLint
npm run format # Formatera med Prettier npm run format # Formatera med Prettier
``` ```
### Webbläsartilläggsprojekt ### Browser Extension-projekt
```bash ```bash
cd 5-browser-extension/solution cd 5-browser-extension/solution
@ -59,7 +59,7 @@ npm install
# Följ webbläsarspecifika instruktioner för att ladda tillägg # Följ webbläsarspecifika instruktioner för att ladda tillägg
``` ```
### Rymdspelprojekt ### Rymdspel-projekt
```bash ```bash
cd 6-space-game/solution cd 6-space-game/solution
@ -67,76 +67,76 @@ npm install
# Öppna index.html i webbläsaren eller använd Live Server # Öppna index.html i webbläsaren eller använd Live Server
``` ```
### Chatprojekt (Python backend) ### Chattprojekt (Python backend)
```bash ```bash
cd 9-chat-project/solution/backend/python cd 9-chat-project/solution/backend/python
pip install openai pip install openai
# Sätt GITHUB_TOKEN miljövariabeln # Sätt miljövariabeln GITHUB_TOKEN
python api.py python api.py
``` ```
## Utvecklingsflöde ## Utvecklingsarbetsflöde
### För innehållsbidragare ### För innehållsbidragsgivare
1. **Forka repot** till ditt GitHub-konto 1. **Fork:a förrådet** till ditt GitHub-konto
2. **Klona din fork** 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 i lektionsinnehåll eller kodexempel
5. Testa eventuella kodändringar i relevanta projektmappar 5. Testa eventuella kodändringar i relevanta projektmappar
6. Skicka pull requests enligt riktlinjer för bidrag 6. Skicka in pull-requests enligt riktlinjer för bidrag
### För elever ### För elever
1. Forka eller klona repot 1. Fork:a eller klona förrådet
2. Navigera till lektionskataloger i ordning 2. Navigera till lektionsmapparna i ordning
3. Läs README-filer för varje lektion 3. Läs README-filer för varje lektion
4. Gör för-lektions quiz på https://ff-quizzes.netlify.app/web/ 4. Gör för-lektionsquiz på https://ff-quizzes.netlify.app/web/
5. Arbeta igenom kodexempel i lektionsmapparna 5. Arbeta igenom kodexempel i lektionsmapparna
6. Slutför uppgifter och utmaningar 6. Slutför uppgifter och utmaningar
7. Gör efter-lektions quiz 7. Gör efter-lektionsquiz
### Liveutveckling ### Liveutveckling
- **Dokumentation**: Kör `docsify serve` från rotmappen (port 3000) - **Dokumentation**: Kör `docsify serve` i root (port 3000)
- **Quiz-app**: Kör `npm run dev` i quiz-app-katalogen - **Quiz App**: Kör `npm run dev` i quiz-app-mappen
- **Projekt**: Använd VS Code Live Server-tillägg för HTML-projekt - **Projekt**: Använd VS Codes Live Server-tillägg för HTML-projekt
- **API-projekt**: Kör `npm start` i respektive API-katalog - **API-projekt**: Kör `npm start` i respektive API-katalog
## Testinstruktioner ## Testinstruktioner
### Quiz App-testning ### Test av Quiz App
```bash ```bash
cd quiz-app cd quiz-app
npm run lint # Kontrollera kodstilsproblem npm run lint # Kontrollera efter kodstilproblem
npm run build # Verifiera att bygget lyckas npm run build # Verifiera att bygget lyckas
``` ```
### Bank API-testning ### Test av Bank API
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
npm run lint # Kontrollera efter kodstilsproblem npm run lint # Kontrollera kodstilproblem
node server.js # Verifiera att servern startar utan fel node server.js # Verifiera att servern startar utan fel
``` ```
### Allmän testmetod ### Allmän testmetod
- Detta är ett utbildningsrepo utan omfattande automatiserade tester - Detta är ett utbildningsförråd 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 dokumentationen fungerar korrekt
- Projekt byggs framgångsrikt - Projekt bygger klart utan fel
- Exempel följer bästa praxis - Exempel följer bästa praxis
### Kontroll före inskickning ### Kontroll före inskick
- Kör `npm run lint` i kataloger med package.json - Kör `npm run lint` i mappar med package.json
- Verifiera att markdown-länkar är giltiga - Kontrollera 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 behåller korrekt struktur - Kontrollera att översättningar bibehåller korrekt struktur
## Kodstilriktlinjer ## Kodstilriktlinjer
@ -144,56 +144,56 @@ node server.js # Verifiera att servern startar utan fel
- 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 pedagogisk tydlighet - Använd meningsfulla variabel- och funktionsnamn för utbildningsklarhet
- 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
### HTML/CSS ### HTML/CSS
- Semantiska HTML5-element - Semantiska HTML5-element
- Responsiva designprinciper - Responsiv designprinciper
- Tydliga klassnamns-konventioner - Tydliga namngivningskonventioner för klasser
- Kommentarer som förklarar CSS-tekniker för elever - Kommentarer som förklarar CSS-tekniker för elever
### Python ### Python
- PEP 8 stilriktlinjer - PEP 8 kodstilriktlinjer
- Klara, pedagogiska kodexempel - Tydliga, utbildande kodexempel
- Typanvisningar där det hjälper inlärningen - Typangivelser där det är hjälpsamt för lärande
### Markdown-dokumentation ### Markdown-dokumentation
- Tydlig rubrikhierarki - Tydlig rubrikhierarki
- Kodblock med språk-syntax - 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 på bilder för tillgänglighet
### Filorganisation ### Filorganisation
- Lektioner numrerade sekventiellt (1-getting-started-lessons, 2-js-basics, etc.) - Lektioner numrerade i följd (1-getting-started-lessons, 2-js-basics, osv.)
- Varje projekt har `solution/` och ofta `start/` eller `your-work/` mappar - Varje projekt har `solution/` och ofta `start/` eller `your-work/` mappar
- Bilder lagras i lektonspecifika `images/`-mappar - Bilder lagras i lektionsspecifika `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) ### Quiz App-distribution (Azure Static Web Apps)
Quiz-appen är konfigurerad för distribution på Azure Static Web Apps: Quiz-appen är konfigurerad för distribution till Azure Static Web Apps:
```bash ```bash
cd quiz-app cd quiz-app
npm run build # Skapar dist/-mappen npm run build # Skapar dist/ mapp
# 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:
- **Appplats**: `/quiz-app` - **App-läge**: `/quiz-app`
- **Outputplats**: `dist` - **Utmatningsplats**: `dist`
- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` - **Arbetsflöde**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### PDF-generering av dokumentation ### Generering av PDF för dokumentation
```bash ```bash
npm install # Installera docsify-to-pdf npm install # Installera docsify-to-pdf
@ -204,31 +204,31 @@ npm run convert # Generera PDF från docs
```bash ```bash
npm install -g docsify-cli # Installera Docsify globalt npm install -g docsify-cli # Installera Docsify globalt
docsify serve # Kör på localhost:3000 docsify serve # Servera på localhost:3000
``` ```
### Projektspecifika byggsteg ### Projektsspecifika byggsteg
Varje projektkatalog kan ha sin egen byggprocess: Varje projektkatalog kan ha egen byggprocess:
- Vue-projekt: `npm run build` skapar produktionspaket - Vue-projekt: `npm run build` skapar produktionsbundlar
- Statiska projekt: Inget byggsteg, filerna serveras direkt - Statiska projekt: Ingen byggsteg, filer serveras direkt
## Riktlinjer för pull requests ## Pull request-riktlinjer
### Titelformat ### Titelformat
Använd tydliga, beskrivande titlar som visar ä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`
- `[Lektion-3] Fixar stavfel i terrariumprojekt` - `[Lesson-3] Rätta stavfel i terrarium-projektet`
- `[Översättning] Lägg till spanskt översättning för lektion 5` - `[Translation] Lägg till spansk översättning för lektion 5`
- `[Docs] Uppdatera installationsanvisningar` - `[Docs] Uppdatera installationsinstruktioner`
### Obligatoriska kontroller ### Obligatoriska kontroller
Innan PR skickas: Innan PR skickas in:
1. **Kodkvalitet**: 1. **Kodkvalitet**:
- Kör `npm run lint` i berörda projektmappar - Kör `npm run lint` i påverkade projektmappar
- Åtgärda alla lint-fel och varningar - Åtgärda alla lint-fel och varningar
2. **Byggverifiering**: 2. **Byggverifiering**:
@ -240,43 +240,43 @@ Innan PR skickas:
- Verifiera att bildreferenser fungerar - Verifiera att bildreferenser fungerar
4. **Innehållsgranskning**: 4. **Innehållsgranskning**:
- Korrekturläs stavning och grammatik - Korrekturläs för stavning och grammatik
- Säkerställ att kodexempel är korrekta och pedagogiska - Säkerställ att kodexempel är korrekta och pedagogiska
- Kontrollera att översättningar behåller originalmening - Kontrollera att översättningar bibehåller ursprunglig mening
### Bidragskrav ### Krav på bidrag
- Godkänn 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/) - 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 issue-nummer i PR-beskrivning om möjligt - Referera ärendenummer i PR-beskrivning vid behov
### Granskningsprocess ### Granskningsprocess
- PR granskas av underhållare och community - PR granskas av underhållare och gemenskap
- Pedagogisk tydlighet prioriteras - Pedagogisk tydlighet prioriteras
- Kodexempel ska följa aktuella bästa praxis - Kodexempel bör följa aktuell bästa praxis
- Översättningar granskas för korrekthet och kulturell lämplighet - Översättningar granskas för korrekthet och kulturell lämplighet
## Översättningssystem ## Översättningssystem
### Automatiserad ö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 över 50 språk - Översätter till 50+ språk automatiskt
- Källfiler i huvudkataloger - Källfiler i huvudkataloger
- Översatta filer i `translations/{language-code}/` kataloger - Översatta filer i `translations/{language-code}/` kataloger
### Lägga till manuella översättningsförbättringar ### Lägga till manuella förbättringar av översättningar
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 utan att ändra struktur
3. Säkerställ att kodexempel fungerar 3. Säkerställ att kodexempel förblir fungerande
4. Testa lokaliserat quiz-innehåll 4. Testa eventuellt lokaliserat quiz-innehåll
### Översättningsmetadata ### Översättningsmetadata
Översatta filer inkluderar metadataheader: Översatta filer innehåller metadata-header:
```markdown ```markdown
<!-- <!--
CO_OP_TRANSLATOR_METADATA: CO_OP_TRANSLATOR_METADATA:
@ -298,111 +298,111 @@ CO_OP_TRANSLATOR_METADATA:
- 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 (standard: Vite använder port 5173) - Kontrollera portkonflikter (standard: Vite använder port 5173)
**API-server startar inte**: **API-servern startar inte**:
- Verifiera att Node.js-version uppfyller minimikrav (node >=10) - Kontrollera att Node.js-versionen uppfyller minimikrav (node >=10)
- Kontrollera om port redan används - Kontrollera om port redan används
- Säkerställ att alla beroenden är installerade med `npm install` - Säkerställ att alla beroenden installerats med `npm install`
**Webbläsartillägg laddas inte**: **Browser extension laddas inte**:
- Kontrollera att manifest.json är korrekt formaterad - Kontrollera att manifest.json är korrekt formaterad
- Kolla webbläsarkonsolen efter felmeddelanden - Kontrollera webbläsarkonsolen för fel
- Följ webbläsarspecifika installationsinstruktioner för tillägg - Följ webbläsarspecifika instruktioner för tilläggsinstallation
**Problem med Python chatprojekt**: **Problem med Python chattprojekt**:
- Säkerställ att OpenAI-paketet är installerat: `pip install openai` - Säkerställ att OpenAI-paketet är installerat: `pip install openai`
- Verifiera att miljövariabeln GITHUB_TOKEN är satt - Kontrollera att miljövariabeln GITHUB_TOKEN är satt
- Kontrollera GitHub Models-åtkomstbehörigheter - Granska GitHub Models-accessbehörigheter
**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 repots rotkatalog - Kör från förrådets rotkatalog
- Kontrollera att `docs/_sidebar.md` finns - Kontrollera att `docs/_sidebar.md` finns
### Tips för utvecklingsmiljö ### Utvecklingsmiljötips
- Använd VS Code med Live Server-tillägg för HTML-projekt - Använd VS Code med Live Server-tillägg för HTML-projekt
- Installera ESLint och Prettier-tillägg för konsekvent formatering - Installera ESLint och Prettier-tillägg för konsekvent formatering
- Använd webbläsarens utvecklarverktyg för att debugga JavaScript - Använd webbläsarens DevTools 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
### Prestandahänsyn ### Prestandahänsyn
- Stort antal översatta filer (50+ språk) gör fulla kloner stora - Stort antal översatta filer (50+ språk) gör fulla kloningar stora
- Använd shallow clone om du bara arbetar med innehåll: `git clone --depth 1` - Använd shallow clone om du bara arbetar med innehåll: `git clone --depth 1`
- Exkludera översättningar från sökningar när du arbetar med engelskt innehåll - Exkludera översättningar från sökningar när du arbetar på engelskt innehåll
- Byggprocesser kan vara långsamma första gången (npm install, Vite build) - Byggprocesser kan vara långsamma första gången (npm install, Vite build)
## Säkerhetshänsyn ## Säkerhetshänsyn
### Miljövariabler ### Miljövariabler
- API-nycklar ska aldrig checkas in i repot - API-nycklar ska aldrig committas till förrådet
- Använd `.env`-filer (finns i `.gitignore`) - Använd `.env`-filer (redan i `.gitignore`)
- Dokumentera nödvändiga miljövariabler i projektens README - 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 tokens bör ha minimala nödvändiga rättigheter - GitHub-token ska ha minsta nödvändiga behörigheter
### GitHub Models-åtkomst ### GitHub Models-access
- Personliga access-tokens (PAT) krävs för GitHub Models - Personliga åtkomsttoken (PAT) krävs för GitHub Models
- Tokens ska lagras som miljövariabler - Token ska lagras som miljövariabler
- Aldrig checka in tokens eller inloggningsuppgifter - Committa aldrig token eller användaruppgifter
## Ytterligare anmärkningar ## Ytterligare anteckningar
### Målgrupp ### Målgrupp
- Helt nybörjare inom webbutveckling - Helt nybörjare inom webbutveckling
- Studenter och självlärande - Studenter och självstudenter
- Lärare som använder curriculumen i klassrum - Lärare som använder kursplanen i klassrum
- Innehåll designat för tillgänglighet och gradvis färdighetsutveckling - Innehållet är utformat för tillgänglighet och gradvis kompetensuppbyggnad
### Pedagogisk filosofi ### Utbildningsfilosofi
- Projektbaserat lärande - Projektbaserat lärande
- Frekventa kunskapskontroller (quiz) - Frekventa kunskapskontroller (quiz)
- Praktiska kodövningar - Praktiska kodningsövningar
- Exempel på verkliga tillämpningar - Exempel med verkliga tillämpningar
- Fokus på grunderna innan ramverk - Fokus på grunder innan ramverk
### Repositorsunderhåll ### Förrådsunderhåll
- Aktivt community av elever och bidragsgivare - Aktiv gemenskap av elever och bidragsgivare
- Regelbundna uppdateringar av beroenden och innehåll - Regelbundna uppdateringar av beroenden och innehåll
- Problem och diskussioner övervakas av underhållare - Ärenden och diskussioner övervakas av underhållare
- Översättningsuppdateringar automatiska via GitHub Actions - Översättningsuppdateringar automatiserade via GitHub Actions
### Relaterade resurser ### Relaterade resurser
- [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 kursplaner finns tillgängliga
### Arbete med specifika projekt ### Arbeta med specifika projekt
För detaljerade instruktioner om enskilda projekt, se README-filer i: För detaljerade instruktioner om enskilda projekt, se README-filer i:
- `quiz-app/README.md` - Vue 3 quizapplikation - `quiz-app/README.md` - Vue 3 quiz-applikation
- `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` - Utveckling av webbläsartillägg
- `6-space-game/README.md` - Canvas-baserat spelutveckling - `6-space-game/README.md` - Canvasbaserat spelutveckling
- `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 så innehåller repot flera oberoende projekt: Även om detta inte är ett traditionellt monorepo innehåller förrådet flera oberoende projekt:
- Varje lektion är självständig - Varje lektion är självständig
- Projekt delar inga beroenden - Projekten delar inte beroenden
- Arbeta med individuella projekt utan att påverka andra - Arbeta med individuella projekt utan att påverka andra
- Klona hela repot för hela curriculum-upplevelsen - Klona hela förrådet för hela kursplanen upplevelse
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Ansvarsfriskrivning**: **Ansvarsfriskrivning**:
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. 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 automatiska översättningar kan innehålla fel eller brister. Det ursprungliga dokumentet på dess modersmål bör anses vara 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-24T16:22:23+00:00", "translation_date": "2026-04-24T16:48:21+00:00",
"source_file": "AGENTS.md", "source_file": "AGENTS.md",
"language_code": "th" "language_code": "th"
}, },

320
translations/th/AGENTS.md
Unescape View File

@ -2,29 +2,29 @@
## ภาพรวมโครงการ ## ภาพรวมโครงการ
นี่คือแหล่งจัดเก็บหลักสูตรการศึกษาสำหรับสอนพื้นฐานการพัฒนาเว็บแก่ผู้เริ่มต้น หลักสูตรเป็นคอร์สเรียนครบวงจรความยาว 12 สัปดาห์ที่พัฒนาโดย Microsoft Cloud Advocates โดยมีบทเรียนลงมือปฏิบัติ 24 บทเรียนที่ครอบคลุม JavaScript, CSS และ HTML นี่คือรีโพสิตอรีหลักสูตรการศึกษาสำหรับสอนพื้นฐานการพัฒนาเว็บแก่ผู้เริ่มต้น หลักสูตรเป็นคอร์สครอบคลุม 12 สัปดาห์ที่พัฒนาโดย Microsoft Cloud Advocates มีบทเรียน 24 บทเรียนนำเสนอโครงการเชิงปฏิบัติที่ครอบคลุม JavaScript, CSS และ HTML
### ส่วนประกอบหลัก ### ส่วนสำคัญ
- **เนื้อหาการศึกษา**: บทเรียนที่จัดโครงสร้าง 24 บทเรียน แบ่งเป็นโมดูลแบบใช้โปรเจกต์ - **เนื้อหาการศึกษา**: 24 บทเรียนที่จัดโครงสร้างในรูปแบบโมดูลโปรเจค
- **โปรเจกต์ฝึกปฏิบัติ**: Terrarium, Typing Game, ส่วนขยายเบราว์เซอร์, เกมอวกาศ, แอปธนาคาร, ตัวแก้ไขโค้ด, และผู้ช่วยแชท 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
## คำสั่งตั้งค่า ## คำสั่งติดตั้ง
แหล่งจัดเก็บนี้เน้นการบริโภคเนื้อหาการศึกษาเป็นหลัก สำหรับการทำงานกับโปรเจกต์เฉพาะ: รีโพสิตอรีนี้เน้นสำหรับการบริโภคเนื้อหาการศึกษาหลัก หากต้องการทำงานกับโครงการเฉพาะ:
### การตั้งค่าแหล่งจัดเก็บหลัก ### การตั้งค่าหลักของรีโพสิตอรี
```bash ```bash
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
@ -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
``` ```
### Bank Project API (Node.js + Express) ### API โครงการธนาคาร (Node.js + Express)
```bash ```bash
cd 7-bank-project/api cd 7-bank-project/api
@ -51,15 +51,15 @@ 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
@ -67,42 +67,42 @@ npm install
# เปิดไฟล์ index.html ในเบราว์เซอร์หรือใช้ Live Server # เปิดไฟล์ index.html ในเบราว์เซอร์หรือใช้ Live Server
``` ```
### โปรเจกต์แชท (Backend Python) ### โครงการแชท (Python Backend)
```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. **โคลน Fork ของคุณ** ลงในเครื่อง 2. **โคลน fork** ลงในเครื่องของคุณ
3. **สร้างสาขาใหม่** สำหรับการเปลี่ยนแปลงของคุณ 3. **สร้างสาขาใหม่** สำหรับการเปลี่ยนแปลงของคุณ
4. แก้ไขเนื้อหาบทเรียนหรือตัวอย่างโค้ด 4. แก้ไขเนื้อหาบทเรียนหรือตัวอย่างโค้ด
5. ทดสอบการเปลี่ยนแปลงโค้ดในไดเรกทอรีโปรเจกต์ที่เกี่ยวข้อง 5. ทดสอบการเปลี่ยนแปลงโค้ดในไดเรกทอรีโครงการที่เกี่ยวข้อง
6. ส่ง pull request ตามแนวทางการมีส่วนร่วม 6. ส่ง pull request ตามแนวทางการมีส่วนร่วม
### สำหรับผู้เรียน ### สำหรับผู้เรียน
1. Fork หรือโคลนแหล่งจัดเก็บ 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 ที่เกี่ยวข้อง
## คำแนะนำการทดสอบ ## คำแนะนำการทดสอบ
@ -111,86 +111,86 @@ 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
```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 แบบ Semantic - ใช้องค์ประกอบ HTML5 เชิงความหมาย
- หลักการออกแบบที่ตอบสนองได้ - หลักการออกแบบตอบสนอง
- การตั้งชื่อคลาสอย่างชัดเจน - การตั้งชื่อคลาสที่ชัดเจน
- คอมเมนต์อธิบายเทคนิค CSS สำหรับผู้เรียน - คอมเมนต์อธิบายเทคนิค CSS สำหรับผู้เรียน
### Python ### Python
- ปฏิบัติตามแนวทางสไตล์ PEP 8 - แนวทางสไตล์ PEP 8
- ตัวอย่างโค้ดที่ชัดเจนและเหมาะสำหรับการศึกษา - ตัวอย่างโค้ดชัดเจนและเหมาะสำหรับการศึกษา
- ใช้คำบอกประเภทเมื่อช่วยให้เรียนรู้ได้ดีขึ้น - ใส่ type hints เมื่อต้องการช่วยการเรียนรู้
### เอกสาร 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 เมื่อ push ไปยัง main # นำส่งผ่าน workflow ของ GitHub Actions เมื่อมีการ push ไปยัง 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`
### การสร้างเอกสาร PDF ### การสร้างเอกสาร PDF
@ -207,76 +207,76 @@ npm install -g docsify-cli # ติดตั้ง Docsify ทั่วโล
docsify serve # ให้บริการบน localhost:3000 docsify serve # ให้บริการบน localhost:3000
``` ```
### การสร้างเฉพาะโปรเจกต์ ### การสร้างเฉพาะโครงการ
แต่ละโฟลเดอร์โปรเจกต์อาจมีขั้นตอนการสร้างของตัวเอง: ไดเรกทอรีโครงการแต่ละอันอาจมีขั้นตอนการสร้างของตัวเอง:
- โปรเจกต์ Vue: รัน `npm run build` เพื่อสร้าง production bundle - โครงการ Vue: รัน `npm run build` เพื่อสร้างบันเดิลสำหรับผลิต
- โปรเจกต์สแตติก: ไม่มีขั้นตอนการสร้าง รันไฟล์โดยตรง - โครงการสแตติก: ไม่มีขั้นตอนการสร้าง เสิร์ฟไฟล์โดยตรง
## แนวทางการส่ง 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` ในไดเรกทอรีโครงการที่ได้รับผลกระทบ
- แก้ไขข้อผิดพลาดและคำเตือนทั้งหมดเกี่ยวกับ lint - แก้ไขข้อผิดพลาดและคำเตือน 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) สำหรับแนวทางรายละเอียด
- อ้างอิงหมายเลขปัญหาในคำอธิบาย 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:
@ -293,116 +293,116 @@ CO_OP_TRANSLATOR_METADATA:
### ปัญหาทั่วไป ### ปัญหาทั่วไป
**Quiz app ไม่เริ่มทำงาน**: **Quiz app เริ่มต้นไม่ขึ้น**:
- ตรวจสอบเวอร์ชัน 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 ฟอร์แมตถูกต้อง
- ตรวจสอบคอนโซลเบราว์เซอร์หา error - ตรวจดูคอนโซลเบราว์เซอร์หาข้อผิดพลาด
- ปฏิบัติตามคำแนะนำการติดตั้งส่วนขยายเฉพาะเบราว์เซอร์ - ทำตามคำแนะนำการติดตั้งส่วนขยายที่เจาะจงเบราว์เซอร์
**ปัญหาโปรเจกต์แชท Python**: **ปัญหาโครงการแชท Python**:
- ตรวจสอบว่าแพ็กเกจ OpenAI ถูกติดตั้ง: `pip install openai` - ติดตั้งแพ็กเกจ OpenAI: `pip install openai`
- ยืนยันตัวแปรสภาพแวดล้อม GITHUB_TOKEN ถูกตั้งค่า - ตรวจสอบว่า environment variable 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 สำหรับโครงการ 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 ลงในแหล่งจัดเก็บโดยตรง - ไม่ควร commit คีย์ API ลงในรีโพสิตอรี
- ใช้ไฟล์ `.env` (มีอยู่ใน `.gitignore` แล้ว) - ใช้ไฟล์ `.env` (ที่มีใน `.gitignore` แล้ว)
- อธิบายตัวแปรสภาพแวดล้อมที่ต้องใช้ใน README ของแต่ละโปรเจกต์ - แจ้งตัวแปรสภาพแวดล้อมที่จำเป็นใน README ของโครงการ
### โปรเจกต์ Python ### โครงการ Python
- ใช้ virtual environment: `python -m venv venv` - ใช้สภาพแวดล้อมเสมือน: `python -m venv venv`
- อัปเดต dependencies อย่างสม่ำเสมอ - อัปเดต dependencies อยู่เสมอ
- GitHub token ควรมีสิทธิ์ขั้นต่ำที่จำเป็น - โทเค็น GitHub ควรมีสิทธิ์จำกัดตามจำเป็น
### การเข้าถึง GitHub Models ### การเข้าถึง GitHub Models
- ต้องใช้ Personal Access Tokens (PAT) - ต้องใช้ Personal Access Tokens (PAT) เพื่อ GitHub Models
- เก็บ token เป็นตัวแปรสภาพแวดล้อม - โทเค็นควรเก็บเป็นตัวแปรสภาพแวดล้อม
- ห้าม commit token หรือข้อมูลรับรองลงในแหล่งจัดเก็บ - ห้าม commit โทเค็นหรือข้อมูลรับรอง
## บันทึกเพิ่มเติม ## หมายเหตุเพิ่มเติม
### กลุ่มเป้าหมาย ### กลุ่มเป้าหมาย
- ผู้เริ่มต้นเรียนรู้พัฒนาเว็บอย่างสมบูรณ์ - ผู้เริ่มต้นใหม่ทั้งหมดในการพัฒนาเว็บ
- นักเรียนและผู้เรียนด้วยตนเอง - นักเรียนและผู้เรียนด้วยตนเอง
- ครูผู้ใช้หลักสูตรในชั้นเรียน - ครูผู้ใช้หลักสูตรในห้องเรียน
- ออกแบบเนื้อหาให้เข้าถึงได้และค่อยๆ สร้างทักษะ - เนื้อหาออกแบบเพื่อการเข้าถึงและสร้างทักษะทีละขั้น
### ปรัชญาการศึกษา ### ปรัชญาการศึกษา
- แนวทางการเรียนรู้โดยใช้โปรเจกต์ - วิธีการเรียนรู้โดยโครงการ
- การตรวจสอบความเข้าใจบ่อยครั้ง (แบบทดสอบ) - การตรวจสอบความรู้เป็นระยะ (แบบทดสอบ)
- แบบฝึกหัดเขียนโค้ดลงมือทำ - แบบฝึกหัดเขียนโค้ดจริง
- ตัวอย่างการใช้งานจริง - ตัวอย่างการใช้งานโลกจริง
- ให้ความสำคัญพื้นฐานก่อนเริ่มใช้เฟรมเวิร์ก - เน้นพื้นฐานก่อนเฟรมเวิร์ก
### การดูแลรักษาแหล่งเก็บ ### การบำรุงรักษารีโพสิตอรี
- ชุมชนผู้เรียนและผู้มีส่วนร่วมที่แอคทีฟ - ชุมชนผู้เรียนและผู้ร่วมพัฒนาอย่างแข็งขัน
- อัปเดต 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 มีให้เลือกเรียน - คอร์สเพิ่มเติม: Generative AI, Data Science, 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 แบบดั้งเดิม แต่แหล่งเก็บนี้ประกอบด้วยโปรเจกต์อิสระหลายโปรเจกต์: แม้จะไม่ใช่มอนอรีโพแบบดั้งเดิม แต่รีโพสิตอรีนี้มีหลายโครงการอิสระ:
- บทเรียนแต่ละบทเป็นอิสระ - บทเรียนแต่ละอันแยกตัวเอง
- โปรเจกต์ไม่แชร์ dependencies กัน - โครงการไม่แชร์ dependencies กัน
- ทำงานกับโปรเจกต์แต่ละตัวโดยไม่กระทบกัน - ทำงานกับโครงการแต่ละอันโดยไม่กระทบกัน
- โคลนแหล่งเก็บทั้งหมดเพื่อรับประสบการณ์หลักสูตรครบถ้วน - โคลนรีโพสิตอรีทั้งชุดเพื่อประสบการณ์หลักสูตรเต็มรูปแบบ
--- ---
<!-- CO-OP TRANSLATOR DISCLAIMER START --> <!-- CO-OP TRANSLATOR DISCLAIMER START -->
**ข้อแจ้งให้ทราบ**: **ข้อจำกัดความรับผิดชอบ**:
เอกสารนี้ถูกแปลโดยใช้บริการแปลภาษา AI [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