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

Το Netlify είναι μια πλατφόρμα φιλοξενίας Ιστού και μια ολοκληρωμένη σουίτα εργαλείων για την ανάπτυξη και τη διαχείριση εφαρμογών ιστού στο cloud.

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

Εξερευνήστε πώς να ρυθμίσετε μια διοχέτευση CI/CD για να αναπτύξετε ένα Node.js REST API στο Netlify χρησιμοποιώντας το GitHub Actions.

Σωληνώσεις CI/CD με ενέργειες GitHub: Επισκόπηση

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

Συνήθως, οι αγωγοί CI/CD αποτελούνται από πολλές βασικές φάσεις, συμπεριλαμβανομένων των φάσεων προέλευσης, κατασκευής, δοκιμής και ανάπτυξης.

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

instagram viewer

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

Τι είναι το GitHub Actions;

Το GitHub Actions είναι ένα εργαλείο ενσωματωμένο στο GitHub που παρέχει ένα ευρύ φάσμα προκατασκευασμένων ενεργειών που μπορείτε να το χρησιμοποιήσετε για να ορίσετε ροές εργασίας ως κώδικα απευθείας στο χώρο αποθήκευσης του έργου σας για να αυτοματοποιήσετε το CI/CD αγωγών.

Μπορείτε επίσης να δημιουργήσετε προσαρμοσμένες ενέργειες που ταιριάζουν στις συγκεκριμένες ανάγκες του έργου σας, επιτρέποντάς σας να δημιουργείτε και να αναπτύσσετε εφαρμογές στην παραγωγή χωρίς προβλήματα. Ένα από τα πλεονεκτήματα του GitHub Actions είναι η απρόσκοπτη ενσωμάτωσή του με άλλες δυνατότητες του GitHub, όπως αιτήματα έλξης και παρακολούθηση προβλημάτων.

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

Ρύθμιση του έργου Node.js

Για να ξεκινήσετε, πρέπει να δημιουργήσετε έναν διακομιστή ιστού Express. Για να το κάνετε αυτό, δημιουργήστε έναν νέο φάκελο τοπικά και αλλάξτε τον κατάλογο στο τερματικό σας.

mkdir express-netlify
cd express-netlify

Στη συνέχεια, δημιουργήστε ένα πακέτο.json αρχείο χρησιμοποιώντας npm, το Node Package Manager.

npm init -y

Τέλος, εγκαταστήστε τις εξαρτήσεις που απαιτούνται στο έργο.

npm εγκατάσταση express netlify-lambda χωρίς διακομιστή-http

ο netlify-λάμδα Το πακέτο χρησιμεύει ως διακομιστής τοπικής ανάπτυξης που διευκολύνει τη δοκιμή λειτουργιών χωρίς διακομιστή. χωρίς διακομιστή-http βοηθά στην προσαρμογή των εφαρμογών Express.js σε μορφή που είναι συμβατή με χειριστές λειτουργιών χωρίς διακομιστή.

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

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

Μπορείτε να βρείτε τον κωδικό αυτού του έργου σε αυτό Αποθετήριο GitHub.

Δημιουργήστε τον Express Web Server

Δημιουργήστε τρεις φακέλους: απόσταση, λειτουργίες, και src στον ριζικό κατάλογο του φακέλου του έργου σας.

Πριν ρυθμίσετε τον διακομιστή Express, δημιουργήστε ένα κενό index.html αρχείο στο απόσταση ντοσιέ. Αυτό το αρχείο λειτουργεί ως σύμβολο κράτησης θέσης που επιτρέπει στο Netlify να αναπτύξει με επιτυχία την εφαρμογή Express και να εξυπηρετήσει τις διαδρομές API.

Τώρα, δημιουργήστε ένα src/app.js αρχείο και προσθέστε τον ακόλουθο κώδικα:

συνθ εκφράζω = απαιτώ("εξπρές");
συνθ χωρίς διακομιστή = απαιτώ("χωρίς διακομιστή-http");
συνθ app = express();
συνθ δρομολογητής = εξπρές. Router();


router.get("/", (απαιτ., ανταπ.) => {
 res.send("Γειά σου Κόσμε!")
});


app.use(`/.netlify/functions/app`, δρομολογητής);
μονάδα μέτρησης.exports = εφαρμογή;
μονάδα μέτρησης.exports.handler = χωρίς διακομιστή (εφαρμογή);

Αυτός ο κώδικας ορίζει έναν διακομιστή Express με μια μοναδική διαδρομή για τη ριζική διεύθυνση URL που χειρίζεται τα αιτήματα GET. ο app.χρήση Η συνάρτηση καταγράφει το ενδιάμεσο λογισμικό της διαδρομής με την εφαρμογή Express, διασφαλίζοντας ότι τυχόν αιτήματα HTTP γίνονται στη διαδρομή /.netlify/functions/app θα αντιμετωπιστεί σωστά από το δρομολογητή, ακόμη και σε περιβάλλον παραγωγής.

