كيفية اختيار حزمة التكنولوجيا المناسبة لتطوير تطبيقات الويب


قبل تطوير أي منتج رقمي، سواء كان تطبيقاً للهاتف المحمول أو تطبيقاً للويب، فإن المهمة الأكثر أهمية هي اختيار الحزمة التقنية المناسبة التي سيُبنى عليها تطبيقك. 

لماذا؟

تؤثر حزمة التقنية بشكل مباشر على أداء تطبيقك. من المهم أن تتناسب حزمة التكنولوجيا بشكل مثالي مع نوع التطبيق الذي تقوم ببنائه.

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

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

دعونا ندخل في صلب الموضوع!

ما هي حزمة التكنولوجيا؟

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

بعبارات الشخص العادي، يتطلب تطوير تطبيقات الويب واجهة أمامية وواجهة خلفية وقاعدة بيانات. كل هذه الطبقات تشكل كومة تقنية.

هيكل كومة التكنولوجيا

كما ذكرنا أعلاه, تتكون الحزمة التقنية من ثلاثة مكونات:

  • الواجهة الأمامية
  • النهاية الخلفية
  • البرمجيات الوسيطة

ولكن ما هي؟ ماذا يفعلون؟ وما الحاجة إليها؟

دعنا نتعمق أكثر ونفهم كل مكون بشكل أعمق.

تطوير الواجهة الأمامية (تطوير جانب العميل)

في أبسط العبارات، الواجهة الأمامية هي المكان الذي تحدث فيه جميع تفاعلات المستخدم. في تطبيق الويب، يمكن للمستخدمين رؤية هذا الجزء من التطبيق والتفاعل معه فقط.

بالنسبة لتطبيق الويب، يتم تنفيذ تفاعل المستخدم هذا في متصفح ويب مثل Safari أو Chrome أو Internet Explorer.

بالنسبة لـ الواجهة الأمامية التطوير, ، يتم استخدام التقنيات الثلاث التالية:

HTML

HTMLهي لغة ترميز نص تشعبي تستخدم لوصف بنية المحتوى المعروض على صفحة ويب.

CSS

يُطلق على CSS ورقة الأنماط المتتالية التي تُستخدم بشكل أساسي لتنسيق المحتوى المكتوب بلغة HTML.

بالنسبة لغالبية تطبيقات الويب، يعد Bootstrap إطار عمل شائع الاستخدام لـ HTML و CSS. وقد اكتسبت مكتبتها الشاملة قاعدة مستخدمين ضخمة لنفسها. الأساس هو إطار عمل آخر يفضله الكثير من المطورين ل HTML و CSS.

جافا سكريبت

تساعد JavaScript بشكل أساسي في جعل صفحات الويب ديناميكية وبديهية وتفاعلية. باستخدام جافا سكريبت، يمكنك تضمين رسوم متحركة يمكنها تحسين تجربة المستخدم.

في الوقت الحالي، Angular و React هما أشهر أُطر عمل جافا سكريبت للواجهة الأماميةوالتي تتيح لك تصميم واجهات مستخدم مبهجة للغاية.

تطوير الواجهة الخلفية (تطوير جانب الخادم)

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

عند اختيار حزمة تقنية، يكمن التحدي الأكبر في اختيار التقنيات الخلفية.

تُستخدم النهاية الخلفية بشكل أساسي لإنشاء منطق حول تطبيق الويب بالكامل باستخدام لغات البرمجة من جانب الخادم.

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

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

  • روبي (روبي على القضبان)
  • جافا سكريبت (NodeJS، MeteorJS، ExpressJS)
  • PHP (Laravel, CodeIgniter)
  • بايثون (جانغو، فلاسك)
  • سكالا (مسرحية)

قاعدة البيانات 

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

في الوقت الحالي، يطلب كل تطبيق ويب تقريبًا على الأقل تفاصيل الاتصال الخاصة بالمستخدمين. لذلك تعد قاعدة البيانات جزءًا حيويًا من كل حزمة التكنولوجيا لتطوير تطبيقات الويب.

