Web-Dev-For-Beginners/translations/el

Ανάπτυξη Ιστού για Αρχάριους - Ένα Εκπαιδευτικό Πρόγραμμα

Μάθετε τα βασικά της ανάπτυξης ιστού με το 12-εβδομαδιαίο ολοκληρωμένο πρόγραμμα της Microsoft Cloud Advocates. Κάθε ένα από τα 24 μαθήματα εστιάζει σε JavaScript, CSS και HTML μέσω πρακτικών έργων όπως terrariums, επεκτάσεις προγράμματος περιήγησης και παιχνίδια στο διάστημα. Συμμετέχετε σε κουίζ, συζητήσεις και πρακτικές εργασίες. Βελτιώστε τις δεξιότητές σας και ενισχύστε τη γνώση σας με την αποτελεσματική παιδαγωγική που βασίζεται σε έργα. Ξεκινήστε το ταξίδι σας στον προγραμματισμό σήμερα!

🧑‍🎓 Είστε φοιτητής;

Επισκεφθείτε τη σελίδα Student Hub όπου θα βρείτε πόρους για αρχάριους, πακέτα για φοιτητές και ακόμη και τρόπους να αποκτήσετε δωρεάν πιστοποιητικό. Αυτή είναι η σελίδα που πρέπει να προσθέσετε στους σελιδοδείκτες σας και να ελέγχετε τακτικά, καθώς το περιεχόμενο αλλάζει κάθε μήνα.

📣 Ανακοίνωση - Νέο Εκπαιδευτικό Πρόγραμμα για Γενετική Τεχνητή Νοημοσύνη με JavaScript μόλις κυκλοφόρησε

Μην χάσετε το νέο μας εκπαιδευτικό πρόγραμμα για Γενετική Τεχνητή Νοημοσύνη!

Επισκεφθείτε https://aka.ms/genai-js-course για να ξεκινήσετε!

• Μαθήματα που καλύπτουν τα πάντα, από τα βασικά έως το RAG.
• Αλληλεπιδράστε με ιστορικούς χαρακτήρες χρησιμοποιώντας GenAI και την εφαρμογή μας.
• Διασκεδαστική και ενδιαφέρουσα αφήγηση, θα ταξιδέψετε στον χρόνο!

Κάθε μάθημα περιλαμβάνει μια εργασία για ολοκλήρωση, έναν έλεγχο γνώσεων και μια πρόκληση για να σας καθοδηγήσει σε θέματα όπως:

• Δημιουργία προτροπών και μηχανική προτροπών
• Δημιουργία εφαρμογών κειμένου και εικόνας
• Εφαρμογές αναζήτησης

Επισκεφθείτε https://aka.ms/genai-js-course για να ξεκινήσετε!

🌱 Ξεκινώντας

Καθηγητές, έχουμε συμπεριλάβει κάποιες προτάσεις για το πώς να χρησιμοποιήσετε αυτό το εκπαιδευτικό πρόγραμμα. Θα θέλαμε να ακούσουμε τη γνώμη σας στο φόρουμ συζητήσεων μας!

Μαθητές, για κάθε μάθημα, ξεκινήστε με ένα κουίζ πριν το μάθημα και συνεχίστε με την ανάγνωση του υλικού, την ολοκλήρωση των δραστηριοτήτων και ελέγξτε την κατανόησή σας με το κουίζ μετά το μάθημα.

Για να βελτιώσετε την εμπειρία μάθησης σας, συνδεθείτε με τους συναδέλφους σας για να εργαστείτε μαζί στα έργα! Οι συζητήσεις ενθαρρύνονται στο φόρουμ συζητήσεων όπου η ομάδα των συντονιστών μας θα είναι διαθέσιμη να απαντήσει στις ερωτήσεις σας.

Για να προχωρήσετε την εκπαίδευσή σας, συνιστούμε ανεπιφύλακτα να εξερευνήσετε το Microsoft Learn για επιπλέον υλικό μελέτης.

📋 Ρύθμιση του περιβάλλοντός σας

Αυτό το εκπαιδευτικό πρόγραμμα έχει έτοιμο περιβάλλον ανάπτυξης! Καθώς ξεκινάτε, μπορείτε να επιλέξετε να εκτελέσετε το πρόγραμμα σε ένα Codespace (ένα περιβάλλον που βασίζεται στον περιηγητή, χωρίς ανάγκη εγκατάστασης), ή τοπικά στον υπολογιστή σας χρησιμοποιώντας έναν επεξεργαστή κειμένου όπως το Visual Studio Code.

