استقرار یک برنامه UI Next.js در S3 با استفاده از Jenkins🤩

استقرار برنامه Next.js در آمازون S3 با استفاده از Jenkins می تواند گردش کار توسعه شما را ساده کرده و تحویل مداوم کارآمد را فعال کند.

جنکینز چیست؟

جنکینز یک سرور اتوماسیون منبع باز محبوب است که یکپارچه سازی مداوم و تحویل مداوم (CI/CD) را در توسعه نرم افزار تسهیل می کند. این به طور گسترده ای برای خودکارسازی وظایف مربوط به ساخت، آزمایش و استقرار برنامه ها استفاده می شود و آن را به ابزاری حیاتی در خطوط لوله DevOps مدرن تبدیل می کند.

جنکینز از طریق افزونه ها بسیار توسعه پذیر است و به آن اجازه می دهد با ابزارها و فناوری های مختلف ادغام شود. چه با جاوا، Node.js، پایتون یا سایر زبان‌های برنامه‌نویسی کار می‌کنید، جنکینز را می‌توان برای کار با تقریباً هر پشته فناوری پیکربندی کرد.

ویژگی های کلیدی جنکینز

اتوماسیون ساخت و استقرار: جنکینز کارهای تکراری مانند ساخت کد، اجرای آزمایش ها، بسته بندی برنامه ها و استقرار آنها در محیط های مختلف را خودکار می کند. این به طور قابل توجهی مداخله دستی را کاهش می دهد، زمان تحویل را تسریع می کند و خطاهای انسانی را به حداقل می رساند.

یکپارچه سازی مداوم: جنکینز به توسعه دهندگان کمک می کند تا کد خود را به طور مکرر در یک مخزن مشترک ادغام کنند. هر ادغام با ساخت‌ها و آزمایش‌های خودکار تأیید می‌شود تا مشکلات زودهنگام شناسایی شود و اطمینان حاصل شود که مشکلات در طول زمان انباشته نمی‌شوند.

توسعه پذیری: جنکینز معماری مبتنی بر پلاگین دارد. هزاران پلاگین برای طیف گسترده ای از ابزارها و فناوری ها، از جمله سیستم های کنترل نسخه (Git، SVN)، ابزارهای ساخت (Maven، Gradle)، چارچوب های تست (JUnit، Selenium)، سیستم های استقرار (Docker، Kubernetes) و بیشتر

ساختمان های توزیع شده: جنکینز از ساخت‌های توزیع‌شده پشتیبانی می‌کند، به این معنی که می‌توانید چندین عامل جنکینز را روی ماشین‌های مختلف راه‌اندازی کنید تا وظایف را بارگیری کنید و زمان‌های ساخت را بهبود ببخشید، به‌ویژه در پروژه‌های بزرگ.

خط لوله به عنوان کد: Jenkins به کاربران این امکان را می دهد تا با استفاده از “Jenkinsfiles” نوشته شده در Groovy یا نحو اعلانی، گردش های کاری پیچیده را تعریف و خودکار کنند. این به تیم ها اجازه می دهد تا فرآیندهای CI/CD خود را حفظ و نسخه کنترل کنند و از شفافیت و تکرارپذیری اطمینان حاصل کنند.

پشتیبانی از پلتفرم های مختلف: جنکینز مستقل از پلتفرم است و می تواند بر روی سیستم عامل های مختلفی مانند لینوکس، ویندوز و macOS اجرا شود. همچنین با هر نرم افزاری که می تواند اسکریپت شود کار می کند.

ادغام با سیستم های کنترل نسخه: جنکینز به طور یکپارچه با سیستم های کنترل نسخه مانند Git، SVN و Mercurial یکپارچه می شود. این امکان را به آن می‌دهد تا زمانی که تغییراتی در پایگاه کد ایجاد می‌شود، فرآیندهای ساخت را به‌طور خودکار راه‌اندازی کند و فرآیند CI/CD را ساده‌تر کند.

چرا از جنکینز استفاده کنیم؟

توسعه سریعتر: با خودکارسازی فرآیند ساخت، آزمایش و استقرار، جنکینز چرخه‌های توسعه نرم‌افزار را تسریع می‌کند و به تیم‌ها اجازه می‌دهد به‌روزرسانی‌ها را به دفعات بیشتر و با کیفیت بالاتر منتشر کنند.