هناك نوعان من تقنيات قواعد البيانات المفيدة في تطوير تطبيقات الويب: قاعدة البيانات العلائقية وقاعدة البيانات غير العلائقية.

بعض قواعد البيانات الأكثر شيوعًا لتطوير الويب هي:

  • MySQL 
  • PostgreSQL 
  • مونغودب MongoDB 

الخادم

الخادم هو المكان الذي يتم فيه تلقي الطلبات من كمبيوتر العميل ومعالجتها والتصرف بناءً عليها. لذلك، فإن حزمة التكنولوجيا لتطوير تطبيقات الويب يجب أن يكون لديك خادم لاستضافة التطبيق.

الخادمان الأكثر شيوعًا لتطبيقات الويب هما:

بالإضافة إلى ذلك، فإن تطوير الواجهة الخلفية لتطبيقات الويب يتطلب أيضًا من المطورين اختيار نظام تشغيل وأطر عمل خلفية لمشاريعهم.

العوامل التي يجب مراعاتها عند اختيار حزمة التكنولوجيا

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

أثناء اتخاذ قرار بشأن مكونات الحزمة التقنية، قم أيضًا بتحليل تطبيق الويب الخاص بك بناءً على المعايير المذكورة أدناه لتضييق نطاق الخيارات:

حجم المشروع

يمكن تصنيف جميع المشاريع حسب درجة تعقيدها، مما سيؤثر على اختيار حزمة التكنولوجيا. ومع ازدياد حجم المشروع، عادةً ما يزداد تعقيد المشروع أيضاً.

يمكنك تصنيف مشروعك بشكل عام وفقاً لهذه الفئات الثلاث:

المشروعات الصغيرة“ يمكن تنفيذ المواقع ذات الصفحة الواحدة والمحافظ والعروض التقديمية والمجلات الرقمية وغيرها من حلول الويب الصغيرة بمساعدة أدوات التصميم مثل ريديماج و ويب فلو. 

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

يجب عليك أيضًا التفكير في عمليات التكامل عبر الأنظمة الأساسية، حيث تتضمن المشاريع متوسطة الحجم عادةً أنظمة متعددة. على سبيل المثال، قد يكون هناك اتصال بين تطبيق ويب وأنظمة الواجهة الخلفية للشركة.

المشاريع الكبيرة تُعتبر الشبكات الاجتماعية والأسواق الاجتماعية مشاريع كبيرة، وقد تتطلب المزيد من قابلية التوسع والسرعة وقابلية الخدمة. أولاً، حدد الميزات التي تحتاج إلى تنفيذها. 

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

عادةً ما يتضمن هذا النوع من تطوير المشاريع مزيجًا معقدًا من الأدوات واللغات والتقنيات لبناء أجزاء فردية من التطبيق. ويتطلب اتخاذ قرار بشأن مكدس تقني لمشروع معقد النظر في كل من المتطلبات الوظيفية وغير الوظيفية.

وقت الوصول إلى السوق

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

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

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

قابلية التوسع

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

تتمتع React وNode.js وGolang وRuby on Rails بقابلية توسع ممتازة. سيتوسع تطبيقك أيضًا بشكل جيد على AWS، حيث إنه يستخدم تقنية شبكات إيثرنت المتقدمة المصممة للتوسع إلى جانب التوافر والأمان العاليين.

المزالق التي يجب تجنبها أثناء اختيار حزمة التكنولوجيا

ستساعدك الاستراتيجيات التالية على الاستعداد بشكل أفضل لتطوير الويب وتأكد من أنك لن تخسر ثروة على طول الطريق:

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

قم بإنشاء نموذج MVP أولاً ثم اختبره.ضع في اعتبارك أنه في بعض الحالات يمكن أن تكون الصفحة المقصودة بمثابة MVP ممتاز وغير مكلف. تأكّد من أن منتجك سيكون مطلوبًا وخذ بعين الاعتبار جميع الأخطاء التي تحدث أثناء الاختبار. عندها فقط يجب عليك تطوير حل كامل.

