Ένας οδηγός για αρχάριους για τη χρήση του Velo από τη Wix

Το Velo είναι ένα προϊόν Wix με μια ανατροπή. Το Wix είναι μια από τις πιο δημοφιλείς πλατφόρμες ανάπτυξης στον Ιστό. Επιτρέπει στους σχεδιαστές (και στον μέσο ιδιοκτήτη ιστότοπου) να δημιουργούν καταπληκτικούς ιστότοπους χωρίς να γράφουν ούτε μια γραμμή κώδικα.

Με το Velo, το Wix επεκτείνει τη βάση χρηστών του για να συμπεριλάβει προγραμματιστές. Το Velo είναι μια πλατφόρμα ανάπτυξης πλήρους στοίβας που επιτρέπει στους χρήστες να δημιουργούν εξαιρετικούς ιστότοπους χρησιμοποιώντας κώδικα. Η μόνη γλώσσα προγραμματισμού που πρέπει να γνωρίζετε για να χρησιμοποιήσετε το Velo είναι η JavaScript. Η πλατφόρμα υποστηρίζει σύγχρονες λειτουργίες JavaScript και χρησιμοποιεί ένα σύστημα διακομιστή που βασίζεται στο NodeJS.

Σε αυτό το άρθρο, θα μάθετε για τις μοναδικές δυνατότητες του Velo και πώς να τις χρησιμοποιήσετε.

Χαρακτηριστικά προγραμματιστή του Velo

Η πλατφόρμα ανάπτυξης Velo διαθέτει ενσωματωμένο IDE, που επιτρέπει στους προγραμματιστές να γράφουν κώδικα JavaScript και να βλέπουν τις αλλαγές σε πραγματικό χρόνο. Το Velo εκτελείται σε διακομιστή NodeJS, πράγμα που σημαίνει ότι ένας προγραμματιστής έχει πρόσβαση σε πακέτα npm και άλλα εργαλεία προγραμματιστή. Αυτά τα χαρακτηριστικά προγραμματιστή περιλαμβάνουν:

• Η δυνατότητα δημιουργίας προσαρμοσμένων διατάξεων και αλληλεπιδράσεων σε μια ιστοσελίδα.
• Η δυνατότητα δημιουργίας συλλογών σε βάση δεδομένων.
• Η δυνατότητα δημιουργίας προσαρμοσμένων API για τον ιστότοπό σας.

Δημιουργία ιστότοπου με χρήση του Velo

Για να χρησιμοποιήσετε το Velo, θα χρειαστεί να πλοηγηθείτε στον κύριο ιστότοπο του. Μόλις φτάσετε εκεί, επιλέξτε την επιλογή για να ξεκινήσετε ένα νέο έργο. Αυτό θα σας οδηγήσει μέσα από τα συνηθισμένα Διαδικασία δημιουργίας ιστότοπου Wix, όπου θα πρέπει να επιλέξετε τον τύπο του ιστότοπου που θέλετε να δημιουργήσετε. Μπορείτε είτε να επιλέξετε ένα πρότυπο μόνοι σας είτε με τη βοήθεια του Wix ADI.

Αφού διαλέξετε την επιλογή επεξεργασίας του προτύπου σας, θα δείτε κάτι σαν το ακόλουθο περιβάλλον χρήστη:

Στα αριστερά της παραπάνω εικόνας βρίσκεται η πλαϊνή γραμμή της δομής του ιστότοπου, η οποία σας δίνει πρόσβαση στα διάφορα αρχεία JavaScript που συνδέονται με όλες τις σελίδες στον ιστότοπό σας. Η σελίδα που έχει επιλεγεί αυτήν τη στιγμή είναι η αρχική σελίδα και αν κοιτάξετε στο κάτω μέρος της παραπάνω εικόνας, θα δείτε ένα πρόγραμμα επεξεργασίας κώδικα που εμφανίζει το περιεχόμενο του αρχείου HOME.js.

Δημιουργία προσαρμοσμένης δομής διάταξης και αλληλεπιδράσεων

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

Ωστόσο, εάν θέλετε να χρησιμοποιήσετε διαφορετική επικεφαλίδα για αυτήν την ενότητα, μπορείτε να το επιτύχετε στο πρόγραμμα επεξεργασίας Velo εισάγοντας τον ακόλουθο κώδικα στο αρχείο HOME.js.

Το αρχείο HOME.js

$w.onReady(λειτουργία () {
 $w('#text20').text = 'ΤΑΔΙΚΑ ΣΤΟΙΧΕΙΑ'
});

