تمرين - دفع تغيير عبر البنية الأساسية لبرنامج ربط العمليات التجارية

مكتمل

في هذا الجزء، ترى فتحات النشر قيد التنفيذ. في الصفحة الرئيسية لموقع الويب، يمكنك تغيير لون الخلفية والنص على شعار البطل. ثم دفع التغييرات إلى GitHub، ومشاهدة تشغيل البنية الأساسية لبرنامج ربط العمليات التجارية، والتحقق من التغييرات.

لمزيد من الممارسة العملية، يمكنك بعد ذلك العودة إلى التغييرات الخاصة بك ومشاهدة تشغيل البنية الأساسية لبرنامج ربط العمليات التجارية كطريقة للمضي قدما.

تغيير النص على شعار البطل

هنا يمكنك تغيير النص على شعار البطل. لاحقا سترى التغيير عند النشر إلى App Service.

1. في Visual Studio Code، في الدليل Tailspin.SpaceGame.Web/Views/Home ، افتح Index.cshtml.

2. ابحث عن هذا النص بالقرب من أعلى الصفحة:

   <p>An example site for learning</p>
   

   تلميح

   يوفر Visual Studio Code طريقة للبحث عن نص في الملفات. للوصول إلى جزء البحث، حدد أيقونة عدسة التكبير في الجزء الجانبي.

3. استبدل نص المثال بالنص التالي، ثم احفظ الملف.

   <p>Welcome to the official Space Game site!</p>
   

تغيير لون الخلفية

هنا يمكنك تغيير لون خلفية شعار البطل من الرمادي إلى الأخضر.

1. في Visual Studio Code، في دليل Tailspin.SpaceGame.Web/wwwroot/css ، افتح site.scss.

   هام

   افتح site.scss، وليس site.css. يتم تشغيل المرحلة بناء node-sass لتحويل site.scss (ملف Sass) إلى موقع.css (ملف CSS قياسي).