Δημιουργία του αποθετηρίου σας

Για να αποθηκεύσετε εύκολα τη δουλειά σας, συνιστάται να δημιουργήσετε ένα αντίγραφο αυτού του αποθετηρίου. Μπορείτε να το κάνετε κάνοντας κλικ στο κουμπί Use this template στην κορυφή της σελίδας. Αυτό θα δημιουργήσει ένα νέο αποθετήριο στον λογαριασμό σας στο GitHub με ένα αντίγραφο του εκπαιδευτικού προγράμματος.

Ακολουθήστε αυτά τα βήματα:

1. Fork το Αποθετήριο: Κάντε κλικ στο κουμπί "Fork" στην πάνω δεξιά γωνία αυτής της σελίδας.
2. Clone το Αποθετήριο: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

Εκτέλεση του προγράμματος σε ένα Codespace

Στο αντίγραφο του αποθετηρίου που δημιουργήσατε, κάντε κλικ στο κουμπί Code και επιλέξτε Open with Codespaces. Αυτό θα δημιουργήσει ένα νέο Codespace για να εργαστείτε.

Εκτέλεση του προγράμματος τοπικά στον υπολογιστή σας

Για να εκτελέσετε το πρόγραμμα τοπικά στον υπολογιστή σας, θα χρειαστείτε έναν επεξεργαστή κειμένου, έναν περιηγητή και ένα εργαλείο γραμμής εντολών. Το πρώτο μας μάθημα, Εισαγωγή στις Γλώσσες Προγραμματισμού και Εργαλεία, θα σας καθοδηγήσει στις διάφορες επιλογές για κάθε ένα από αυτά τα εργαλεία ώστε να επιλέξετε αυτό που σας ταιριάζει καλύτερα.

Η πρότασή μας είναι να χρησιμοποιήσετε το Visual Studio Code ως επεξεργαστή, το οποίο διαθέτει επίσης ενσωματωμένο Terminal. Μπορείτε να κατεβάσετε το Visual Studio Code εδώ.

1. Κλωνοποιήστε το αποθετήριο σας στον υπολογιστή σας. Μπορείτε να το κάνετε κάνοντας κλικ στο κουμπί Code και αντιγράφοντας το URL:

   

   Στη συνέχεια, ανοίξτε το Terminal μέσα στο Visual Studio Code και εκτελέστε την παρακάτω εντολή, αντικαθιστώντας το <your-repository-url> με το URL που μόλις αντιγράψατε:

   git clone <your-repository-url>
   

2. Ανοίξτε τον φάκελο στο Visual Studio Code. Μπορείτε να το κάνετε κάνοντας κλικ στο File > Open Folder και επιλέγοντας τον φάκελο που μόλις κλωνοποιήσατε.

Συνιστώμενες επεκτάσεις για το Visual Studio Code:

• Live Server - για προεπισκόπηση σελίδων HTML μέσα στο Visual Studio Code
• Copilot - για να σας βοηθήσει να γράφετε κώδικα πιο γρήγορα

📂 Κάθε μάθημα περιλαμβάνει:

• προαιρετικό σκίτσο
• προαιρετικό συμπληρωματικό βίντεο
• κουίζ προθέρμανσης πριν το μάθημα
• γραπτό μάθημα
• για μαθήματα που βασίζονται σε έργα, οδηγίες βήμα προς βήμα για την κατασκευή του έργου
• έλεγχοι γνώσεων
• μια πρόκληση
• συμπληρωματική ανάγνωση
• εργασία
• κουίζ μετά το μάθημα

Σημείωση για τα κουίζ: Όλα τα κουίζ βρίσκονται στον φάκελο Quiz-app, συνολικά 48 κουίζ με τρεις ερωτήσεις το καθένα. Συνδέονται μέσα από τα μαθήματα και η εφαρμογή κουίζ μπορεί να εκτελεστεί τοπικά ή να αναπτυχθεί στο Azure. Ακολουθήστε τις οδηγίες στον φάκελο quiz-app. Τα κουίζ μεταφράζονται σταδιακά.