Ο παραπάνω κώδικας θα ενημερώσει την επικεφαλίδα "πιο δημοφιλή" σε "trending items" και μπορείτε να προβάλετε αυτήν την ενημέρωση κάνοντας κλικ στο κουμπί προεπισκόπησης στην επάνω δεξιά γωνία της διεπαφής Velo. Στην αρχική σελίδα στην κατάλληλη ενότητα, θα πρέπει να δείτε κάτι σαν το ακόλουθο αποτέλεσμα:

Εργασία με τη βάση δεδομένων του Velo

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

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

Σχετίζεται με: Πώς να δημιουργήσετε μια επαγγελματική διαδικτυακή παρουσία με το Wix

Ωστόσο, αν θέλετε να δημιουργήσετε τη συλλογή σας από την αρχή, έχουν επίσης αυτή την επιλογή.

Για να δημιουργήσετε μια νέα συλλογή στη βάση δεδομένων Velo, απλώς τοποθετήστε το ποντίκι σας πάνω από την ενότητα "συλλογές περιεχομένου" και ένα εικονίδιο συν θα εμφανιστεί στα δεξιά του κειμένου.

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

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

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

Δείτε τη σελίδα διαχείρισης περιεχομένου παραπάνω. αυτή τη στιγμή έχει ένα πεδίο — τίτλο. Δεν μπορείτε να διαγράψετε αυτό το πεδίο επειδή είναι το κύριο πεδίο (ή το μοναδικό αναγνωριστικό), το οποίο πρέπει να έχει κάθε συλλογή. Ωστόσο, μπορείτε να του δώσετε έναν πιο κατάλληλο τίτλο, όπως όνομα προϊόντος ή αναγνωριστικό.

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

Επιλέγοντας την επιλογή ιδιότητας που μπορείτε να δείτε στην παραπάνω εικόνα θα εμφανιστεί η ακόλουθη αναδυόμενη φόρμα:

Η παραπάνω αναδυόμενη φόρμα σάς επιτρέπει να αλλάξετε το όνομα του πεδίου εισάγοντας τον τίτλο που θέλετε στο πεδίο κειμένου με την ένδειξη "όνομα πεδίου" και κάνοντας κλικ στην αποθήκευση.

Προσθήκη νέου πεδίου

Υπάρχουν δύο τρόποι για να προσθέσετε ένα νέο πεδίο στη συλλογή σας. Η πρώτη επιλογή είναι να κάνετε κλικ στο εικονίδιο συν στα δεξιά του υπάρχοντος τίτλου της συλλογής. Αυτή η μέθοδος θα δημιουργήσει την ακόλουθη φόρμα:

Η νέα φόρμα πεδίου σάς επιτρέπει να παρέχετε ένα όνομα πεδίου, ένα κλειδί πεδίου (για ενσωμάτωση στον κώδικά σας) και έναν τύπο πεδίου. Ο τύπος πεδίου μπορεί να είναι οποιοδήποτε από τα παρακάτω:

• Κείμενο
• Εικόνα
• Boolean
• Αριθμός
• Ημερομηνία και ώρα
• χρόνος
• Πλούσιο κείμενο
• Αναφορά
• Πολυαναφοράς
• URL

Ο δεύτερος τρόπος για να προσθέσετε ένα νέο πεδίο στη συλλογή σας είναι κάνοντας κλικ στην ενότητα "κρυμμένα πεδία" και επιλέγοντας την επιλογή "Προσθήκη πεδίου" από την αναδυόμενη λίστα πεδίων. Θα πρέπει να δείτε κάτι σαν την παρακάτω εικόνα:

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

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

Τι κάνει το Velo συναρπαστικό

Τώρα ξέρετε πώς να προσαρμόσετε τον ιστότοπό σας χρησιμοποιώντας κώδικα JavaScript στο Velo IDE. Μπορείτε επίσης να δημιουργήσετε προσαρμοσμένες συλλογές με όσα στοιχεία θέλετε στη βάση δεδομένων Velo. Αλλά αυτό που είναι πολύ πιθανό να είναι το καλύτερο για το Velo είναι η δυνατότητα εισαγωγής και χρήσης πακέτων npm.

Τι είναι το npm; Επεξήγηση του Διαχειριστή πακέτων JavaScript

Βελτιώστε τα έργα σας με πακέτα npm.

Διαβάστε Επόμενο

Σχετικά με τον Συγγραφέα