2. حدد موقع التعليمات البرمجية التالية بالقرب من أعلى الملف:

   .intro {
     height: 350px;
     background-color: #666;
     background-image: url('/images/space-background.svg');
     background-size: 1440px;
     background-position: center top;
     background-repeat: no-repeat;
     background-attachment: fixed;
   

3. في التعليمات البرمجية، استبدل النص المميز كما هو موضح في المثال التالي. ثم احفظ الملف.

   .intro {
     height: 350px;
     background-color: green;
     background-image: url('/images/space-background.svg');
     background-size: 1440px;
     background-position: center top;
     background-repeat: no-repeat;
     background-attachment: fixed;
   

دفع التغيير من خلال البنية الأساسية لبرنامج ربط العمليات التجارية

عادة ما تقوم بإنشاء الموقع وتشغيله محليا للتحقق من التغيير. يمكنك أيضا تشغيل أي اختبارات وحدة مقترنة للتحقق من أن التغيير الخاص بك لا يكسر الوظائف الموجودة.

للإيجاز، هنا يمكنك تثبيت التغييرات على فرعك، ودفع فرعك إلى GitHub، ومشاهدة تشغيل البنية الأساسية لبرنامج ربط العمليات التجارية.

1. أضف Index.cshtml و site.scss إلى الفهرس، وقم بتنفيذ التغييرات، ثم ادفع التغييرات إلى GitHub.

   git add Tailspin.SpaceGame.Web/Views/Home/Index.cshtml Tailspin.SpaceGame.Web/wwwroot/css/site.scss
   git commit -m "Change text and colors on the home page"
   git push origin blue-green
   

2. في Azure Pipelines، تتبع البنية من خلال كل خطوة.

3. انتقل إلى عنوان URL الذي يتوافق مع فتحة الإنتاج لبيئة التشغيل المرحلي الخاصة بك. هذه الفتحة هي الفتحة الافتراضية التي قمت بتكوينها عند إعداد البنية الأساسية لبرنامج ربط العمليات التجارية في وقت سابق.

   ترى أن موقع الويب المنشور يعرض تغييرات اللون والنص.

   

4. انتقل إلى عنوان URL الذي يتوافق مع فتحة التبديل لبيئة التقسيم المرحلي. يتضمن عنوان URL "-swap.azurewebsites.net" باسمه.

   ترى الإصدار السابق من موقع الويب، دون تغيير اللون والنص.

   

   لا ترى أي تغييرات لأنك قمت بتبديل فتحة الإنتاج وفتحة التبديل . بمعنى آخر، هنا يمكنك دائما التوزيع إلى فتحة التبديل، ثم تبديل فتحة الإنتاج وفتحة التبديل. تضمن عملية التبديل أن فتحة الإنتاج تشير إلى النشر الأحدث.

إرجاع التغيير

لنفترض أنك قمت بنشر تغيير تريد إرجاعه. عند هذه النقطة، يمكنك التراجع عن التغيير عن طريق تبديل فتحة الإنتاج وفتحة التبديل مرة أخرى. على سبيل المثال، يمكنك تبديل الفتحات يدويا من خلال مدخل Microsoft Azure. أو، بدلا من التراجع عن التغييرات، يمكنك العودة إلى الأمام عن طريق دفع تغيير آخر عبر المسار.

هذا ما ستفعله هنا ستعيد أحدث تغييرات التعليمات البرمجية وتدفع تغييرا آخر عبر البنية الأساسية لبرنامج ربط العمليات التجارية. للقيام بذلك، يمكنك استخدام git revert الأمر .

في Git، نادرا ما تقوم بإزالة التثبيتات من محفوظات الملف. على عكس عملية "التراجع" في محرر نص، git revert ينشئ الأمر تثبيتا جديدا هو في الأساس عكس مجموعة التثبيتات المحددة. لمشاهدة عمليات التثبيت، يمكنك أولا تشغيل git log الأمر لتتبع محفوظات التثبيت أثناء عملية العودة.

1. في المحطة الطرفية، قم بتشغيل الأمر التالي git log لعرض محفوظات التثبيت.

   git --no-pager log --oneline
   

   يشبه الإخراج مثال التعليمات البرمجية التالي. في الإخراج الخاص بك، سترى تثبيتات إضافية ومعرفات تثبيت مختلفة.

   d6130b0 (HEAD -> blue-green, origin/blue-green) Change text and colors on the home page
   ce56955 Swap deployment slots
   0d6a123 Trigger the pipeline
   

   في الإخراج، تتبع محفوظات التثبيت. أحدث تثبيت في الأعلى.

2. قم بتشغيل الأمر التالي git revert للعودة عن طريق تثبيت واحد.

   git revert --no-edit HEAD
   

   فكر في HEAD على أنه الحالة الحالية للفرع الخاص بك. يشير HEAD إلى التثبيت الأخير. يحدد هذا الأمر إعادة التثبيت HEAD أو الأحدث فقط.

3. قم بتشغيل git log مرة أخرى لمشاهدة محفوظات التثبيت المحدثة.

   git --no-pager log --oneline
   

   في الجزء العلوي من الإخراج الخاص بك، ترى تثبيتا إضافيا يعيد التثبيت السابق. إليك مثال:

   e58896a (HEAD -> blue-green) Revert "Change text and colors on the home page"
   d6130b0 (origin/blue-green) Change text and colors on the home page
   ce56955 Swap deployment slots
   0d6a123 Trigger the pipeline
   

دفع التغيير المعاد عبر البنية الأساسية لبرنامج ربط العمليات التجارية

هنا يمكنك دفع التغيير الذي تم إرجاعه من خلال البنية الأساسية لبرنامج ربط العمليات التجارية ورؤية النتائج.

1. قم بتشغيل الأمر التالي git push لتحميل blue-green الفرع إلى مستودع GitHub الخاص بك.

   git push origin blue-green
   

2. في Azure Pipelines، انتقل إلى البنية. تتبع البنية أثناء تشغيلها.

3. انتقل إلى عناوين URL التي تتوافق مع فتحة التبديل وفتحة الإنتاج لبيئة التشغيل المرحلي.

   تشير فتحة الإنتاج الآن إلى التغيير الذي تم إرجاعه، وهو موقع الويب الأصلي.

   

   تشير فتحة التبديل الآن إلى التغيير السابق.

   

عمل رائع! لدى الفريق الآن طريقة لأتمتة الإصدارات. يمكنهم الحصول على ميزات جديدة لمستخدميهم دون تكبد وقت تعطل.

اجتماع الفريق

يجتمع الفريق لعرض البنية الأساسية لبرنامج ربط العمليات التجارية. هذه المرة، يدفع تيم تغييرا عبر البنية الأساسية لبرنامج ربط العمليات التجارية بينما يشاهد الجميع. لكن ليس الجميع مقتنعين

أندي: من الرائع رؤية فتحات التوزيع في العمل. لكني لا أفهم ذلك. كيف يمكننا الاستفادة من عمليات نشر وقت التعطل الصفري هنا؟ التقسيم المرحلي هو فقط لفريقنا والإدارة.

تيم: في الواقع، لن نرى فائدة كبيرة الآن. ولكن تخيل عندما نطبق عمليات النشر الزرقاء والأخضر على مرحلة الإنتاج . سيظل لدينا الموافقة اليدوية من الإدارة قبل الترقية إلى الإنتاج. ولكن عندما نقوم بإصدار ميزات جديدة، فإن عملية التبديل ستجعل الإطلاق فوريا تقريبا. سيكون سلسا لمستخدمينا.

أندي: حسنا، أعتقد أنني أفهم الآن. أحب هذا التحسن. كان من السهل إعداد نظام فتحات النشر، وسيفيد مستخدمينا. الجميع يفوز.

أميتا: بالحديث عن التحسينات، لماذا لا نعيد النظر في تمرين تعيين تدفق القيمة الذي قمنا به قبل بضعة أسابيع؟ أراهن أننا سنرى تقدما في مدى سرعة إصدار ميزات جديدة.

مارا: رائع، دعونا نضع ذلك على جدول أعمال اجتماع فريقنا القادم.