Κατά συνέπεια, εάν προσθέσετε ένα νέο τελικό σημείο, όπως π.χ /api/auth, θα είναι προσβάσιμο στις /.netlify/functions/app/api/auth. Τέλος, ο κώδικας εξάγει την εφαρμογή Express και τη λειτουργία χειριστή χωρίς διακομιστή.

Αυτό επιτρέπει την τοπική δοκιμή του διακομιστή και διασφαλίζει ότι μπορείτε να τον αναπτύξετε ως λειτουργία χωρίς διακομιστή στο Netlify.

Καθορίστε το Αρχείο Netlify.toml

Στον ριζικό κατάλογο, δημιουργήστε ένα νέο Netlify.toml αρχείο και προσθέστε τον ακόλουθο κώδικα.

[χτίζω]
 βάση = "/"
 εντολή = "npm εκτέλεση build"
 δημοσίευση = "/dist/"
 λειτουργίες = "λειτουργίες/"
[κατασκευή.περιβάλλον]
 NODE_VERSION = "16"
[λειτουργίες]
 εξωτερικοί_κόμβοι_μονάδες = ["εξπρές"]
 node_bundler = "esbuild"
[[ανακατευθύνσεις]]
 δύναμη = αληθινός
 από = "/api/*"
 κατάσταση = 200
 σε = "/.netlify/functions/app/:splat"
[[ανακατευθύνσεις]]
 από = "/*"
 κατάσταση = 200
 σε = "/index.html"

Ο κώδικας καθορίζει τις ρυθμίσεις διαμόρφωσης κατασκευής και ανάπτυξης για την εφαρμογή Express στο Netlify. Περιλαμβάνει ρυθμίσεις όπως ο βασικός κατάλογος, η εντολή δημιουργίας, ο κατάλογος δημοσίευσης και ο κατάλογος λειτουργιών.

Επιπλέον, ορίζει ρυθμίσεις ανακατεύθυνσης που θα πρέπει να διαχειρίζονται τη δρομολόγηση των αιτημάτων HTTP API, διασφαλίζοντας ότι κατευθύνονται σωστά στις λειτουργίες χωρίς διακομιστή Netlify.

Ενημερώστε το Αρχείο Package.json

Ανοιξε το πακέτο.json αρχείο και προσθέστε αυτές τις εντολές στο αντικείμενο scripts.

"σενάρια": {
"αρχή": "netlify-lambda serve src",
"χτίζω": "netlify-lambda build src"
 },

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

npm εκτέλεση κατασκευής
npm έναρξη λειτουργίας

Ο διακομιστής θα ξεκινήσει στη θύρα 9000. Μπορείτε να προχωρήσετε και να δοκιμάσετε το API χρησιμοποιώντας τον Postman υποβάλλοντας αιτήματα σε http://localhost: 9000/.netlify/functions/app

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

Αναπτύξτε την εφαρμογή Express στο Netlify

Αρχικά, αναπτύξτε το API στο Netlify πριν διαμορφώσετε τη ροή εργασίας GitHub Actions. Ακολουθήστε αυτά τα βήματα για να αναπτύξετε την εφαρμογή Express στο Netlify.

  1. Κατευθυνθείτε προς Netlify και δημιουργήστε έναν λογαριασμό και συνδεθείτε στο ΣΦΑΙΡΙΚΗ ΕΙΚΟΝΑ σελίδα.
  2. Επιλέξτε και κάντε κλικ στο Τοποθεσίες αυτί.
  3. Κάνε κλικ στο Εισαγωγή από το Git κουμπί και επιλέξτε GitHub ως πλατφόρμα παρόχου Git. Το Netlify θα σας ζητήσει να πραγματοποιήσετε έλεγχο ταυτότητας με το GitHub για να του παραχωρήσετε πρόσβαση στον λογαριασμό σας και στα αποθετήρια του έργου.
  4. Επιλέξτε το αποθετήριο έργου Express από τη λίστα των εμφανιζόμενων αποθετηρίων.
  5. Αφού επιλέξετε το αποθετήριο, πρέπει να διαμορφώσετε τις ρυθμίσεις κατασκευής για τη διαδικασία ανάπτυξης. Το Netlify απλοποιεί αυτή τη διαδικασία εντοπίζοντας αυτόματα την τεχνολογία που χρησιμοποιείται για τη δημιουργία της εφαρμογής και συμπληρώνει εκ των προτέρων τα πεδία με τις απαιτούμενες ρυθμίσεις κατασκευής. Σε αυτήν την περίπτωση, η εντολή build, η δημοσίευση και ο κατάλογος συναρτήσεων.
  6. Τέλος, κάντε κλικ στο Ανάπτυξη ιστότοπου κουμπί για να ολοκληρώσετε τη διαδικασία.

Δημιουργήστε μια ροή εργασίας GitHub Actions