🗃️ Μαθήματα

	Όνομα Έργου	Διδασκόμενες Έννοιες	Στόχοι Μάθησης	Συνδεδεμένο Μάθημα	Συγγραφέας
01	Ξεκινώντας	Εισαγωγή στον Προγραμματισμό και Εργαλεία	Μάθετε τις βασικές αρχές πίσω από τις περισσότερες γλώσσες προγραμματισμού και για το λογισμικό που βοηθά τους επαγγελματίες προγραμματιστές να κάνουν τη δουλειά τους	Εισαγωγή στις Γλώσσες Προγραμματισμού και Εργαλεία	Jasmine
02	Ξεκινώντας	Βασικά του GitHub, περιλαμβάνει εργασία με ομάδα	Πώς να χρησιμοποιήσετε το GitHub στο έργο σας, πώς να συνεργαστείτε με άλλους σε μια βάση κώδικα	Εισαγωγή στο GitHub	Floor
03	Ξεκινώντας	Προσβασιμότητα	Μάθετε τα βασικά της προσβασιμότητας στον ιστό	Βασικές Αρχές Προσβασιμότητας	Christopher
04	Βασικά JS	Τύποι Δεδομένων JavaScript	Τα βασικά των τύπων δεδομένων JavaScript	Τύποι Δεδομένων	Jasmine
05	Βασικά JS	Συναρτήσεις και Μέθοδοι	Μάθετε για τις συναρτήσεις και τις μεθόδους για τη διαχείριση της λογικής ροής μιας εφαρμογής	Συναρτήσεις και Μέθοδοι	Jasmine και Christopher
06	Βασικά JS	Λήψη Αποφάσεων με JS	Μάθετε πώς να δημιουργείτε συνθήκες στον κώδικά σας χρησιμοποιώντας μεθόδους λήψης αποφάσεων	Λήψη Αποφάσεων	Jasmine
07	Βασικά JS	Πίνακες και Βρόχοι	Εργαστείτε με δεδομένα χρησιμοποιώντας πίνακες και βρόχους στη JavaScript	Πίνακες και Βρόχοι	Jasmine
08	Terrarium	HTML στην Πράξη	Δημιουργήστε το HTML για να φτιάξετε ένα online terrarium, εστιάζοντας στη δημιουργία διάταξης	Εισαγωγή στο HTML	Jen
09	Terrarium	CSS στην Πράξη	Δημιουργήστε το CSS για να σχεδιάσετε το online terrarium, εστιάζοντας στα βασικά του CSS, συμπεριλαμβανομένου του να κάνετε τη σελίδα responsive	Εισαγωγή στο CSS	Jen
10	Terrarium	Κλεισίματα JavaScript, χειρισμός DOM	Δημιουργήστε το JavaScript για να κάνετε το terrarium να λειτουργεί ως διεπαφή drag/drop, εστιάζοντας στα κλεισίματα και τον χειρισμό DOM	Κλεισίματα JavaScript, χειρισμός DOM	Jen
11	Typing Game	Δημιουργία Παιχνιδιού Πληκτρολόγησης	Μάθετε πώς να χρησιμοποιείτε συμβάντα πληκτρολογίου για να καθοδηγήσετε τη λογική της εφαρμογής σας	Προγραμματισμός με Βάση Συμβάντα	Christopher
12	Green Browser Extension	Εργασία με Περιηγητές	Μάθετε πώς λειτουργούν οι περιηγητές, την ιστορία τους και πώς να δημιουργήσετε τα πρώτα στοιχεία μιας επέκτασης περιηγητή	Σχετικά με τους Περιηγητές	Jen
13	Green Browser Extension	Δημιουργία φόρμας, κλήση API και αποθήκευση μεταβλητών στο τοπικό storage	Δημιουργήστε τα στοιχεία JavaScript της επέκτασης περιηγητή σας για να καλέσετε ένα API χρησιμοποιώντας μεταβλητές αποθηκευμένες στο τοπικό storage	APIs, Φόρμες και Τοπικό Storage	Jen
14	Green Browser Extension	Διεργασίες παρασκηνίου στον περιηγητή, απόδοση ιστού	Χρησιμοποιήστε τις διεργασίες παρασκηνίου του περιηγητή για να διαχειριστείτε το εικονίδιο της επέκτασης· μάθετε για την απόδοση ιστού και κάποιες βελτιστοποιήσεις	Διεργασίες Παρασκηνίου και Απόδοση	Jen
15	Space Game	Πιο Προχωρημένη Ανάπτυξη Παιχνιδιών με JavaScript	Μάθετε για την Κληρονομικότητα χρησιμοποιώντας τόσο Κλάσεις όσο και Σύνθεση και το μοτίβο Pub/Sub, ως προετοιμασία για τη δημιουργία ενός παιχνιδιού	Εισαγωγή στην Προχωρημένη Ανάπτυξη Παιχνιδιών	Chris
16	Space Game	Σχεδίαση σε καμβά	Μάθετε για το API του Καμβά, που χρησιμοποιείται για να σχεδιάσετε στοιχεία στην οθόνη	Σχεδίαση σε Καμβά	Chris
17	Space Game	Μετακίνηση στοιχείων στην οθόνη	Ανακαλύψτε πώς τα στοιχεία μπορούν να αποκτήσουν κίνηση χρησιμοποιώντας καρτεσιανές συντεταγμένες και το API του Καμβά	Μετακίνηση Στοιχείων	Chris
18	Space Game	Ανίχνευση συγκρούσεων	Κάντε τα στοιχεία να συγκρούονται και να αντιδρούν μεταξύ τους χρησιμοποιώντας πατήματα πλήκτρων και παρέχετε μια λειτουργία cooldown για την απόδοση του παιχνιδιού	Ανίχνευση Συγκρούσεων	Chris
19	Space Game	Καταγραφή σκορ	Εκτελέστε μαθηματικούς υπολογισμούς με βάση την κατάσταση και την απόδοση του παιχνιδιού	Καταγραφή Σκορ	Chris
20	Space Game	Τερματισμός και επανεκκίνηση του παιχνιδιού	Μάθετε για τον τερματισμό και την επανεκκίνηση του παιχνιδιού, συμπεριλαμβανομένης της εκκαθάρισης πόρων και της επαναφοράς τιμών μεταβλητών	Συνθήκη Τερματισμού	Chris
21	Banking App	Πρότυπα HTML και Διαδρομές σε μια Web Εφαρμογή	Μάθετε πώς να δημιουργήσετε τη δομή της αρχιτεκτονικής μιας ιστοσελίδας πολλαπλών σελίδων χρησιμοποιώντας διαδρομές και πρότυπα HTML	Πρότυπα HTML και Διαδρομές	Yohan
22	Banking App	Δημιουργία Φόρμας Εισόδου και Εγγραφής	Μάθετε για τη δημιουργία φορμών και τη διαχείριση διαδικασιών επικύρωσης	Φόρμες	Yohan
23	Banking App	Μέθοδοι Ανάκτησης και Χρήσης Δεδομένων	Πώς τα δεδομένα ρέουν μέσα και έξω από την εφαρμογή σας, πώς να τα ανακτήσετε, να τα αποθηκεύσετε και να τα διαχειριστείτε	Δεδομένα	Yohan
24	Banking App	Έννοιες Διαχείρισης Κατάστασης	Μάθετε πώς η εφαρμογή σας διατηρεί την κατάσταση και πώς να τη διαχειριστείτε προγραμματιστικά	Διαχείριση Κατάστασης	Yohan

