הגדר את זרימת העבודה הזו כדי לפרוס אוטומטית את האפליקציה שלך לייצור ולייעל את תהליך השחרור שלך.

Netlify היא פלטפורמת אירוח אתרים וחבילה מקיפה של כלים לפריסה וניהול של יישומי אינטרנט בענן.

אבל התכונות שלו מתרחבות הרבה מעבר לזה - הפונקציות שלו ללא שרת מאפשרות לך להריץ קוד בצד השרת ללא שרת ייעודי.

גלה כיצד להגדיר צינור CI/CD לפריסת ממשק API של Node.js REST ב-Netlify באמצעות פעולות GitHub.

צינורות CI/CD עם פעולות GitHub: סקירה כללית

צינורות אינטגרציה מתמשכת ואספקה ​​מתמשכת (CI/CD) הם סדרה של תהליכים אוטומטיים עוקבים שיישומי תוכנה עוברים לפני שהם נשלחים לייצור.

בדרך כלל, צינורות CI/CD מורכבים מכמה שלבי מפתח, כולל שלבי המקור, הבנייה, הבדיקה והפריסה.

אמנם ניתן לבצע שלבים אלה באופן ידני, אך אוטומציה שלהם מציעה מספר יתרונות, כולל:

  • צמצום הסיכון לטעויות אנוש.
  • מזרז את תהליך השחרור.
  • הבטחת זרימת עבודה עקבית למשלוח תוכנה איכותית לייצור.

מהן פעולות GitHub?

GitHub Actions הוא כלי משולב בתוך GitHub המספק מגוון רחב של פעולות מובנות מראש אתה יכול להשתמש כדי להגדיר זרימות עבודה כקוד ישירות במאגר הפרויקט שלך כדי להפוך את ה-CI/CD לאוטומטי צינורות.

instagram viewer

אתה יכול גם ליצור פעולות מותאמות אישית שיתאימו לצרכי הפרויקט הספציפיים שלך, מה שיאפשר לך לבנות ולפרוס יישומים לייצור ללא טרחה. אחד היתרונות של GitHub Actions הוא האינטגרציה החלקה שלה עם תכונות אחרות של GitHub, כגון בקשות משיכה ומעקב אחר בעיות.

זה מאפשר להפעיל זרימות עבודה המבוססות על אירועים ספציפיים, כגון התחייבות חדשה המבטיחה שצינורות ה-CI/CD שלך יופעלו אוטומטית בעת הצורך.

הגדר את פרויקט Node.js

כדי להתחיל, עליך ליצור שרת אינטרנט אקספרס. כדי לעשות זאת, צור תיקיה חדשה באופן מקומי ושנה את הספרייה בטרמינל שלך.

mkdir express-netlify
cd express-netlify

לאחר מכן, צור א package.json קובץ באמצעות npm, מנהל חבילות הצומת.

npm init -y

לבסוף, התקן את התלות הנדרשת בפרויקט.

npm התקן את express netlify-lambda serverless-http

ה netlify-lambda החבילה משמשת כשרת פיתוח מקומי המאפשר בדיקת פונקציות ללא שרת. ללא שרת-http עוזר בהתאמת אפליקציות Express.js לפורמט התואם למטפלי פונקציות ללא שרת.

Netlify אינה מספקת תמיכה מקורית לאירוח והרצה של יישומי backend מלאים. במקום זאת, הוא מציע פונקציות ללא שרת כפתרון חלופי לטיפול בפונקציונליות עורפית.

פונקציות אלו מנהלות את ההיגיון בצד השרת, מטפלות בבקשות API של HTTP ומשרתות תוכן דינמי, ומספקות פונקציונליות דמוית קצה בפרדיגמה ללא שרת.

אתה יכול למצוא את הקוד של הפרויקט הזה בו מאגר GitHub.

צור את שרת האינטרנט האקספרס

צור שלוש תיקיות: dist, פונקציות, ו src בספריית השורש של תיקיית הפרויקט שלך.

לפני שתגדיר את שרת האקספרס, צור ריק index.html קובץ ב- dist תיקייה. קובץ זה פועל כמציין מיקום המאפשר ל-Netlify לפרוס בהצלחה את אפליקציית Express ולשרת את מסלולי ה-API.

כעת, צור א src/app.js קובץ והוסיפו את הקוד הבא:

const express = לִדרוֹשׁ("אֶקְסְפּרֶס");
const ללא שרת = לִדרוֹשׁ("ללא שרת-http");
const app = express();
const נתב = אקספרס. נתב();


router.get("/", (req, res) => {
 res.send("שלום עולם!")
});


app.use(`/.netlify/functions/app`, נתב);
מודול‎.exports = app;
מודול.exports.handler = ללא שרת (אפליקציה);

קוד זה מגדיר שרת אקספרס עם נתיב יחיד עבור כתובת ה-Root המטפלת בבקשות GET. ה app.use הפונקציה רושמת את תוכנת האמצע של המסלול עם אפליקציית Express, ומבטיחה שכל בקשות HTTP שנשלחות לנתיב /.netlify/functions/app יטופל כראוי על ידי הנתב, אפילו בסביבת ייצור.

כתוצאה מכך, אם תוסיף נקודת קצה חדשה כגון /api/auth, זה יהיה נגיש ב /.netlify/functions/app/api/auth. לבסוף, הקוד מייצא את יישום ה-Express ואת פונקציית המטפל ללא שרת.

זה מאפשר בדיקה מקומית של השרת ומבטיח שתוכל לפרוס אותו כפונקציה ללא שרת ב-Netlify.

הגדר את הקובץ Netlify.toml

בספריית השורש, צור חדש Netlify.toml קובץ, והוסיפו את הקוד הבא.

