ریاکت برای غارنشینان 12 (ci /cd با استفاده از github action)

خب این قسمت خیلی وابستگی به ریاکت نداره و برای خیلی از پروژه ها قابل استفاده ست . منم دواپس نیستم ولی در حد نیازم لازم دارم که کارامو خودکار کنم

گیت هاب بعد از این که زحمت کشید و مارو تحریم کرد .اومد و github actions رو معرفی کرد.فرصت نشده بود باهاش کار کنم .بریم ببینیم چجوریاست

پروژه مون رو که یادتونه روی گیت هاب گذاشته بودیم؟ حالا میخوایم یه سری کار باحال باهاش بکنیم .

اول از همه عبارت github cicd رو سرچ کردم و به این لینک رسیدم.

بعد از ثبت نام وقتی وارد صفحه ی پروژه شدم دیدم یه تب actions هم اضافه شده

همین که واردش میشید کلی کانفیگ آماده برای انواع کارها میبینید.

ما از Node.js شروع میکنیم .وقتی که انتخابش کردم کانفیگ زیر رو نشونم داد

چیزی که معلومه اینه که داره این کار هارو روی یه سیستم عامل اوبونتو انجام میده . اومده و 3 نسخه ی متفاوت node رو ریخته توی matrix که نمیدونم چیه .در ادامه هم دستور های npm install , npm run build و npm test رو اجرا کرده ... خب همین رو سیو میکنیم ببینیم چی میشه

بعد از سیو وارد تب اکشن شدم و دیدم اون بقل برام 3 نسخه ی مختلف node رو گذاشته که خب معنی matrix هم فهمیدیم .

فرایند روی همه ی نسخه ها نا موفق بود ...یکیش رو باز کردم ببینم داستان چیه

نصب پکیج ها و بیلد گرفتن پروژه موفق بود ولی چون هیچ تستی وجود نداشت jest ارور داده بود ... رفتم توی package.json و جلوی دستور test فلاگی که حین ارور پیشنهاد داده بود رو اضافه کردم ... از توی فایل تنظیمات اکشن هم فقط node 12.x رو گذاشتم که بمونه

درنهایت همه چیز میزون بود

ولی خب اینا به چه دردمون میخوره؟شما وقتی یه تغییری توی کد ها میدید و تغییرات رو پوش میکنید , گیت هاب میاد و پروژه رو بیلد میکنه و تست هارو هم اجرا میکنه و اگه خطایی وجود داشته باشه بهتون اطلاع میده . میتونید خیلی کارای دیگه رو هم باهاش قاطی کنین .مثلا چی؟

توی پست های قبلی یه کم در مورد داکر صحبت کردیم .و برای پروژه مون داکرفایل ساختیم .حالا من میخوام به کمک همین قابلیت های جدید گیت هاب بیام و کاری کنم که بعد از هر باری که من تغییراتم رو پوش میکنم روی گیت هاب ,به طور خودکار فایل ایمیج برام ساخته بشه و روی رجیستری که گیت هاب در اختیارمون گذاشته قرار بگیره..در مرحله ی بعد هم این فایل ایمیج رو متصل کنم به سرویس هایی مثل فندوق تا هروقت که من تغییری رو پوش میکنم به طور خودکار سایتم آپدیت بشه.خب از کجا شروع کنیم؟

توی تب اکشن یه workflow جدید میسازیم و اینبار Docker image رو انتخاب میکنیم..بدون تغییر همون رو سیو میکنم و میبینم که همه چیز داره درست کار میکنه :D ...لعنتی خیلی ساده ست

الان با هربار کامیت کردن یه بار اون کانفیگ node اجرا میشه و یه بار هم داکر.و خب الان جفتشون موفق بودن . ولی باید دقت کنین که این کارها روی یه سیستم موقت داره انجام میشه .یعنی اون فایل ایمیجی که ساخته میشه عملا جایی ذخیره نمیشه . خب حالا چیکار کنیم؟چجوری فایل ایمیج رو منتقل کنیم به ریجستری گیتهاب؟ برای کار با اکشن خیلیا اومدن و خیلی کانفیگ های آماده ساختن که میتونین برای کارهای مختلف ازشون استفاده کنین . لیستشون رو از اینجا میتونین ببینین.مثلا یکی اومده و وصلش کرده به تلگرام یعنی اگه بعد از پوش کردن کدها اروری وجود داشته باشه داخل تلگرام براتون نوتیفیکیشن میاد . باحاله ولی به دردمون نمیخوره .واسه دردمون یکی اومده و این رو نوشته اسمش رو هم گذاشته publish docker که میشه راحت ازش استفاده کرد ولی ما چرا خودمون ننویسیم؟کاری نداره که

اگه یه نگاه به صفحه ی package توی github بندازین همچین چیزی میبینین

خب ما هم بر اساس همین میایم و کانفیگمون رو مثل زیر تغییر میدیم

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

بعد از کمی جست و جو فهمیدم که باید به جای پسورد یه توکن تعریف کنم که اجازه ی نوشتن داشته باشه .پس رفتم اینجا و یه توکن تعریف کردم و اون توکن رو توی سکرت ها جایگزین پسورد کردم.

ایندفه اکشن بدون خطا اجرا شد

و توی قسمت package ها هم ایمیجمون اضافه شد

حالا میتونیم این ایمیجمون رو توو جاهای مختلف مثل فندوق استفاده کنیم

فندوق رو توی شماره ی بعدی میگم .فقط به این نکته توجه کنین که این مراحل باید پشت سر هم باشه یعنی اگه اون قسمت بیلد و تست ناموفق بود دیگه قسمت داکر اجرا نشه ..اینارو بعدا درست میکنیم ..فعلا بریم سروقت فندوق