🏫 Παιδαγωγική

Το πρόγραμμα σπουδών μας έχει σχεδιαστεί με δύο βασικές παιδαγωγικές αρχές:

• μάθηση βασισμένη σε έργα
• συχνά κουίζ

Το πρόγραμμα διδάσκει τα βασικά του JavaScript, HTML και CSS, καθώς και τα πιο πρόσφατα εργαλεία και τεχνικές που χρησιμοποιούν οι σύγχρονοι web developers. Οι μαθητές θα έχουν την ευκαιρία να αποκτήσουν πρακτική εμπειρία δημιουργώντας ένα παιχνίδι πληκτρολόγησης, ένα εικονικό terrarium, μια φιλική προς το περιβάλλον επέκταση περιηγητή, ένα παιχνίδι τύπου space-invader και μια τραπεζική εφαρμογή για επιχειρήσεις. Μέχρι το τέλος της σειράς, οι μαθητές θα έχουν αποκτήσει μια σταθερή κατανόηση της ανάπτυξης ιστού.

🎓 Μπορείτε να παρακολουθήσετε τα πρώτα μαθήματα αυτού του προγράμματος σπουδών ως Learn Path στο Microsoft Learn!

Με την εξασφάλιση ότι το περιεχόμενο ευθυγραμμίζεται με έργα, η διαδικασία γίνεται πιο ενδιαφέρουσα για τους μαθητές και η διατήρηση των εννοιών ενισχύεται. Γράψαμε επίσης αρκετά εισαγωγικά μαθήματα στα βασικά του JavaScript για την εισαγωγή εννοιών, συνοδευόμενα από ένα βίντεο από τη συλλογή "Beginners Series to: JavaScript" με εκπαιδευτικά βίντεο, μερικοί από τους συγγραφείς των οποίων συνέβαλαν σε αυτό το πρόγραμμα σπουδών.