همکاری بهبود یافته: جنکینز با سیستم‌های کنترل نسخه مانند Git ادغام می‌شود و به تیم‌ها اجازه می‌دهد به طور مؤثرتری با هم کار کنند. توسعه‌دهندگان می‌توانند کد خود را به مخزن فشار دهند و جنکینز به‌طور خودکار تغییرات را دریافت کرده و آزمایش‌ها را اجرا می‌کند و اطمینان حاصل می‌کند که همه چیز به‌طور یکپارچه با هم کار می‌کند.

افزایش کیفیت: آزمایش‌های خودکار و شیوه‌های استقرار مداوم خطای انسانی را کاهش می‌دهد و اطمینان می‌دهد که فقط کدهای آزمایش شده و بررسی شده به درستی در تولید به کار می‌روند.

مقیاس پذیری: همانطور که پروژه شما رشد می کند، جنکینز می تواند با افزودن عوامل بیشتری برای انجام چندین کار به صورت موازی مقیاس شود. این به ویژه برای پروژه های بزرگتر که به منابع محاسباتی سنگین نیاز دارند مفید است.

جنکینز چگونه کار می کند

جنکینز بر اساس مدل مشتری-سرور کار می کند. سرور مسئول مدیریت و برنامه ریزی کارهای (وظایف) برای اجرا است، در حالی که عوامل (که به عنوان برده نیز شناخته می شوند) مسئول اجرای آن مشاغل هستند. در اینجا یک مرور کلی از نحوه کار جنکینز آورده شده است:

ایجاد شغل: یک شغل جنکینز یک کار یا گردش کار را تعریف می کند. به عنوان مثال، یک کار می‌تواند برای استخراج آخرین کد از یک سیستم کنترل نسخه، اجرای آزمایش‌ها و استقرار برنامه تنظیم شود.

راه اندازی یک شغل: کارها می توانند به صورت دستی یا خودکار فعال شوند. شما می توانید جنکینز را پیکربندی کنید تا هر زمان که کد جدید به سیستم کنترل نسخه، بر اساس یک برنامه زمانی (مثلاً شبانه)، یا بر اساس رویدادهای دیگر، یک کار را شروع کند.

اجرای کار: هنگامی که کار فعال می شود، جنکینز مراحل لازم را اجرا می کند (به عنوان مثال، واکشی کد، ساخت، آزمایش، استقرار). این می تواند شامل اجرای اسکریپت های پوسته، فراخوانی ابزارهای خارجی یا استفاده از پلاگین های جنکینز باشد.

گزارش و اطلاعیه: پس از اجرای کار، جنکینز گزارش ها و گزارش های دقیق را ارائه می دهد. در صورت موفقیت آمیز بودن ساخت، جنکینز یک نشانگر سبز و در صورت عدم موفقیت، یک نشانگر قرمز نمایش می دهد. جنکینز همچنین می‌تواند اعلان‌ها را از طریق ایمیل، Slack یا کانال‌های دیگر ارسال کند تا ذینفعان را مطلع کند.

ما شما را از طریق مراحل لازم برای استقرار برنامه Next.js در Amazon S3 با استفاده از Jenkins راهنمایی می کنیم.

پیش نیازها

قبل از اینکه وارد فرآیند استقرار شویم، مطمئن شوید که پیش نیازهای زیر را دارید:

• برنامه Next.js: یک برنامه کاربردی Next.js. اگر یکی ندارید، می توانید با استفاده از آن یکی ایجاد کنید create-next-app فرمان
• سطل آمازون S3: یک سطل S3 که در آن دارایی های ثابت ذخیره می شود.
• اعتبارنامه AWS IAM: یک کاربر AWS با مجوزهای مناسب برای دسترسی و آپلود در سطل S3 شما.
• سرور جنکینز: نمونه ای از جنکینز که با نصب پلاگین های لازم (به ویژه AWS CLI، NodeJS و Git) اجرا می شود.
• راه اندازی AWS CLI: AWS CLI باید روی سرور جنکینز نصب و پیکربندی شود. بیایید مراحل استقرار را تجزیه کنیم.

مرحله 1: برنامه Next.js را برای صادرات استاتیک تنظیم کنید

قبل از استقرار برنامه Next.js خود در S3، باید آن را به عنوان یک سایت ثابت بسازید.

