Το Jamstack είναι μια ολοένα και πιο δημοφιλής φιλοσοφία ανάπτυξης ιστού που στοχεύει στην επιτάχυνση τόσο της διαδικασίας ανάπτυξης ιστού όσο και των χρόνων λήψης ιστοσελίδων. Αντλώντας από τις κινήσεις devops και τις τεχνικές συνεχούς ολοκλήρωσης / συνεχούς παράδοσης (CI / CD) που καθίστανται ο κανόνας σε πολλούς οργανισμούς, το Jamstack αναβαθμίζει τις μακροχρόνιες τεχνικές για τη δημιουργία διαδραστικών ιστοσελίδων, μετατοπίζοντας την εκτέλεση κώδικα χρόνου φόρτωσης μακριά από διακομιστές ιστού και προς το JavaScript στο πρόγραμμα περιήγησης και τις εξωτερικές υπηρεσίες που έχουν πρόσβαση μέσω διεπαφών προγραμματισμού εφαρμογών (API).
Τι είναι το Jamstack; Jamstack, καθορισμένο
Το Jamstack είναι ένα μοντέλο εφαρμογής ιστού που βασίζεται σε τρεις πυλώνες, οι οποίοι παρέχουν τα αρχικά στο όνομά του: JavaScript, API, και σήμανση. Οι ιστοσελίδες για έναν ιστότοπο Jamstack αποτελούνται από τυπική γλώσσα σήμανσης, ώστε να μπορούν να δημιουργηθούν και να δοκιμαστούν οπουδήποτε, χωρίς εξαρτήσεις από διακομιστές εφαρμογών ή τεχνολογίες από διακομιστές όπως το Node.js. Οποιαδήποτε διαδραστική λειτουργικότητα παρέχεται από τον τυπικό κώδικα JavaScript που εκτελείται στο πρόγραμμα περιήγησης, ο οποίος πραγματοποιεί κλήσεις σε επαναχρησιμοποιήσιμα API μέσω HTTPS για πρόσβαση σε εξωτερικά δεδομένα ή οποιαδήποτε άλλη λειτουργικότητα που δεν μπορεί να ενσωματωθεί στην ίδια την ιστοσελίδα.
Για να καταλάβετε γιατί η φιλοσοφία του Jamstack είναι επαναστατική, εξετάστε τη στοίβα LAMP, η οποία αποτελεί παράδειγμα του τρόπου με τον οποίο οι περισσότεροι προγραμματιστές έχουν σκεφτεί την ανάπτυξη ιστού για τα περισσότερα από τα τελευταία 15 χρόνια. Το LAMP σημαίνει Linux (το λειτουργικό σύστημα που τροφοδοτεί τους περισσότερους διακομιστές ιστού), Απάχης (το λογισμικό διακομιστή που εκτελείται σε αυτές τις μηχανές Linux), MySQL (τη βάση δεδομένων όπου αποθηκεύονται οι πληροφορίες που χρειάζεται η εφαρμογή ιστού), και PHP / Perl / Python (η γλώσσα στην οποία είναι γραμμένος ο κωδικός διακομιστή). Όταν οδηγείτε το πρόγραμμα περιήγησής σας σε έναν ιστότοπο που βασίζεται σε LAMP, ο διακομιστής Ιστού εκτελεί τον κωδικό από την πλευρά του διακομιστή που δημιουργεί την ιστοσελίδα εν κινήσει, αντλώντας δεδομένα όπως απαιτείται από τη βάση δεδομένων MySQL.
Η αρχιτεκτονική LAMP επιτρέπει τη δημιουργία δυναμικών και διαδραστικών ιστότοπων, αλλά απαιτεί επίσης έναν ισχυρό διακομιστή ιστού - και όσο περισσότερη κίνηση έχει ένας ιστότοπος, τόσο περισσότερη υπολογιστική ισχύ από την πλευρά του διακομιστή χρειάζεται. Ακόμη και με έναν πλήρως εξοπλισμένο διακομιστή, οι δυναμικές ιστοσελίδες χρειάζονται πολύ χρόνο για την κατασκευή και τη φόρτωση. Σε έναν κόσμο ανθρώπων με σύντομη προσοχή που περιηγείται στον ιστό στα τηλέφωνά τους, αυτή η καθυστέρηση έγινε όλο και πιο απαράδεκτη.
Ο Jamstack γεννήθηκε ως μέρος του κινήματος «στατικού ιστού», το οποίο προέκυψε στα μέσα της δεκαετίας του 2010 ως αντίδραση ενάντια σε αυτό το παραδοσιακό μοντέλο του τρόπου λειτουργίας ενός ιστότοπου. Για να κατανοήσετε το Jamstack, πρέπει να καταλάβετε τη σημερινή τεχνολογία πίσωστατικές ιστοσελίδες.
Στατικοί ιστότοποι, δημιουργίες στατικών ιστότοπων και Jamstack
Εάν έπρεπε να εξηγήσετε σε έναν αρχάριο πώς λειτουργεί ο ιστός, μπορεί να είναι κάπως έτσι: Κάπου στο σύστημα αρχείων ενός διακομιστή ιστού υπάρχουν αρχεία HTML, προσβάσιμα μέσω διευθύνσεων HTTP, τα οποία κατεβάζει ένα πρόγραμμα περιήγησης και, στη συνέχεια, ερμηνεύει τη δημιουργία μιας ιστοσελίδας . Αλλά αυτή είναι μια περιγραφή ενός στατικός ιστότοπος: Υποθέτει ότι τα αρχεία HTML υπάρχουν ήδη όταν το πρόγραμμα περιήγησης ιστού τα ψάχνει. Όπως έχουμε ήδη δει, μεγάλο μέρος του ιστού κατά την τελευταία δεκαετία κυριαρχείται από δυναμικούς ιστότοπους, οι οποίοι αντ 'αυτού δημιουργούν αρχεία HTML εν κινήσει σε απάντηση σε αιτήματα ιστού, συχνά βασισμένα σε παραμέτρους που μεταβιβάζονται στον διακομιστή ιστού μέσω φορμών ή στο Η ίδια η διεύθυνση URL.
Στις πρώτες μέρες του διαδικτύου, όταν οι ιστοσελίδες ήταν σταθερά στατικές, πολλοί προγραμματιστές ιστού έγραψαν τον κώδικα HTML με το χέρι. Καθώς οι ιστοσελίδες έγιναν πιο περίπλοκες, έφτασαν εργαλεία όπως το Dreamweaver της Macromedia, τα οποία θα μπορούσαν να δημιουργήσουν αυτές τις στατικές σελίδες HTML μέσω προγραμματισμού. Καθώς το στατικό web κίνημα ξεκίνησε στα μέσα της δεκαετίας του 2010, ένα νέο κύμα των λεγόμενων δημιουργίες στατικών ιστότοπων άρχισαν να εμφανίζονται, συμπεριλαμβανομένων των Gatsby, Hugo και Jeckyll. Σε αντίθεση με τα εργαλεία WYSIWYG όπως το Dreamweaver, οι στατικές γεννήτριες ιστότοπων βασίζονται στη γραμμή εντολών και έχουν σχεδιαστεί για να ενσωματώνονται σε διαδικασίες CI / CD. Τα αρχεία HTML δημιουργούνται από τα εργαλεία, συχνά βασίζονται σε περιεχόμενο που γράφεται στο Markdown και μεταφορτώνονται αυτόματα σε ένα αποθετήριο ελέγχου εκδόσεων όπως το GitHub. Καθώς αυτά τα αρχεία επισημαίνονται έτοιμα για παραγωγή, οι στατικές σελίδες στον ζωντανό ιστότοπο ενημερώνονται αυτόματα.
Ένα σημαντικό πράγμα που πρέπει να θυμάστε είναι ότι στατικός σε αυτό το πλαίσιο δεν σημαίνει ότι πρόκειται για απλές ιστοσελίδες 1.0 σελίδες που δεν είναι διαδραστικές. Θυμηθείτε, αυτές οι σελίδες μπορούν να περιλαμβάνουν προηγμένη JavaScript που εκτελείται στο πρόγραμμα περιήγησης και πραγματοποιεί κλήσεις API σε βάσεις δεδομένων, λειτουργίες από διακομιστή ή φιλοξενούμενες λειτουργίες χωρίς διακομιστές. Ωστόσο, επειδή καμία από αυτές τις εκτελέσεις δεν πραγματοποιείται στον ίδιο τον διακομιστή ιστού, ένας στατικός ιστότοπος δεν χρειάζεται έναν οικοδεσπότη Ιστού με βιομηχανική υποστήριξη με βάση δεδομένων. Πολλοί στατικοί ιστότοποι αναπτύσσονται σε δίκτυα παράδοσης περιεχομένου, ή CDN, όπου το περιεχόμενο αντικατοπτρίζεται σε πολλούς διακομιστές σε όλο τον κόσμο, προκειμένου να παραδοθεί γρήγορα στους χρήστες οπουδήποτε.
Ο Mathieu Dionne, επικεφαλής μάρκετινγκ στο Snipcart, περιγράφει τις πρώτες μέρες αυτού του νέου κόσμου στατικών ιστότοπων σε μια δημοσίευση ιστολογίου και αναφέρει ότι γύρω στο 2015, «οι ιδρυτές του Netlify ... μόλις είχαν βρει τον όρο« Jamstack »για να εργαστούν η αρνητική χροιά του «στατικού ιστού». »Με άλλα λόγια, περιγράφουμε τη διαδικασία Jamstack σε αυτήν την ενότητα. Αλλά τώρα πρέπει να συζητήσουμε εν συντομία το Netlify και τον ρόλο τους στο οικοσύστημα.
Τι είναι το Netlify;
Η Netlify είναι μια εταιρεία cloud computing και web hosting. Ο συνιδρυτής Netlify Mathias Biilmann επινόησε τον όρο Jamstack και οι υπηρεσίες της Netlify είναι προσαρμοσμένες σε πελάτες που θέλουν να δημιουργήσουν ιστότοπους με βάση τη φιλοσοφία του Jamstack.
Η Netlify ισχυρίζεται ότι έχει σπάσει ένα συγκεκριμένο πρόβλημα που είχε καθυστερήσει τους στατικούς ιστότοπους, που είναι ακύρωση προσωρινής μνήμης. Οι δυναμικοί ιστότοποι που βασίζονται στη βάση δεδομένων ενδέχεται να καταναλώνουν πολλούς πόρους διακομιστή, αλλά μπορείτε να είστε σίγουροι ότι θα εξυπηρετούν την πιο πρόσφατη έκδοση του ιστότοπού σας σε οποιονδήποτε επισκέπτη επισκέπτεται. Επειδή οι ιστότοποι Jamstack φιλοξενούνται συχνά στους πολλαπλούς κατανεμημένους διακομιστές ενός CDN, οι ενημερώσεις είναι λιγότερο απλές. Μπορεί να χρειαστούν οπουδήποτε από λίγα λεπτά έως ώρες για κάθε διακομιστή CDN για να καταλάβει ότι η προσωρινά αποθηκευμένη έκδοση του ιστότοπου δεν είναι πλέον έγκυρη. Το CDN του Netfliy παρέχει άμεση ακύρωση προσωρινής μνήμης για αρχεία HTML για την αντιμετώπιση αυτού του προβλήματος.
Ωστόσο, η Netlify δεν είναι ο μόνος πάροχος φιλοξενίας στον χώρο Jamstack και δεν έχει κανένα είδος εμπορικού σήματος ή ιδιοκτησιακού ελέγχου επί του όρου. Υπάρχουν πολλές διαθέσιμες λύσεις φιλοξενίας και ανάπτυξης Jamstack και οι περισσότεροι από τους μεγάλους παρόχους cloud συμμετέχουν στη δράση, συμπεριλαμβανομένων των AWS, Google Firebase και Microsoft Azure.
Jamstack CMS
Εάν είστε κάποιος που πρέπει να χειριστεί έναν ιστότοπο καθημερινά, γνωρίζετε ότι η δημιουργία και η φιλοξενία του ιστότοπου είναι μόνο η αρχή. Χρειάζεστε επίσης έναν τρόπο να δημιουργήσετε νέο περιεχόμενο και να το προσθέσετε στον ιστότοπό σας. Επειδή τα άτομα που θα κάνουν αυτό συνήθως δεν θα είναι προγραμματιστές, θα χρειαστούν ένα φιλικό προς το χρήστη εργαλείο - δηλαδή, ένα σύστημα διαχείρισης περιεχομένου, ή CMS. Τα παραδοσιακά CMSes, όπως το WordPress, προσφέρουν μια διεπαφή χρήστη back-end όπου μπορείτε να εισαγάγετε περιεχόμενο ιστότοπου, να διαχειριστείτε μια βάση δεδομένων όπου είναι αποθηκευμένο αυτό το περιεχόμενο και να δημιουργήσετε δυναμικές ιστοσελίδες που παρουσιάζουν αυτό το περιεχόμενο ως απόκριση σε αιτήματα προγράμματος περιήγησης.
Οι CMSes για ιστότοπους Jamstack λειτουργούν διαφορετικά, και αναφέρονται γενικά ως ακέφαλος. Ένα χωρίς κεφαλή CMS προσφέρει μια διεπαφή χρήστη για την εισαγωγή και τη διαχείριση περιεχομένου και μιας βάσης δεδομένων ή άλλων μέσων αποθήκευσης, αλλά δεν δημιουργεί από μόνη της κώδικα HTML για την ανάλυση ενός προγράμματος περιήγησης. Αντίθετα, οι στατικές σελίδες HTML του ιστότοπου χρησιμοποιούν JavaScript για να πραγματοποιούν κλήσεις προς τα API του CMS και το CMS επιστρέφει το περιεχόμενο σε μορφή που η JavaScript μπορεί να μετατραπεί σε ιστοσελίδα.
Αυτό το σύστημα διαχωρίζει πλήρως το περιεχόμενο από την παρουσίαση, το οποίο είναι φυσικά ένα μακροχρόνιο ιδανικό προγραμματισμού. Επειδή το CMS έχει προσβάσιμο API, πολλές ιστοσελίδες μπορούν εύκολα να έχουν πρόσβαση σε αυτό. Για παράδειγμα, εάν έχετε δημιουργήσει ξεχωριστές εκδόσεις για κινητά, επιτραπέζιους υπολογιστές και smartwatch του ιστότοπού σας, όλες αυτές οι εκδόσεις μπορούν να έχουν πρόσβαση στο ίδιο περιεχόμενο που είναι αποθηκευμένο στο CMS.
Το Netlify, όπως θα περίμενε κανείς, έχει τη δική του προσφορά σε αυτόν τον χώρο, που ονομάζεται NetlifyCMS, αλλά υπάρχουν αρκετές άλλες διαθέσιμες προσφορές. ο προγραμματιστής Nebojsa Radakovic τις αναλύει για εσάς σε μια ανάρτηση ιστολογίου. Υπάρχουν πολλοί ανερχόμενοι σε αυτόν τον κατάλογο, καθώς και ένα πολύ γνωστό όνομα. Ενώ χρησιμοποιήσαμε το WordPress ως παράδειγμα ενός παραδοσιακού CMS, το WordPress μπορεί να λειτουργήσει ως CMS χωρίς κεφαλή για την τροφοδοσία ενός ιστότοπου Jamstack.
Συνέδριο Jamstack
Το Netlify εργάζεται επίσης για τη δημιουργία μιας κοινότητας Jamstack και χορηγεί συνέδρια Jamstack. Η εταιρεία διοργάνωσε εκδηλώσεις στη Νέα Υόρκη, το Λονδίνο και το Σαν Φρανσίσκο το 2019 και φιλοξένησε μια εικονική εκδήλωση τον Μάιο του 2020. Από αυτήν τη γραφή, μπορείτε να εγγραφείτε στην εκδήλωση του Σαν Φρανσίσκο που έχει προγραμματιστεί για τις 6-7 Οκτωβρίου 2020, ωστόσο η πανδημία του κοροναϊού έχει ακόμα προγραμματιστεί τα συνέδρια του φθινοπώρου.
Εάν θέλετε ενημερώσεις, μπορείτε να παρακολουθήσετε το συνέδριο στο Twitter. Μπορείτε επίσης να δείτε προηγούμενες συνομιλίες στο κανάλι Jamstack Conf YouTube.
[Επίσης στις: Τα 6 καλύτερα IDE JavaScript | Οι 10 καλύτεροι συντάκτες JavaScript]
Σεμινάρια Jamstack
Θέλετε να πάτε βαθύτερα; Ρίξτε μια ματιά σε αυτά τα μαθήματα Jamstack που θα σας προσφέρουν κάποια πρακτική εμπειρία στη δημιουργία ενός ιστότοπου Jamstack:
- Ο προγραμματιστής David Neal έχει ένα καλό εισαγωγικό σεμινάριο για τη δημιουργία ενός ιστότοπου Jamstack, ξεκινώντας πολύ απλά και στη συνέχεια όλο και πιο περίπλοκο.
- Πάνω στο ιστολόγιο LogRocket, ο μηχανικός λογισμικού Ogundipe Samuel παρέχει μια αναλυτική, βήμα προς βήμα ματιά στη δημιουργία ενός ιστότοπου ηλεκτρονικού εμπορίου με βάση τις αρχές του Jamstack.
- Το Netlify προσφέρει ένα εκπαιδευτικό βίντεο διάρκειας τριών ωρών που καλύπτει πολύ έδαφος από τα βασικά έως τα πιο προηγμένα θέματα.
Μόλις εξοικειωθείτε με τις βασικές έννοιες που περιγράφονται εδώ, θα είστε έτοιμοι να αρχίσετε να εργάζεστε με την ανάπτυξη Jamstack στην επαγγελματική σας ζωή. Καλή μάθηση!
