Η μετάβαση από Vanilla JS σε Vue μετατρέπει ένα χειρόγραφο frontend σε συντηρήσιμη εφαρμογή Vue 3. Οι εφαρμογές που χειρίζονται απευθείας το DOM — getElementById, addEventListener, χειροκίνητα innerHTML, δουλεύουν μια χαρά μέχρι να μεγαλώσουν: το state σκορπίζεται σε global μεταβλητές, δεν υπάρχει μία πηγή αλήθειας, και μια μικρή αλλαγή σπάει αθόρυβα κάτι τρία αρχεία πιο πέρα. Γι' αυτό ξαναχτίζω αυτό το frontend σε ένα codebase Vue 3 με components και reactivity.
Το σημαντικότερο: η μετάβαση είναι σταδιακή. Το Vue μπαίνει μέσα στις υπάρχουσες σελίδες σας και αναλαμβάνει ένα widget ή μία οθόνη τη φορά, οπότε η επιχείρηση δεν σταματά ποτέ. Είναι η ίδια διαδικασία που εφαρμόζω σε enterprise συστήματα: τεχνικός έλεγχος πρώτα, μετρήσιμα ορόσημα, και ένα codebase που η ομάδα σας μπορεί επιτέλους να ελέγξει, να επεκτείνει και να παραδώσει σε νέο συνεργάτη χωρίς εβδομάδες προφορικής παράδοσης γνώσης.
Το πραγματικό πρόβλημα με το χειρόγραφο JavaScript δεν είναι η γλώσσα, είναι η δομή που λείπει. Δεν υπάρχει reactivity, οπότε συγχρονίζετε το DOM με το χέρι και αργά ή γρήγορα ξεφεύγει. Δεν υπάρχουν components, οπότε markup και λογική αντιγράφονται σε όλη την εφαρμογή. Δεν υπάρχουν όρια μεταξύ modules, οπότε κάθε script μπορεί να αγγίξει κάθε global. Η μετάβαση από Vanilla JS σε Vue αντικαθιστά το χειροκίνητο δέσιμο με το DOM με ένα reactive μοντέλο δεδομένων, σας δίνει πραγματικά επαναχρησιμοποιήσιμα components, και προσθέτει το TypeScript και τα tests που κάνουν το codebase ασφαλές να αλλάξει.
Τι σας δίνει η μετάβαση από Vanilla JS σε Vue
- Οι αλλαγές παύουν να είναι στοίχημα, τα ελεγμένα components πιάνουν τα λάθη πριν τα δουν οι πελάτες σας
- Ένα frontend στο οποίο οι developers θέλουν να δουλέψουν αντί να το αποφεύγουν (Vue 3, Vite, έτοιμο για TypeScript)
- Καμία παύση ανάπτυξης, το site συνεχίζει να δουλεύει
- Τεκμηρίωση και 30 ημέρες τεχνική εγγύηση μετά τη θέση σε λειτουργία
Γίνεται η μετάβαση χωρίς να ξαναγραφτούν όλα μαζί;
Ναι, αυτό είναι όλο το νόημα. Επειδή το Vue 3 μπαίνει μέσα στις υπάρχουσες σελίδες σας, οι λειτουργίες μεταφέρονται μία-μία ενώ η υπόλοιπη εφαρμογή δουλεύει όπως είναι.
Ο χειρόγραφος JavaScript κώδικάς μας δεν έχει tests ούτε τεκμηρίωση. Είναι πρόβλημα;
Αυτή είναι η κανονική αφετηρία. Ο τεχνικός έλεγχος ανασυνθέτει πρώτα το πώς συμπεριφέρεται πραγματικά η εφαρμογή· μετά προσθέτω tests γύρω από κάθε λειτουργία πριν μεταφερθεί, ώστε να μην αλλάξει τίποτα στα κρυφά.
Πόσο διαρκεί η μετάβαση από Vanilla JS σε Vue;
Ένα τυπικό site ή εσωτερικό εργαλείο παίρνει 4-10 εβδομάδες, ανάλογα με το πόση λογική ζει στο frontend. Ο τεχνικός έλεγχος σας δίνει συγκεκριμένη εκτίμηση από την αρχή.
Έχουμε ένα παλιό PHP backend. Πρέπει να αλλάξει και αυτό;
Όχι. Το Vue μιλάει με το υπάρχον backend σας όπως είναι, σελίδες που παράγονται στον server, AJAX endpoints ή templates. Ο εκσυγχρονισμός του backend μπορεί να έρθει αργότερα, ή και ποτέ.
Άλλες υπηρεσίες
Επικοινωνία
Αθήνα, συνεργασία εξ αποστάσεως με ομάδες σε Ευρώπη & ΗΠΑ
info@offline-web.com