1.1 پیکربندی next.config.js
اطمینان حاصل کنید که شما Next.js برنامه برای تولید سایت ایستا (SSG) پیکربندی شده است. در فایل next.config.js خود، گزینه static export را فعال کنید:

module.exports = {
  exportTrailingSlash: true,
};

این تنظیم تضمین می‌کند که برنامه Next.js با URLهایی صادر می‌شود که دارای یک اسلش انتهایی هستند.

1.2 برنامه Next.js را صادر کنید
Next.js یک فرمان صادرات داخلی برای تولید فایل های استاتیک فراهم می کند. دستور زیر را برای صادرات برنامه اجرا کنید:

npm run build
npm run export

با این کار فایل های ثابت در out دایرکتوری بعداً این فایل‌ها را در سطل S3 خود آپلود خواهید کرد.

مرحله 2: سطل AWS S3 را تنظیم کنید

یک سطل S3 ایجاد کنید:
به کنسول AWS S3 بروید و یک سطل جدید S3 ایجاد کنید. از عمومی بودن سطل اطمینان حاصل کنید تا کاربران بتوانند به فایل‌ها دسترسی داشته باشند.

پیکربندی سطل برای میزبانی استاتیک:

• پس از ایجاد سطل، به تنظیمات سطل بروید و “Static website hosting” را فعال کنید.
• سند شاخص را به عنوان تنظیم کنید index.html.
  تنظیم مجوزها:
  مجوزهای سطل را برای اجازه دسترسی عمومی به دارایی های ثابت پیکربندی کنید. یک سیاست سطلی مانند این اضافه کنید:

{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Sid": "PublicReadGetObject",
      "Effect": "Allow",
      "Action": "s3:GetObject",
      "Resource": "arn:aws:s3:::your-bucket-name/*"
    }
  ]
}

این تضمین می کند که فایل های استاتیک شما به صورت عمومی قابل دسترسی هستند.

مرحله 3: Jenkins را برای استقرار تنظیم کنید

3.1 پلاگین های جنکینز را نصب کنید
مطمئن شوید که پلاگین های Jenkins لازم را نصب کرده اید:

• پلاگین AWS CLI (برای تعامل با خدمات AWS)
• پلاگین NodeJS (برای ساخت برنامه Next.js شما)

• پلاگین Git (برای شبیه سازی مخزن شما)
  3.2 یک خط لوله جنکینز جدید ایجاد کنید

• ایجاد یک شغل جدید: در جنکینز، یک شغل جدید Pipeline ایجاد کنید.

• پیکربندی SCM: در پیکربندی Pipeline، مخزن خود را (به عنوان مثال، GitHub، Bitbucket) وصل کنید تا جنکینز بتواند کد را از مخزن شما بیرون بکشد.
  3.3 اسکریپت خط لوله جنکینز
  اکنون می توانید یک اسکریپت خط لوله بنویسید که کل فرآیند را خودکار می کند، از جمله ساخت برنامه و استقرار آن در S3.

در اینجا نمونه ای از خط لوله جنکینز است که همه اینها را انجام می دهد:

pipeline {
    agent any

    environment {
        AWS_ACCESS_KEY_ID = credentials('aws-access-key-id')  // Jenkins Credentials Store
        AWS_SECRET_ACCESS_KEY = credentials('aws-secret-access-key') // Jenkins Credentials Store
        S3_BUCKET_NAME = 'your-s3-bucket-name'
        REGION = 'us-west-2'
    }

    stages {
        stage('Clone Repository') {
            steps {
                git 'https://github.com/your-username/your-nextjs-repo.git'
            }
        }

        stage('Install Dependencies') {
            steps {
                script {
                    // Set up Node.js
                    def nodeVersion = '16.x'
                    def nodeHome = tool name: 'NodeJS', type: 'ToolLocation'
                    env.PATH = "${nodeHome}/bin:${env.PATH}"

                    // Install dependencies
                    sh 'npm install'
                }
            }
        }

        stage('Build Next.js App') {
            steps {
                sh 'npm run build'
                sh 'npm run export'
            }
        }

        stage('Deploy to S3') {
            steps {
                script {
                    // Sync the generated files to S3
                    sh """
                        aws s3 sync out/ s3://${S3_BUCKET_NAME}/ --delete --region ${REGION}
                    """
                }
            }
        }

        stage('Invalidate CloudFront Cache') {
            steps {
                script {
                    // Invalidate the CloudFront cache if using CloudFront as CDN
                    // If you are using CloudFront for caching, you should invalidate the cache after the deployment
                    sh """
                        aws cloudfront create-invalidation --distribution-id YOUR_DISTRIBUTION_ID --paths "/*" --region ${REGION}
                    """
                }
            }
        }
    }

    post {
        success {
            echo "Deployment Successful!"
        }

        failure {
            echo "Deployment Failed!"
        }
    }
}

