2020-05-17 13:57:11
Η συνέχεια του μαθήματος Εισαγωγή στην ανάπτυξη ιστοσελίδων με HTML5, CSS3, Javascript στο
https://mathesis.cup.gr/
Απομαγνητοφώνηση
Ξεκινάμε εδώ μία σειρά από δύο μαθήματα στο mathesis με αντικείμενο τον προγραμματισμό του διαδικτύου. Απευθύνονται σε ένα ευρύ κοινό, όχι σε ειδικούς πληροφορικής και προγραμματισμού και έχουν σα στόχο να δούμε βασικές τεχνολογίες που κρύβονται πίσω από τις ιστοσελίδες και τις εφαρμογές στο διαδίκτυο με τις οποίες είμαστε σε επαφή κάθε μέρα στη ζωή μας. Το πρώτο μάθημα είναι εισαγωγικό στις τεχνολογίες html, css και JavaScript οι τρεις βασικές τεχνολογίες του διαδικτύου σήμερα και θα στο τέλος αυτού του μαθήματος Θα είμαστε σε θέση να φτιάξουμε στατικές ιστοσελίδες χρησιμοποιώντας αυτές τις τεχνολογίες. Το δεύτερο μάθημα έχει πιο προχωρημένα πράγματα και χτίζεται πάνω σε ότι είδαμε στο πρώτο από αυτά.
Θα ξεκινήσουμε με κάποιους βασικούς ορισμούς για την ορολογία, την ορολογία που έχει μπει στην καθημερινή μας ζωή
. Λέξεις όπως το διαδίκτυο είναι πια στα χείλη όλων μας. Τι είναι όμως το διαδίκτυο; Εδώ υπάρχει και μία σύγχυση ανάμεσα στο διαδίκτυο που είναι το παγκόσμιο σύστημα διασυνδεδεμένων υπολογιστών που χρησιμοποιεί κάποια βασικά πρωτόκολλα όπως είναι το TCP/IP και στο τι είναι η εφαρμογή του παγκόσμιου ιστού το web, που στα ελληνικά οι δύο όροι χρησιμοποιούνται ο ένας έναντι του άλλου. Ο Παγκόσμιος Ιστός είναι ουσιαστικά η πιο σημαντική υπηρεσία του διαδικτύου και είναι αυτή με την οποία ερχόμαστε σε επαφή σε καθημερινή βάση.
Η χρήση του διαδικτύου όπως όλοι ξέρουμε άρχισε να αναπτύσσεται με την εφεύρεση του παγκόσμιου ιστού στις αρχές της δεκαετίας του 90 και από τότε έχει εκθετική ανάπτυξη και αυτή τη στιγμή καλύπτει κάθε πτυχή της σύγχρονης ζωής μας. Απλώς να αναφερθούμε σε μερικά στοιχεία όπως ότι το διαδίκτυο είναι ένα δίκτυο υπολογιστών χωρίς κεντρική οργάνωση. Δεν υπάρχει ένας κεντρικός server. Υπάρχουν κάποιοι οργανισμοί οι οποίοι κανονίζουν την διευθυνσιοδότηση των υπολογιστών, τις IP διευθύνσεις και τη λειτουργία Domain Name Server αλλά μέχρι εκεί. Ίσως όμως θα πρέπει να πούμε ότι τα μαθήματα προγραμματισμού του διαδικτύου εστιάζουν και αφορούν στον προγραμματισμό εφαρμογών του παγκόσμιου ιστού. Τι είναι ο Παγκόσμιος Ιστός ; Στην ουσία είναι ένα πληροφοριακό σύστημα που περιέχει έγγραφα, ιστοσελίδες τα οποία είναι κείμενα αλλά και περιέχουν άλλους δικτυακούς πόρους εικόνες βίντεο audio κλπ, έχουν διευθύνσεις με ένα σύστημα διευθυνσιοδότησης που ονομάζεται Uniform Resource Locators (URLs) διεύθυνση δηλαδή στην οποία μπορούμε να καλέσουμε, να έχουμε πρόσβαση σε μία ιστοσελίδα. H βασική ιδέα εδώ είναι ότι αυτές οι ιστοσελίδες, αυτοί οι πόροι διασυνδέονται υπό μορφή ενός όπως λέγεται υπερκείμενου γιατί περιέχουν μέσα τους η καθεμία από αυτές συνδέσμους σε άλλες τέτοιες σελίδες. Έτσι φτιάχνεται ένας ιστός εξ ου και η λέξη παγκόσμιος ιστός world wide web, ένας ιστός διασυνδεδεμένων ιστοσελίδων.
Η πρόσβαση τώρα είναι εύκολη σε αυτές με τη χρήση κάποιων εφαρμογών που υπάρχουν σε όλους τους υπολογιστές σήμερα που είναι οι browsers, οι φυλλομετρητές όπως είναι το Chrome, Firefox, Edge κλπ. Θα πρέπει εδώ και με βάση αυτή την μικρή εισαγωγή να κάνω μία ιδιαίτερη αναφορά σε μία προσωπικότητα, που είναι ο Tim Bernes Lee στον οποίο οφείλεται αυτή η τεχνολογία. Όχι μόνο την εφηύρε, αλλά αποφάσισε από την αρχή να την ανοίξει, να τη διαθέσει ελεύθερα στην κοινωνία, στην ευρύτερη παγκόσμια κοινότητα. Ο Tim Berners Lee λοιπόν ήταν ένας μηχανικός ο οποίος δούλευε στο CERN στο κέντρο θεωρητικής φυσικής στην Ελβετία. Στις αρχές της δεκαετίας του 90 πρότεινε τη διασύνδεση δύο εννοιών που υπήρχαν ήδη, το διαδίκτυο είναι πολύ πιο παλιό από το Web από τη δεκαετία του 60 υπάρχει το διαδίκτυο, και τα πρωτόκολλα του TCP/IP. Ο Berners Lee όμως είχε την ιδέα να συνδέσει το διαδίκτυο με μία έννοια που επίσης υπήρχε από παλιότερα που είναι η έννοια του υπερκειμένου. Έφτιαξε δηλαδή και όρισε τα πρωτόκολλα μέσω των οποίων το υπερκείμενο μπορεί να συνδέεται και να διαδίδεται μέσω του διαδικτύου. Οι τεχνολογίες που πρότεινε ο Berners Lee ήδη από τις αρχές της δεκαετίας του 90 είναι οι εξής τρεις οι οποίες είναι πολύ σημαντικές και θα μας απασχολήσουν σε αυτό εδώ το μάθημα. Είναι ένα πρωτόκολλο μετάδοσης υπερκειμένου που ονομάζεται HTTP Hypertext Transfer Protocol, μία γλώσσα μέσω της οποίας μπορώ να δομώ και να παρουσιάζω το περιεχόμενο υπερκείμενων. Γλώσσα δηλαδή επισημείωσης όπως λέμε υπερκείμενων πού είναι η γλώσσα HTML Hyper-Text Markup Language και ο μηχανισμός, το πρωτόκολλο βάσει του οποίου ορίζονται οι διευθύνσεις των ιστοσελίδων. Αυτό είναι το Uniform Resource Locator το URL κι αν θέλουμε εδώ μπορούμε να δούμε τον Tim Berners Lee το 1989 μπροστά στην πρώτη ιστοσελίδα. Αξίζει λοιπόν με βάση αυτά τα στοιχεία που είναι τα δομικά στοιχεία που ορίζουν την αρχιτεκτονική του παγκόσμιου ιστού να δούμε με λίγο λεπτομέρεια τη λειτουργία του. Ας πούμε ότι είμαστε μπροστά σε έναν browser, σε μία εφαρμογή που έχουν όλοι οι υπολογιστές και πληκτρολογούμε μία ιστοσελίδα, μία διεύθυνση. Γράφουμε www.google.com. Θα δημιουργηθεί ένα μήνυμα το οποίο θα σταλεί και εδώ θα παίζει ρόλο ο μηχανισμός ο οποίος επιτρέπει την αναζήτηση του υπολογιστή ο οποίος είναι ικανός να εξυπηρετήσει αυτή τη συγκεκριμένη απαίτηση και θα καταλήξει το μήνυμα μας σε αυτόν τον υπολογιστή ο οποίος είναι ένας server, ένας εξυπηρετητής που περιέχει το περιεχόμενο που εμείς αναζητούμε. Το μήνυμα θα ταξιδέψει με το πρωτόκολλο HTTP. Εδώ επεισέρχεται και χρησιμοποιείται το πρωτόκολλο HTTP. Ένα μήνυμα μάλιστα τύπου GET που είναι ο πιο συνηθισμένος τύπος μηνυμάτων HTTP, θα ταξιδέψει περνώντας από διαδοχικούς υπολογιστές του διαδικτύου και θα φτάσει σε ένα πρόγραμμα που τρέχει στον εξυπηρετητή που λέγεται web server. Tο πρόγραμμα λοιπόν αυτό το web server είναι το πρόγραμμα που ξέρει να λαμβάνει μηνύματα HTTP και να τα διαμοιράζει σε εφαρμογές, σε άλλα πράγματα που ανταποκρίνονται στις απαιτήσεις των απομακρυσμένων χρηστών.
Έχουμε δηλαδή εδώ ένα πρωτόκολλο στην ουσία δύο μερών, ενός πελάτη του προγράμματος του δικού μας, που τρέχει στο δικό μας υπολογιστή και ενός εξυπηρετητή που είναι ο υπολογιστής που θα μας προσφέρει το περιεχόμενο που αναζητούμε. Ο web server λοιπόν θα απευθυνθεί μέσα από κάποια εσωτερικά πρωτόκολλα εδώ βλέπετε το wsgi που είναι ένα πρωτόκολλο της γλώσσας python σε ένα πρόγραμμα ας πούμε ότι είναι γραμμένο αυτό το πρόγραμμα σε python, μπορεί να είναι σε άλλες γλώσσες, μία συνηθισμένη εδώ περίπτωση είναι η γλώσσα php υπάρχουν άλλες γλώσσες μπορεί να είσαι Java και τα λοιπά και το πρόγραμμα αυτό θα επεξεργαστεί το αίτημα, τα ιδιαίτερα χαρακτηριστικά του πιθανόν να απευθυνθεί σε μία βάση δεδομένων και θα γεννήσει τελικά την απάντηση. Η απάντηση περιέχει συνήθως αρχεία τύπου html css και JavaScript. Αυτές είναι οι βασικές τεχνολογίες που θα δούμε σε αυτό εδώ το μάθημα. Και αυτά τα προγράμματα θα επιστραφούν μέσω ξανά του πρωτοκόλλου HTTP στον πελάτη, στο browser και ο browser μπορεί αυτά τα προγράμματα τα html css και JavaScript να τα παρουσιάσει πια στο χρήστη. Έτσι το αίτημα ικανοποιείται. Αυτή είναι μία μικρή εισαγωγή στην βασική αρχιτεκτονική και στη βασική ορολογία του διαδικτύου και του παγκόσμιου ιστού.
tinanantsou.blogspot.gr
https://mathesis.cup.gr/
Απομαγνητοφώνηση
Ξεκινάμε εδώ μία σειρά από δύο μαθήματα στο mathesis με αντικείμενο τον προγραμματισμό του διαδικτύου. Απευθύνονται σε ένα ευρύ κοινό, όχι σε ειδικούς πληροφορικής και προγραμματισμού και έχουν σα στόχο να δούμε βασικές τεχνολογίες που κρύβονται πίσω από τις ιστοσελίδες και τις εφαρμογές στο διαδίκτυο με τις οποίες είμαστε σε επαφή κάθε μέρα στη ζωή μας. Το πρώτο μάθημα είναι εισαγωγικό στις τεχνολογίες html, css και JavaScript οι τρεις βασικές τεχνολογίες του διαδικτύου σήμερα και θα στο τέλος αυτού του μαθήματος Θα είμαστε σε θέση να φτιάξουμε στατικές ιστοσελίδες χρησιμοποιώντας αυτές τις τεχνολογίες. Το δεύτερο μάθημα έχει πιο προχωρημένα πράγματα και χτίζεται πάνω σε ότι είδαμε στο πρώτο από αυτά.
Θα ξεκινήσουμε με κάποιους βασικούς ορισμούς για την ορολογία, την ορολογία που έχει μπει στην καθημερινή μας ζωή
Η χρήση του διαδικτύου όπως όλοι ξέρουμε άρχισε να αναπτύσσεται με την εφεύρεση του παγκόσμιου ιστού στις αρχές της δεκαετίας του 90 και από τότε έχει εκθετική ανάπτυξη και αυτή τη στιγμή καλύπτει κάθε πτυχή της σύγχρονης ζωής μας. Απλώς να αναφερθούμε σε μερικά στοιχεία όπως ότι το διαδίκτυο είναι ένα δίκτυο υπολογιστών χωρίς κεντρική οργάνωση. Δεν υπάρχει ένας κεντρικός server. Υπάρχουν κάποιοι οργανισμοί οι οποίοι κανονίζουν την διευθυνσιοδότηση των υπολογιστών, τις IP διευθύνσεις και τη λειτουργία Domain Name Server αλλά μέχρι εκεί. Ίσως όμως θα πρέπει να πούμε ότι τα μαθήματα προγραμματισμού του διαδικτύου εστιάζουν και αφορούν στον προγραμματισμό εφαρμογών του παγκόσμιου ιστού. Τι είναι ο Παγκόσμιος Ιστός ; Στην ουσία είναι ένα πληροφοριακό σύστημα που περιέχει έγγραφα, ιστοσελίδες τα οποία είναι κείμενα αλλά και περιέχουν άλλους δικτυακούς πόρους εικόνες βίντεο audio κλπ, έχουν διευθύνσεις με ένα σύστημα διευθυνσιοδότησης που ονομάζεται Uniform Resource Locators (URLs) διεύθυνση δηλαδή στην οποία μπορούμε να καλέσουμε, να έχουμε πρόσβαση σε μία ιστοσελίδα. H βασική ιδέα εδώ είναι ότι αυτές οι ιστοσελίδες, αυτοί οι πόροι διασυνδέονται υπό μορφή ενός όπως λέγεται υπερκείμενου γιατί περιέχουν μέσα τους η καθεμία από αυτές συνδέσμους σε άλλες τέτοιες σελίδες. Έτσι φτιάχνεται ένας ιστός εξ ου και η λέξη παγκόσμιος ιστός world wide web, ένας ιστός διασυνδεδεμένων ιστοσελίδων.
Η πρόσβαση τώρα είναι εύκολη σε αυτές με τη χρήση κάποιων εφαρμογών που υπάρχουν σε όλους τους υπολογιστές σήμερα που είναι οι browsers, οι φυλλομετρητές όπως είναι το Chrome, Firefox, Edge κλπ. Θα πρέπει εδώ και με βάση αυτή την μικρή εισαγωγή να κάνω μία ιδιαίτερη αναφορά σε μία προσωπικότητα, που είναι ο Tim Bernes Lee στον οποίο οφείλεται αυτή η τεχνολογία. Όχι μόνο την εφηύρε, αλλά αποφάσισε από την αρχή να την ανοίξει, να τη διαθέσει ελεύθερα στην κοινωνία, στην ευρύτερη παγκόσμια κοινότητα. Ο Tim Berners Lee λοιπόν ήταν ένας μηχανικός ο οποίος δούλευε στο CERN στο κέντρο θεωρητικής φυσικής στην Ελβετία. Στις αρχές της δεκαετίας του 90 πρότεινε τη διασύνδεση δύο εννοιών που υπήρχαν ήδη, το διαδίκτυο είναι πολύ πιο παλιό από το Web από τη δεκαετία του 60 υπάρχει το διαδίκτυο, και τα πρωτόκολλα του TCP/IP. Ο Berners Lee όμως είχε την ιδέα να συνδέσει το διαδίκτυο με μία έννοια που επίσης υπήρχε από παλιότερα που είναι η έννοια του υπερκειμένου. Έφτιαξε δηλαδή και όρισε τα πρωτόκολλα μέσω των οποίων το υπερκείμενο μπορεί να συνδέεται και να διαδίδεται μέσω του διαδικτύου. Οι τεχνολογίες που πρότεινε ο Berners Lee ήδη από τις αρχές της δεκαετίας του 90 είναι οι εξής τρεις οι οποίες είναι πολύ σημαντικές και θα μας απασχολήσουν σε αυτό εδώ το μάθημα. Είναι ένα πρωτόκολλο μετάδοσης υπερκειμένου που ονομάζεται HTTP Hypertext Transfer Protocol, μία γλώσσα μέσω της οποίας μπορώ να δομώ και να παρουσιάζω το περιεχόμενο υπερκείμενων. Γλώσσα δηλαδή επισημείωσης όπως λέμε υπερκείμενων πού είναι η γλώσσα HTML Hyper-Text Markup Language και ο μηχανισμός, το πρωτόκολλο βάσει του οποίου ορίζονται οι διευθύνσεις των ιστοσελίδων. Αυτό είναι το Uniform Resource Locator το URL κι αν θέλουμε εδώ μπορούμε να δούμε τον Tim Berners Lee το 1989 μπροστά στην πρώτη ιστοσελίδα. Αξίζει λοιπόν με βάση αυτά τα στοιχεία που είναι τα δομικά στοιχεία που ορίζουν την αρχιτεκτονική του παγκόσμιου ιστού να δούμε με λίγο λεπτομέρεια τη λειτουργία του. Ας πούμε ότι είμαστε μπροστά σε έναν browser, σε μία εφαρμογή που έχουν όλοι οι υπολογιστές και πληκτρολογούμε μία ιστοσελίδα, μία διεύθυνση. Γράφουμε www.google.com. Θα δημιουργηθεί ένα μήνυμα το οποίο θα σταλεί και εδώ θα παίζει ρόλο ο μηχανισμός ο οποίος επιτρέπει την αναζήτηση του υπολογιστή ο οποίος είναι ικανός να εξυπηρετήσει αυτή τη συγκεκριμένη απαίτηση και θα καταλήξει το μήνυμα μας σε αυτόν τον υπολογιστή ο οποίος είναι ένας server, ένας εξυπηρετητής που περιέχει το περιεχόμενο που εμείς αναζητούμε. Το μήνυμα θα ταξιδέψει με το πρωτόκολλο HTTP. Εδώ επεισέρχεται και χρησιμοποιείται το πρωτόκολλο HTTP. Ένα μήνυμα μάλιστα τύπου GET που είναι ο πιο συνηθισμένος τύπος μηνυμάτων HTTP, θα ταξιδέψει περνώντας από διαδοχικούς υπολογιστές του διαδικτύου και θα φτάσει σε ένα πρόγραμμα που τρέχει στον εξυπηρετητή που λέγεται web server. Tο πρόγραμμα λοιπόν αυτό το web server είναι το πρόγραμμα που ξέρει να λαμβάνει μηνύματα HTTP και να τα διαμοιράζει σε εφαρμογές, σε άλλα πράγματα που ανταποκρίνονται στις απαιτήσεις των απομακρυσμένων χρηστών.
Έχουμε δηλαδή εδώ ένα πρωτόκολλο στην ουσία δύο μερών, ενός πελάτη του προγράμματος του δικού μας, που τρέχει στο δικό μας υπολογιστή και ενός εξυπηρετητή που είναι ο υπολογιστής που θα μας προσφέρει το περιεχόμενο που αναζητούμε. Ο web server λοιπόν θα απευθυνθεί μέσα από κάποια εσωτερικά πρωτόκολλα εδώ βλέπετε το wsgi που είναι ένα πρωτόκολλο της γλώσσας python σε ένα πρόγραμμα ας πούμε ότι είναι γραμμένο αυτό το πρόγραμμα σε python, μπορεί να είναι σε άλλες γλώσσες, μία συνηθισμένη εδώ περίπτωση είναι η γλώσσα php υπάρχουν άλλες γλώσσες μπορεί να είσαι Java και τα λοιπά και το πρόγραμμα αυτό θα επεξεργαστεί το αίτημα, τα ιδιαίτερα χαρακτηριστικά του πιθανόν να απευθυνθεί σε μία βάση δεδομένων και θα γεννήσει τελικά την απάντηση. Η απάντηση περιέχει συνήθως αρχεία τύπου html css και JavaScript. Αυτές είναι οι βασικές τεχνολογίες που θα δούμε σε αυτό εδώ το μάθημα. Και αυτά τα προγράμματα θα επιστραφούν μέσω ξανά του πρωτοκόλλου HTTP στον πελάτη, στο browser και ο browser μπορεί αυτά τα προγράμματα τα html css και JavaScript να τα παρουσιάσει πια στο χρήστη. Έτσι το αίτημα ικανοποιείται. Αυτή είναι μία μικρή εισαγωγή στην βασική αρχιτεκτονική και στη βασική ορολογία του διαδικτύου και του παγκόσμιου ιστού.
tinanantsou.blogspot.gr
VIDEO
ΜΟΙΡΑΣΤΕΙΤΕ
ΔΕΙΤΕ ΑΚΟΜΑ
ΕΠΟΜΕΝΟ ΑΡΘΡΟ
Το ταμείο στο Prime time... (16/5/2019)
ΣΧΟΛΙΑΣΤΕ