Πώς να δημιουργήσετε και να καταναλώσετε Mock API σε εφαρμογές React χρησιμοποιώντας το Mirage.js

Αναγνώστες σαν εσάς βοηθούν στην υποστήριξη του MUO. Όταν κάνετε μια αγορά χρησιμοποιώντας συνδέσμους στον ιστότοπό μας, ενδέχεται να κερδίσουμε μια προμήθεια θυγατρικών. Διαβάστε περισσότερα.

Κατά την ανάπτυξη εφαρμογών πλήρους στοίβας, ένα σημαντικό κομμάτι της εργασίας του frontend βασίζεται σε δεδομένα σε πραγματικό χρόνο από το backend.

MUO Το βίντεο της ημέρας ΚΥΛΙΣΤΕ ΓΙΑ ΝΑ ΣΥΝΕΧΙΣΕΤΕ ΜΕ ΠΕΡΙΕΧΟΜΕΝΟ

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

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

Ξεκινώντας με το Mirage.js Mock API

Mirage.js είναι μια βιβλιοθήκη JavaScript που σας επιτρέπει να δημιουργείτε εικονικά API, με έναν δοκιμαστικό διακομιστή που εκτελείται στην πλευρά του πελάτη της εφαρμογής Ιστού σας. Αυτό σημαίνει ότι μπορείτε να δοκιμάσετε τον κώδικα διεπαφής σας χωρίς να χρειάζεται να ανησυχείτε για τη διαθεσιμότητα ή τη συμπεριφορά του πραγματικού σας API υποστήριξης.

πώς να βλέπετε παλιά μηνύματα κειμένου

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

Για να χρησιμοποιήσετε το Mirage.js, πρέπει πρώτα να δημιουργήσετε εικονικά τελικά σημεία API και να ορίσετε τις απαντήσεις που θα πρέπει να επιστρέψουν. Στη συνέχεια, το Mirage.js παρεμποδίζει όλα τα αιτήματα HTTP που κάνει ο κώδικας διεπαφής σας και επιστρέφει τις ψευδείς απαντήσεις.

Μόλις το API σας είναι έτοιμο, μπορείτε εύκολα να μεταβείτε στη χρήση του αλλάζοντας μόνο τη διαμόρφωση του Mirage.js.