توضیح خط لوله:

• مخزن کلون: این مرحله مخزن حاوی برنامه Next.js شما را از یک مخزن GitHub یا GitLab شبیه سازی می کند.
• Install Dependencies: وابستگی های مورد نیاز را برای برنامه Next.js شما نصب می کند.
• برنامه Next.js را بسازید: npm run build و npm run export را اجرا می کند تا فایل های ثابت را در دایرکتوری out تولید کند.
• به S3 مستقر شوید: از AWS CLI استفاده می کند aws s3 sync دستور آپلود فایل ها از دایرکتوری out در سطل S3 شما.
• حافظه پنهان CloudFront را باطل کنید: اگر از CloudFront به عنوان CDN استفاده می کنید، این مرحله حافظه پنهان را باطل می کند تا اطمینان حاصل شود که کاربران شما آخرین محتوا را می بینند.

چگونه به مخزن Private Git در Jenkins دسترسی پیدا کنیم؟

برای دسترسی به یک مخزن خصوصی GitHub از جنکینز، باید اعتبارنامه ها را برای احراز هویت پیکربندی کنید. این را می توان با استفاده از Jenkins Credentials یا از طریق یک توکن GitHub انجام داد.

مراحل پیکربندی اعتبار رمز GitHub:
یک رمز دسترسی شخصی (PAT) در GitHub ایجاد کنید:

• به GitHub بروید Settings.
• روی Generate new token کلیک کنید.
• نامی به آن بدهید و محدوده های لازم را انتخاب کنید (مثلاً مخزن برای دسترسی کامل به مخازن خصوصی).

• رمز را کپی کنید (دیگر نمی توانید آن را ببینید).
  اعتبارنامه را به جنکینز اضافه کنید:

• به قسمت Jenkins Dashboard > Manage Jenkins > Manage Credentials بروید.

• دامنه صحیح را انتخاب کنید (یا آن را به عنوان جهانی رها کنید).

• روی Add Credentials کلیک کنید.

• Kind را روی نام کاربری با رمز عبور تنظیم کنید.

• در قسمت Username، نام کاربری GitHub خود را قرار دهید.

• در قسمت Password، رمز دسترسی شخصی را که ایجاد کرده اید، قرار دهید.

• به اعتبارنامه ها یک شناسه بدهید (مثلاً github-credentials).

اسکریپت Jenkins Pipeline خود را برای استفاده از اعتبارنامه ها به روز کنید:

می توانید با استفاده از credentialsId زمینه

pipeline {
    agent any
    tools {
      nodejs 'nodejs' // nodejs is a plugin name
    }
    stages {
        stage('Git Checkout') {
            steps {
                git credentialsId: 'github-credentials', url: "https://github.com/workspace/xyz.git", branch: "main"
            }
        }
    }
}

توضیح:

• شناسه اعتبار: این با شناسه اعتبارنامه هایی که در Jenkins ایجاد کرده اید مطابقت دارد.
• آدرس اینترنتی: URL HTTPS مخزن GitHub شما.
• شاخه: شاخه ای که می خواهید شبیه سازی کنید (مثلاً اصلی).

با دنبال کردن این مراحل، می توانید با استفاده از Jenkins، استقرار برنامه Next.js خود را در Amazon S3 به طور خودکار انجام دهید. این رویکرد نه تنها فرآیند استقرار شما را کارآمدتر می کند، بلکه به خوبی با خطوط لوله یکپارچه سازی/استقرار پیوسته (CI/CD) ادغام می شود.

با مدیریت ساخت و استقرار Jenkins، می‌توانید روی توسعه برنامه Next.js خود تمرکز کنید و بدانید که هر به‌روزرسانی به‌طور خودکار به روشی قابل اعتماد و قابل تکرار به S3 منتقل می‌شود.

کد نویسی مبارک…!!