Κάνε κλικ στο Ενέργειες καρτέλα στο αποθετήριο GitHub του έργου σας. Στο Συνεχής ενσωμάτωση ενότητα, επιλέξτε και κάντε κλικ σε Διαμόρφωση του Node.js ροή εργασιών.

Από τον επεξεργαστή GitHub, μετονομάστε το όνομα του αρχείου σε Netlify.yml, διαγράψτε τον κώδικα ροής εργασίας του boilerplate Node.js και προσθέστε τον παρακάτω κώδικα:

όνομα:ΧτίζωκαιΑναπτύσσωπρος τηνNetlify
επί:
Σπρώξτε:
pull_request:
θέσεις εργασίας:
χτίζω:
τρέχει:ubuntu-22.04
βήματα:
-χρήσεις:ενέργειες/checkout@v3
# ( Δημιουργία σε ./dist ή άλλο κατάλογο... )
-όνομα:Αναπτύσσωπρος τηνNetlify
χρήσεις:nwtgck/[email protected]
με:
δημοσίευση-σκηνοθεσία:"./dist"
κλάδος παραγωγής:κύριος
github-token:${{μυστικά. GITHUB_TOKEN}}
ανάπτυξη-μήνυμα:"Ανάπτυξη από το GitHub Actions"
enable-pull-request-comment:ψευδής
enable-commit-comment:αληθής
overwrites-pull-request-comment:αληθής
env:
NETLIFY_AUTH_TOKEN:${{μυστικά. NETLIFY_AUTH_TOKEN}}
NETLIFY_SITE_ID:${{μυστικά. NETLIFY_SITE_ID}}
timeout-λεπτά:1

Ακολουθεί μια ανάλυση των ιδιοτήτων ροής εργασίας:

  • επί: Συμβάντα που ενεργοποιούν τις ενέργειες σε αυτήν τη ροή εργασίας.
  • θέσεις εργασίας: Καθορίζει το συμβάν που πρέπει να εκτελείται μια συγκεκριμένη ενέργεια, τα οποία είναι: τα συμβάντα δημιουργίας και ανάπτυξης.
  • τρέχει-σε: το περιβάλλον παραγωγής υποδοχής για τη δράση.
  • βήματα: Καθορίζει μια σειρά βημάτων που απαιτούνται για την εκτέλεση μιας συγκεκριμένης εργασίας.
  • με: Καθορίζει τα ορίσματα που απαιτούνται για να εκτελεστούν σωστά οι Ενέργειες.
  • env: καθορίζει τις απαιτούμενες μεταβλητές περιβάλλοντος για τη ροή εργασίας.

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

Η αρχική έκδοση, ωστόσο, θα προκαλέσει ένα σφάλμα, καθώς πρέπει να προσθέσετε μυστικές μεταβλητές που απαιτούνται από τη ροή εργασίας: το αναγνωριστικό τοποθεσίας που έχει αναπτυχθεί και το διακριτικό εξουσιοδότησης του Netlify. Προχωρήστε στο δικό σας Ρυθμίσεις τοποθεσίας στο Netlify και αντιγράψτε το ID τοποθεσίας.

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

Προσθέστε τις δύο μεταβλητές περιβάλλοντος ως NETLIFY_SITE_ID και NETLIFY_AUTH_TOKEN και στις δύο ενότητες μεταβλητών περιβάλλοντος και μυστικών αποθετηρίου στον αποθετήριο GitHub. Αφού κάνετε αυτές τις αλλαγές, εκτελέστε ξανά τη ροή εργασίας. Το Netlify θα αναπτύξει αυτόματα οποιεσδήποτε μεταγενέστερες αλλαγές προωθήσετε χρησιμοποιώντας αυτόν τον αγωγό.

Συνεχίστε και δοκιμάστε το API χρησιμοποιώντας τον Postman υποβάλλοντας αιτήματα σε αυτήν τη διεύθυνση URL: /.netlify/functions/app.

Διαμόρφωση αγωγών CI/CD με GitHub Actions και Netlify

Χρησιμοποιώντας τις λειτουργίες χωρίς διακομιστές του Netlify, μπορείτε να αναπτύξετε ολοκληρωμένες εφαρμογές web που περιλαμβάνουν λειτουργίες τόσο από την πλευρά του πελάτη όσο και από την υποστήριξη υποστήριξης στο Netlify.

Επιπλέον, η δημιουργία αγωγών CI/CD για εφαρμογές με GitHub Actions προσφέρει μια βελτιωμένη προσέγγιση για την αυτοματοποίηση της διαδικασίας κατασκευής και ανάπτυξης. Αυτό σας επιτρέπει να ορίσετε ροές εργασίας που διασφαλίζουν μια απρόσκοπτη και αξιόπιστη διαδικασία ανάπτυξης, ξεκινώντας από τον ιδεασμό και προχωρώντας μέχρι το στάδιο της κυκλοφορίας.