Επιπλέον, ένα κουίζ χαμηλού κινδύνου πριν από την τάξη θέτει την πρόθεση του μαθητή προς την εκμάθηση ενός θέματος, ενώ ένα δεύτερο κουίζ μετά την τάξη εξασφαλίζει περαιτέρω διατήρηση. Αυτό το πρόγραμμα σπουδών σχεδιάστηκε για να είναι ευέλικτο και διασκεδαστικό και μπορεί να παρακολουθηθεί ολόκληρο ή εν μέρει. Τα έργα ξεκινούν μικρά και γίνονται όλο και πιο περίπλοκα μέχρι το τέλος του 12-εβδομαδιαίου κύκλου.

Παρόλο που αποφύγαμε σκόπιμα την εισαγωγή JavaScript frameworks για να επικεντρωθούμε στις βασικές δεξιότητες που χρειάζονται ως web developer πριν από την υιοθέτηση ενός framework, ένα καλό επόμενο βήμα μετά την ολοκλήρωση αυτού του προγράμματος σπουδών θα ήταν η εκμάθηση του Node.js μέσω μιας άλλης συλλογής βίντεο: "Beginner Series to: Node.js".

Επισκεφθείτε τις Οδηγίες Συμπεριφοράς και τις Οδηγίες Συνεισφοράς. Καλωσορίζουμε τα εποικοδομητικά σας σχόλια!

🧭 Πρόσβαση εκτός σύνδεσης

Μπορείτε να εκτελέσετε αυτήν την τεκμηρίωση εκτός σύνδεσης χρησιμοποιώντας το Docsify. Κάντε fork αυτό το repo, εγκαταστήστε το Docsify στον τοπικό σας υπολογιστή και στη συνέχεια, στον root φάκελο αυτού του repo, πληκτρολογήστε docsify serve. Ο ιστότοπος θα εξυπηρετείται στην πόρτα 3000 του localhost σας: localhost:3000.

📘 PDF

Ένα PDF όλων των μαθημάτων μπορείτε να βρείτε εδώ.

🎒 Άλλα Μαθήματα

Η ομάδα μας παράγει και άλλα μαθήματα! Δείτε:

• Generative AI for Beginners
• Generative AI for Beginners .NET
• Generative AI with JavaScript
• Generative AI with Java
• AI for Beginners
• Data Science for Beginners
• ML for Beginners
• Cybersecurity for Beginners
• Web Dev for Beginners
• IoT for Beginners
• XR Development for Beginners
• Mastering GitHub Copilot for Agentic use
• Mastering GitHub Copilot for C#/.NET Developers
• Choose Your Own Copilot Adventure

Άδεια Χρήσης

Αυτό το αποθετήριο έχει άδεια χρήσης υπό την άδεια MIT. Δείτε το αρχείο LICENSE για περισσότερες πληροφορίες.

---

Αποποίηση ευθύνης:
Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας την υπηρεσία αυτόματης μετάφρασης Co-op Translator. Παρόλο που καταβάλλουμε προσπάθειες για ακρίβεια, παρακαλούμε να έχετε υπόψη ότι οι αυτοματοποιημένες μεταφράσεις ενδέχεται να περιέχουν λάθη ή ανακρίβειες. Το πρωτότυπο έγγραφο στη μητρική του γλώσσα θα πρέπει να θεωρείται η αυθεντική πηγή. Για κρίσιμες πληροφορίες, συνιστάται επαγγελματική ανθρώπινη μετάφραση. Δεν φέρουμε ευθύνη για τυχόν παρεξηγήσεις ή εσφαλμένες ερμηνείες που προκύπτουν από τη χρήση αυτής της μετάφρασης.