في هذه المقالة، لن أقارن بين monorepo وpolyrepo لأن الأمر يتعلق بالفلسفة. بدلاً من ذلك، سأركز على تجربة البناء والتطور وأفترض أنك على دراية بنظام JS/TS الإيكولوجي.
لطالما كان لدي حلم بإنشاء monorepo.
رأيت نهج monorepo أثناء عملي في Airbnb، لكنه كان للواجهات الأمامية فقط. بحب عميق لنظام JavaScript الإيكولوجي وتجربة تطوير TypeScript "السعيدة"، بدأت في توحيد كود الواجهة الأمامية والخلفية في نفس اللغة منذ حوالي ثلاث سنوات. لقد كان أمراً رائعاً (للتوظيف) ولكنه لم يكن رائعاً للتطوير حيث كانت مشاريعنا لا تزال موزعة عبر مستودعات متعددة.
كما يُقال، "أفضل طريقة لإعادة هيكلة مشروع هي بدء مشروع جديد". لذلك عندما بدأت شركتي الناشئة منذ حوالي عام، قررت استخدام استراتيجية monorepo كاملة: وضع مشاريع الواجهة الأمامية والخلفية، حتى مخططات قاعدة البيانات، في مستودع واحد.
في هذه المقالة، لن أقارن بين monorepo وpolyrepo لأن الأمر يتعلق بالفلسفة. بدلاً من ذلك، سأركز على تجربة البناء والتطور وأفترض أنك على دراية بنظام JS/TS الإيكولوجي.
النتيجة النهائية متوفرة على GitHub.
بكل صراحة، أنا من محبي JavaScript وTypeScript. أحب توافقه بين المرونة والدقة: يمكنك الرجوع إلى unknown أو any (على الرغم من أننا منعنا أي شكل من أشكال any في قاعدة الكود لدينا)، أو استخدام مجموعة قواعد صارمة بشكل كبير لتوحيد نمط الكود عبر الفريق.
عندما كنا نتحدث عن مفهوم "البرمجة الكاملة" سابقًا، كنا عادةً ما نتخيل وجود نظامين إيكولوجيين على الأقل ولغتين برمجيتين: واحدة للواجهة الأمامية وواحدة للواجهة الخلفية.
في يوم من الأيام، أدركت أنه يمكن أن يكون الأمر أبسط: Node.js سريع بما يكفي (صدقوني، في معظم الحالات، جودة الكود أكثر أهمية من سرعة التشغيل)، وTypeScript ناضج بما فيه الكفاية (يعمل بشكل جيد في المشاريع الكبيرة للواجهة الأمامية)، ومفهوم monorepo قد تم تطبيقه من قبل فرق مشهورة (React, Babel, etc.) - فلماذا لا نجمع كل الكود معًا، من الواجهة الأمامية إلى الخلفية؟ هذا يمكن أن يجعل المهندسين يقومون بالمهام دون تبديل السياق في مستودع واحد وتنفيذ ميزة كاملة (تقريبًا) في لغة واحدة.
بصفتي مطورًا، وكالعادة، لم أستطع الانتظار للبدء في الترميز. ولكن هذه المرة، كانت الأمور مختلفة.
اختيار مدير الحزم أمر حاسم لتجربة التطوير في monorepo.
كان ذلك في يوليو 2021. بدأت بـ [email protected] لأنني كنت أستخدمه لفترة طويلة. كان Yarn سريعًا، لكن سرعان ما واجهت العديد من المشاكل مع Yarn Workspaces. على سبيل المثال، عدم تجميع التبعيات بشكل صحيح، والكثير من المشاكل تم وضع علامة عليها بـ "fixed in modern", والذي يوجهني إلى الإصدار الثاني (berry).
"حسنًا، سأقوم بالترقية الآن". توقفت عن الكفاح مع v1 وبدأت في الانتقال. لكن دليل الانتقال الطويل لـ berry أخافني، وتوقفت بعد عدة تجارب فاشلة.
لذلك بدأت البحث عن مديري الحزم. استحوذ علي pnpm بعد تجربة: سريع مثل yarn، دعم monorepo مدمج، أوامر مشابهة لـ npm، الروابط الصلبة، إلخ. والأهم من ذلك، أنه يعمل فقط. كمطور يرغب في البدء بمنتج وليس تطوير مدير حزم، كنت أريد فقط إضافة بعض التبعيات والبدء في المشروع دون معرفة كيفية عمل مدير الحزم أو أي مفاهيم فاخرة أخرى.
بناءً على نفس الفكرة، اخترنا صديقنا القديم lerna لتنفيذ الأوامر عبر الحزم ونشر حزم workspace.
من الصعب تحديد النطاق النهائي لكل حزمة بوضوح في البداية. فقط ابدأ بأفضل محاولة لك وفقًا للوضع الحالي، وتذكر أنك دائمًا يمكن إعادة هيكلة أثناء التطوير.
البنية الأولية تحتوي على أربع حزم:
core: خدمة الشاملة للواجهة الخلفية.phrases: الموارد الرئاسية لـ i18n المفتاحية.schemas: مخططات قاعدة البيانات وTypeScript المشتركة.ui: تطبيق ويب SPA يتفاعل مع core.نظرًا لأننا نتبنى نظام JavaScript الإيكولوجي ونستخدم TypeScript كلغتنا البرمجية الرئيسية، فإن الكثير من الخيارات تكون مباشرة (بناءً على تفضيلي 😊):
koajs للخدمة الخلفية (core): واجهت صعوبة في استخدام async/await في express، لذلك قررت استخدام شيء مع دعم مدمج.i18next/react-i18next لـ i18n (phrases/ui): أحب بساطة واجهات الـ APIs ودعم TypeScript الجيد.react لـ SPA (ui): مجرد تفضيل شخصي.ما زال هناك شيء مفقود هنا: نظام قاعدة البيانات وتعريف المخطط <-> TypeScript.
في ذلك الوقت، جربت نهجين شائعين:
لكن كلاهما يخلق شعورًا غريبًا خلال التطوير السابق:
.raw() للاستعلامات الخام في العديد من السيناريوهات.ثم رأيت هذه المقالة: "كف عن استخدام Knex.js: استخدام منشئ استعلام SQL هو نمط مضاد". العنوان يبدو عدوانياً، لكن المحتوى رائع. يذكرني بقوة أن "SQL هي لغة برمجة"، وأدركت أنني أستطيع كتابة SQL مباشرةً (مثل CSS، كيف يمكنني أن أفتقد هذا!) لاستغلال اللغة الأصلية وميزات قاعدة البيانات بدلاً من إضافة طبقة أخرى والحد من القوة.
في الختام، قررت التمسك بـ Postgres و Slonik (عميل Postgres مفتوح المصدر)، كما تنص المقالة:
... الفائدة من السماح للمستخدم بالاختيار بين اللهجات المختلفة لقاعدة البيانات ضئيلة والتكلفة الزائدة للتطور لدعم قواعد بيانات متعددة في نفس الوقت كبيرة.
ميزة أخرى لكتابة SQL هي أننا يمكننا استخدامها بسهولة كمصدر واحد للحقيقة لتعريفات TypeScript. كتبت مولد كود لتحويل مخططات SQL إلى كود TypeScript الذي سنستخدمه في خلفيتنا، والنتيجة تبدو جيدة:
يمكننا حتى ربط jsonb بنوع TypeScript ومعالجة التحقق من النوع في الخدمة الخلفية إذا لزم الأمر.
الهيكل النهائي للتبعيات يبدو كالتالي:
%3btext-align:center%3b%7d%23mermaid-0 .edgeLabel p%7bbackground-color:rgba(232%2c232%2c232%2c 0.8)%3b%7d%23mermaid-0 .edgeLabel rect%7bopacity:0.5%3bbackground-color:rgba(232%2c232%2c232%2c 0.8)%3bfill:rgba(232%2c232%2c232%2c 0.8)%3b%7d%23mermaid-0 .labelBkg%7bbackground-color:rgba(232%2c 232%2c 232%2c 0.5)%3b%7d%23mermaid-0 .cluster rect%7bfill:%23ffffde%3bstroke:%23aaaa33%3bstroke-width:1px%3b%7d%23mermaid-0 .cluster text%7bfill:%23333%3b%7d%23mermaid-0 .cluster span%7bcolor:%23333%3b%7d%23mermaid-0 div.mermaidTooltip%7bposition:absolute%3btext-align:center%3bmax-width:200px%3bpadding:2px%3bfont-family:arial%2csans-serif%3bfont-size:12px%3bbackground:hsl(80%2c 100%25%2c 96.2745098039%25)%3bborder:1px solid %23aaaa33%3bborder-radius:2px%3bpointer-events:none%3bz-index:100%3b%7d%23mermaid-0 .flowchartTitleText%7btext-anchor:middle%3bfont-size:18px%3bfill:%23333%3b%7d%23mermaid-0 rect.text%7bfill:none%3bstroke-width:0%3b%7d%23mermaid-0 .icon-shape%2c%23mermaid-0 .image-shape%7bbackground-color:rgba(232%2c232%2c232%2c 0.8)%3btext-align:center%3b%7d%23mermaid-0 .icon-shape p%2c%23mermaid-0 .image-shape p%7bbackground-color:rgba(232%2c232%2c232%2c 0.8)%3bpadding:2px%3b%7d%23mermaid-0 .icon-shape rect%2c%23mermaid-0 .image-shape rect%7bopacity:0.5%3bbackground-color:rgba(232%2c232%2c232%2c 0.8)%3bfill:rgba(232%2c232%2c232%2c 0.8)%3b%7d%23mermaid-0 :root%7b--mermaid-font-family:arial%2csans-serif%3b%7d%3c/style%3e%3cg%3e%3cmarker orient='auto' markerHeight='8' markerWidth='8' markerUnits='userSpaceOnUse' refY='5' refX='5' viewBox='0 0 10 10' class='marker flowchart-v2' id='mermaid-0_flowchart-v2-pointEnd'%3e%3cpath style='stroke-width: 1%3b stroke-dasharray: 1%2c 0%3b' class='arrowMarkerPath' d='M 0 0 L 10 5 L 0 10 z'/%3e%3c/marker%3e%3cmarker orient='auto' markerHeight='8' markerWidth='8' markerUnits='userSpaceOnUse' refY='5' refX='4.5' viewBox='0 0 10 10' class='marker flowchart-v2' id='mermaid-0_flowchart-v2-pointStart'%3e%3cpath style='stroke-width: 1%3b stroke-dasharray: 1%2c 0%3b' class='arrowMarkerPath' d='M 0 5 L 10 10 L 10 0 z'/%3e%3c/marker%3e%3cmarker orient='auto' markerHeight='11' markerWidth='11' markerUnits='userSpaceOnUse' refY='5' refX='11' viewBox='0 0 10 10' class='marker flowchart-v2' id='mermaid-0_flowchart-v2-circleEnd'%3e%3ccircle style='stroke-width: 1%3b stroke-dasharray: 1%2c 0%3b' class='arrowMarkerPath' r='5' cy='5' cx='5'/%3e%3c/marker%3e%3cmarker orient='auto' markerHeight='11' markerWidth='11' markerUnits='userSpaceOnUse' refY='5' refX='-1' viewBox='0 0 10 10' class='marker flowchart-v2' id='mermaid-0_flowchart-v2-circleStart'%3e%3ccircle style='stroke-width: 1%3b stroke-dasharray: 1%2c 0%3b' class='arrowMarkerPath' r='5' cy='5' cx='5'/%3e%3c/marker%3e%3cmarker orient='auto' markerHeight='11' markerWidth='11' markerUnits='userSpaceOnUse' refY='5.2' refX='12' viewBox='0 0 11 11' class='marker cross flowchart-v2' id='mermaid-0_flowchart-v2-crossEnd'%3e%3cpath style='stroke-width: 2%3b stroke-dasharray: 1%2c 0%3b' class='arrowMarkerPath' d='M 1%2c1 l 9%2c9 M 10%2c1 l -9%2c9'/%3e%3c/marker%3e%3cmarker orient='auto' markerHeight='11' markerWidth='11' markerUnits='userSpaceOnUse' refY='5.2' refX='-1' viewBox='0 0 11 11' class='marker cross flowchart-v2' id='mermaid-0_flowchart-v2-crossStart'%3e%3cpath style='stroke-width: 2%3b stroke-dasharray: 1%2c 0%3b' class='arrowMarkerPath' d='M 1%2c1 l 9%2c9 M 10%2c1 l -9%2c9'/%3e%3c/marker%3e%3cg class='root'%3e%3cg class='clusters'%3e%3cg data-look='classic' id='Monorepo' class='cluster'%3e%3crect height='208' width='369.40234375' y='112' x='8' style=''/%3e%3cg transform='translate(156.677734375%2c 112)' class='cluster-label'%3e%3cforeignObject height='24' width='72.046875'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='nodeLabel'%3e%3cp%3eMonorepo%3c/p%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3c/g%3e%3cg class='edgePaths'%3e%3cpath marker-end='url(%23mermaid-0_flowchart-v2-pointEnd)' style='' class='edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link' id='L_database_Schemas_0' d='M279.051%2c62L279.051%2c66.167C279.051%2c70.333%2c279.051%2c78.667%2c279.051%2c87C279.051%2c95.333%2c279.051%2c103.667%2c279.051%2c111.333C279.051%2c119%2c279.051%2c126%2c279.051%2c129.5L279.051%2c133'/%3e%3cpath marker-end='url(%23mermaid-0_flowchart-v2-pointEnd)' style='' class='edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link' id='L_Phrases_Core_1' d='M84.97%2c191L81.671%2c195.167C78.372%2c199.333%2c71.774%2c207.667%2c70.63%2c215.428C69.486%2c223.19%2c73.796%2c230.379%2c75.951%2c233.974L78.106%2c237.569'/%3e%3cpath marker-end='url(%23mermaid-0_flowchart-v2-pointEnd)' style='' class='edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link' id='L_Phrases_UI_2' d='M157.766%2c191L165.701%2c195.167C173.635%2c199.333%2c189.505%2c207.667%2c204.928%2c216.342C220.35%2c225.018%2c235.325%2c234.036%2c242.812%2c238.544L250.3%2c243.053'/%3e%3cpath marker-end='url(%23mermaid-0_flowchart-v2-pointEnd)' style='' class='edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link' id='L_Schemas_Core_3' d='M229.022%2c191L221.302%2c195.167C213.581%2c199.333%2c198.14%2c207.667%2c184.072%2c215.656C170.003%2c223.646%2c157.307%2c231.291%2c150.959%2c235.114L144.611%2c238.937'/%3e%3cpath marker-end='url(%23mermaid-0_flowchart-v2-pointEnd)' style='' class='edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link' id='L_Schemas_UI_4' d='M299.392%2c191L302.531%2c195.167C305.67%2c199.333%2c311.948%2c207.667%2c313.267%2c215.406C314.585%2c223.145%2c310.944%2c230.291%2c309.123%2c233.863L307.302%2c237.436'/%3e%3c/g%3e%3cg class='edgeLabels'%3e%3cg class='edgeLabel'%3e%3cg transform='translate(0%2c 0)' class='label'%3e%3cforeignObject height='0' width='0'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' class='labelBkg' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='edgeLabel'%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3cg class='edgeLabel'%3e%3cg transform='translate(0%2c 0)' class='label'%3e%3cforeignObject height='0' width='0'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' class='labelBkg' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='edgeLabel'%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3cg class='edgeLabel'%3e%3cg transform='translate(0%2c 0)' class='label'%3e%3cforeignObject height='0' width='0'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' class='labelBkg' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='edgeLabel'%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3cg class='edgeLabel'%3e%3cg transform='translate(0%2c 0)' class='label'%3e%3cforeignObject height='0' width='0'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' class='labelBkg' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='edgeLabel'%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3cg class='edgeLabel'%3e%3cg transform='translate(0%2c 0)' class='label'%3e%3cforeignObject height='0' width='0'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' class='labelBkg' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='edgeLabel'%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3c/g%3e%3cg class='nodes'%3e%3cg transform='translate(279.05078125%2c 35)' id='flowchart-database-0' class='node default'%3e%3crect height='54' width='196.078125' y='-27' x='-98.0390625' style='' class='basic label-container'/%3e%3cg transform='translate(-68.0390625%2c -12)' style='' class='label'%3e%3crect/%3e%3cforeignObject height='24' width='136.078125'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='nodeLabel'%3e%3cp%3ePostgres Database%3c/p%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3cg transform='translate(279.05078125%2c 164)' id='flowchart-Schemas-1' class='node default'%3e%3crect height='54' width='126.703125' y='-27' x='-63.3515625' style='' class='basic label-container'/%3e%3cg transform='translate(-33.3515625%2c -12)' style='' class='label'%3e%3crect/%3e%3cforeignObject height='24' width='66.703125'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='nodeLabel'%3e%3cp%3eSchemas%3c/p%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3cg transform='translate(106.34765625%2c 164)' id='flowchart-Phrases-2' class='node default'%3e%3crect height='54' width='118.703125' y='-27' x='-59.3515625' style='' class='basic label-container'/%3e%3cg transform='translate(-29.3515625%2c -12)' style='' class='label'%3e%3crect/%3e%3cforeignObject height='24' width='58.703125'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='nodeLabel'%3e%3cp%3ePhrases%3c/p%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3cg transform='translate(96.34765625%2c 268)' id='flowchart-Core-3' class='node default'%3e%3crect height='54' width='94.6875' y='-27' x='-47.34375' style='' class='basic label-container'/%3e%3cg transform='translate(-17.34375%2c -12)' style='' class='label'%3e%3crect/%3e%3cforeignObject height='24' width='34.6875'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='nodeLabel'%3e%3cp%3eCore%3c/p%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3cg transform='translate(291.7265625%2c 268)' id='flowchart-UI-5' class='node default'%3e%3crect height='54' width='76' y='-27' x='-38' style='' class='basic label-container'/%3e%3cg transform='translate(-8%2c -12)' style='' class='label'%3e%3crect/%3e%3cforeignObject height='24' width='16'%3e%3cdiv style='display: table-cell%3b white-space: nowrap%3b line-height: 1.5%3b max-width: 200px%3b text-align: center%3b' xmlns='http://www.w3.org/1999/xhtml'%3e%3cspan class='nodeLabel'%3e%3cp%3eUI%3c/p%3e%3c/span%3e%3c/div%3e%3c/foreignObject%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e)
قد تلاحظ أنها مخطط باتجاه واحد، مما ساعدنا بشكل كبير في الحفاظ على هيكل واضح والقدرة على التوسع بينما ينمو المشروع. بالإضافة إلى ذلك، الكود هو (بشكل أساسي) كله في TypeScript.
pnpm و lerna يقومان بعمل رائع في تبعيات workspace الداخلية. نستخدم الأمر أدناه في جذر المشروع لإضافة حزم الزملاء:
سيضيف @logto/schemas كحال استخدام لـ @logto/core. بينما نحافظ على الإصدار الدلالي في package.json لتبعياتك الداخلية، يمكن لـ pnpm أيضًا ربطها بشكل صحيح في pnpm-lock.yaml. ستبدو النتيجة كما يلي:
نعامل كل حزمة في monorepo كـ "مستقلة". لذلك يمكننا استخدام النهج القياسي لمشاركة التكوين، والذي يغطي tsconfig، eslintConfig، prettier، stylelint ، وjest-config. انظر هذا المشروع كمثال.
أستخدم VSCode للتطوير اليومي، وباختصار، لا شيء يختلف عندما يتم تكوين المشروع بشكل صحيح:
pattern بالقيمة الخاصة بك):نستخدم مترجمات مختلفة للواجهة الأمامية والخلفية: parceljs لـ UI (React) و tsc لجميع حزم TypeScript البحتة الأخرى. أوصي بشدة بتجربة parceljs إذا لم تفعل. إنها فعلاً مُترجم "صفر تكوين" يتعامل بمرونة مع أنواع الملفات المختلفة.
يستضيف Parcel خادم التطوير الأمامي الخاص به، ومخرجات الإنتاج هي فقط ملفات ثابتة. نظرًا لأننا نود ربط APIs و SPA تحت نفس الأصل لتجنب مشاكل CORS، فإن الاستراتيجية أدناه تعمل:
يمكنك العثور على تنفيذ وظيفة واجهة التطوير الأمامية هنا.
لدينا نص dev في package.json لكل حزمة يراقب التغييرات في الملفات ويعيد التحويل كما هو مطلوب. شكرًا لـ lerna، أصبحت الأشياء سهلة باستخدام lerna exec لتشغيل نصوص الحزم بالتوازي. سيكون النص الجذر كما يلي:
بشكل مثالي، خطوتان فقط لمهندس/مساهم جديد للبدء:
pnpm i && pnpm devلقد كان فريقنا يطور تحت هذا النهج لمدة عام، ونحن سعداء به تمامًا. قم بزيارة مستودع GitHub الخاص بنا لرؤية شكل المشروع الحالي. لتلخيص:
المتاعب
المكاسب
تظل هذه المقالة تغفل عدة مواضيع: إعداد المستودع من الصفر، إضافة حزمة جديدة، الاستفادة من GitHub Actions لـ CI/CD، إلخ. سيكون طويل جدًا لهذه المقالة إذا قمت بتوسيع كل واحد منهم. لا تتردد في التعليق وإبلاغي بأي موضوع تود رؤيته في المستقبل.