استخدم الحلول الجاهزة عندما يكون ذلك ممكناً.ضع في اعتبارك أنك لست مضطرًا إلى بناء جميع الميزات من الصفر، حيث قد توجد بالفعل حلول مماثلة في شكل مكتبات مبنية من قبل المجتمع أو تكاملات من طرف ثالث (التسجيل عبر Facebook أو Google، على سبيل المثال). يقدم Ruby on Rails العديد من المكتبات التي تسرّع تطوير تطبيقات الويب ومواقع الويب. ActiveAdmin هي واحدة منها. باستخدام ActiveAdmin، يمكن للمطورين تمكين وظائف إدارة المحتوى القوية لتطبيقات الويب الخاصة بهم.

وفِّر على حلول الاستضافة السحابية.نستخدم أمازون ويب سيرفيسز كخدمة أساسية لاستضافة مشاريع الويب التي ننشئها. تقدم AWS أسعاراً مرنة، حيث يتم تسعير كل خدمة حسب الطلب. وهذا يعني أنك تدفع فقط مقابل الخدمات التي تستخدمها. وهذا منطقي للغاية بالنسبة للبنية التحتية للخوادم، حيث لا يمكن التنبؤ بحركة المرور. 

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

خلاصة القول

في نهاية المطاف، لا توجد حلول عالمية لتطوير تطبيقات الويب. فكل تطبيق ويب يتطلب نهجًا فريدًا في إنشائه، بما في ذلك مجموعة تقنيات مخصصة.

اختر حزمة التكنولوجيا الخاصة بك بحكمة بناءً على تقييم دقيق لما يلي مواصفات مشروعك، وفريق المطورين الخاص بك، وميزانيتك وشروطك، بالإضافة إلى خبرتك ومهاراتك الشخصية. 

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

التحول الرقمي للشركات الصغيرة والمتوسطة

قم بزيادة إيراداتك الآن!

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

احجز استشارة مجانية لمدة 30 دقيقة

لا تدع منافسيك يتخلون عنك، استثمر في التحول الرقمي اليوم

الأسئلة الشائعة

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

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

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

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

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

بعيدًا بعيدًا، خلف جبال الكلمة، بعيدًا عن بلاد فوكاليا وكونسونانتيا، هناك تعيش النصوص العمياء. منفصلون يعيشون في Bookmarksgrove على الساحل مباشرةً

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

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

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

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

نعم، يمكن أن يكون التحول الرقمي مفيداً للشركات الصغيرة كما هو مفيد للشركات الكبيرة. في الواقع، يمكن أن يكون تطبيق التقنيات الرقمية في كثير من الأحيان أكثر تحويلاً للشركات الصغيرة والمتوسطة، حيث يمكن أن يساعدها على أن تصبح أكثر مرونة وتنافسية في أسواقها

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

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

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

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

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

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

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

نحن نتبع نهجاً يركز على العميل في التحول الرقمي، مما يعني أننا نعمل عن كثب مع عملائنا لفهم احتياجاتهم وتحدياتهم الفريدة. نحن نتمتع بفهم عميق للعوامل الثقافية والاقتصادية والتنظيمية التي يمكن أن تؤثر على التحول الرقمي في مختلف المناطق، ونقوم بتصميم خدماتنا وفقاً لذلك لضمان تحقيق عملائنا لأفضل النتائج الممكنة.

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

هل تحتاج إلى مساعدة في مشروعك؟

دع خبرائنا يرشدونك! املأ النموذج أدناه الآن للبدء.

حوّل رؤية مبيعاتك إلى واقع ملموس مع ChatGPT!

احصل على استراتيجية مبيعاتنا المثبتة بالذكاء الاصطناعي اليوم!

const toggle=document.getElementById("billingToggle"); toggle.addEventListener("click",function(){ this.classList.toggle("active"); const yearly=this.classList.contains("active"); document.querySelectorAll(".price").forEach(function(price){ const value=yearly?price.dataset.year:price.dataset.month; price.innerHTML="KES "+Number(value).toLocaleString(); }); document.querySelectorAll(".period").forEach(function(period){ period.innerHTML=yearly?"/year":"/month"; }); });