[לִבנוֹת]
 base = "/"
 command = "npm run build"
 publish = "/dist/"
 functions = "פונקציות/"
[build.environment]
 NODE_VERSION = "16"
[פונקציות]
 external_node_modules = ["אֶקְסְפּרֶס"]
 node_bundler = "esbuild"
[[הפניות מחדש]]
 כוח = נכון
 from = "/api/*"
 סטטוס = 200
 to = "/.netlify/functions/app/:splat"
[[הפניות מחדש]]
 מ = "/*"
 סטטוס = 200
 to = "/index.html"

הקוד מציין את הגדרות הבנייה והפריסה עבור אפליקציית Express ב-Netlify. הוא כולל הגדרות כגון ספריית הבסיס, פקודת build, ספריית פרסום וספריית פונקציות.

בנוסף, הוא מגדיר הגדרות ניתוב מחדש שאמורות לנהל את הניתוב של בקשות API של HTTP, תוך הבטחה שהן מכוונות כראוי לפונקציות ללא שרת של Netlify.

עדכן את הקובץ Package.json

פתח את ה package.json קובץ והוסיפו פקודות אלו לאובייקט הסקריפטים.

"תסריטים": {
"הַתחָלָה": "netlify-lambda serve src",
"לִבנוֹת": "netlify-lambda build src"
 },

הפעל את הפקודות הבאות כדי לבנות ולהפעיל את היישום באופן מקומי.

npm run build
הפעלת npm run

השרת יתחיל ביציאה 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, ה-publish וספריית הפונקציות.
  6. לבסוף, לחץ על פריסת אתר כפתור להשלמת התהליך.

צור זרימת עבודה של GitHub Actions

הקלק על ה פעולות הכרטיסייה במאגר GitHub של הפרויקט שלך. בתוך ה אינטגרציה מתמשכת סעיף, בחר ולחץ על הגדר את Node.js זרימת עבודה.

מעורך GitHub, שנה את שם הקובץ ל Netlify.yml, מחק את קוד זרימת העבודה של Node.js, והוסף את הקוד למטה:

שֵׁם:לִבנוֹתולפרוסלNetlify
עַל:
לִדחוֹף:
pull_request:
מקומות תעסוקה:
לִבנוֹת:
ריצות:אובונטו-22.04
שלבים:
-משתמש:actions/checkout@v3
# (בנה ל-./dist או ספרייה אחרת... )
-שֵׁם:לפרוסלNetlify
משתמש:nwtgck/[email protected]
עם:
publish-dir:'./dist'
ענף ייצור:רָאשִׁי
github-token:${{סודות. GITHUB_TOKEN}}
deploy-message:"פרוס מפעולות GitHub"
enable-pull-request-comment:שֶׁקֶר
enable-commit-comment:נָכוֹן
overwrites-pull-request-comment:נָכוֹן
env:
NETLIFY_AUTH_TOKEN:${{סודות. NETLIFY_AUTH_TOKEN}}
NETLIFY_SITE_ID:${{סודות. NETLIFY_SITE_ID}}
דקות פסק זמן:1

להלן פירוט של מאפייני זרימת העבודה:

  • עַל: אירועים שמפעילים את הפעולות בזרימת עבודה זו.
  • מקומות תעסוקה: מציין את האירוע שפעולה מסוימת צריכה לרוץ שהם: אירועי הבנייה והפריסה.
  • פועל הלאה: סביבת הייצור המארח עבור הפעולה.
  • צעדים: מציין סדרה של שלבים המעורבים לביצוע עבודה מסוימת.
  • עם: מגדיר את הארגומנטים הדרושים כדי שהפעולות יפעלו כהלכה.
  • env: מציין את משתני הסביבה הנדרשים עבור זרימת העבודה.

לבסוף, בצע את העדכונים לקובץ זה. GitHub אמור להפעיל אוטומטית את זרימת העבודה.

עם זאת, הבנייה הראשונית תפעיל שגיאה מכיוון שעליך להוסיף משתנים סודיים הנדרשים על ידי זרימת העבודה: מזהה האתר שנפרס ואסימון ההרשאה של Netlify. פנה אל שלך הגדרות האתר ב-Netlify והעתק את מזהה אתר.

כדי לקבל את אסימון האישור, לחץ על פרופיל משתמש סמל ובחר את ה הגדרות משתמש אפשרות מהחלון הנפתח. בדף ההגדרות, בחר יישומים, ולחץ אסימון גישה חדש כדי ליצור אסימון ההרשאה שלך.

הוסף את שני משתני הסביבה כ-NETLIFY_SITE_ID ו-NETLIFY_AUTH_TOKEN גם למקטעי משתני הסביבה וגם למקטעים של סודות המאגר במאגר GitHub שלך. לאחר ביצוע שינויים אלה, הפעל מחדש את זרימת העבודה. Netlify תפרוס אוטומטית את כל השינויים הבאים שתדחף באמצעות צינור זה.

קדימה, בדוק את ה-API באמצעות Postman על ידי הגשת בקשות לכתובת האתר הזו: /.netlify/functions/app.

הגדרת צינורות CI/CD עם פעולות GitHub ו-Netlify

על ידי שימוש בפונקציות נטולות השרת של Netlify, אתה יכול לפרוס יישומי אינטרנט מלאים שמקיפים פונקציונליות של צד הלקוח ו-backend ב-Netlify.

בנוסף, הגדרת צינורות CI/CD עבור יישומים עם GitHub Actions מציעה גישה יעילה לאוטומציה של תהליך הבנייה והפריסה. זה מאפשר לך להגדיר זרימות עבודה המבטיחות תהליך פיתוח חלק ואמין, החל מרעיונות והתקדמות עד לשלב השחרור.