11

كيف تتعامل مع تكرار العناصر أثناء تطوير الويب

السلام عليكم ورحمة الله وبركاته

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

<div class="single_news" id="news_44">
      <div class="news_title">AAAAAAAAAA</div>
      <div class="news_cat">BBBBBBBB</div>
      <div class="news_date">19-3-2014</div>
</div>

تحتاج هذا الكود فى صفحة عرض الأخبار و كذلك عرض نتائج البحث و غيرها و تضعه بين قوسى (loop) لتفرد عليه معلومات مختلفه فى كل مره

هل تقوم بإعادة تكرار الكود كل مره تحتاج إليه ؟

هل تقوم بكتابته فى قالب خاص , ثم تستدعى القالب و تمرر له مصفوفه بيانات تنتجه بالشكل المطلوب ؟

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

للنقاش و الفائده لمن لا يعرف

يرجى الدخول لحسابك أو تسجيل حساب لتستطيع إضافة تعليق
حساب جديد دخول

التعليقات

16

و عليكم السلام و رحمة الله و بركاته

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

في Ruby on Rails اسم الطريقة لحل ما طرحته هو partial rendering في [1]، طريقة عملها كالتالي:

افرض في الـ controller تستدعي كل المواضيع، تكتب

@topics = Topic.all

بمعنى اجلب كل المواضيع في جدول Topicو ضعها في متغير اسمه @topics. هذا السطر الوحيد الذي تحتاجه في الـ controller، في الـ View تكتب

<%= render @topics %>

بكتابتك هذا السطر، Ruby On Rails ستقوم بإيجاد مفرد كلمة topics و هي topic و ستبحث عن ملف اسمه _topic.html.erb، هذا الملف تقوم أنت بكتابته و توضح لـ Ruby on Rails بكيفية عرض المواضيع، كمثال،

<div class="single_news" id="<%= topic.id %>">
      <div class="news_title"><%= topic.title %></div>
      <div class="news_cat"><%= topic.category %></div>
      <div class="news_date"><%= topic.date %></div>
</div>

فقط، و الآن كل مرة تريد عرض المواضيع، اكتب في view

    <%= render @topics %>

و سيتم عرض المواضيع بنفس الشكل في أي مكان تستخدم فيه هذا الامر. و تستطيع إرسال متغيرات أيضا باستخدام locals، مثلا:

<%= render @topics, locals: { name: "Arabia I/O" } %>

و تتعامل معاه كمتغير في ملف _topic.html.erb

نفس الشئ تستطيع تطبيقه في django و اسمه inclusion tags و تستطيع القراءة عنه في [2].

[1]

[1]

بالنسبة لي فأنا أقوم بهذه الطريقة في ووردبريس أيضا

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

وأستدعي الملف كل مرة داخل الملفات المطلوبة، كما أختصر الأمر وأجمع أكثر من ملف في مكان واحد، مثلا ملف tag - category - search - date - archive

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

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

بمعنى تكون لدي دالة داخل ملف functions تحتوي داخلها على كود loop ومع تلك الدالة تأتي مجموعة من الإعدادات التي ستتغير في الملف بدل أن يكون ثابت، وعندما أطلب الدالة فأنا أضع الاعدادات المرادة، مثلا

get_the_loop('date', 'nodate', ..);

فى كود إجنيتر أقوم بكتابته كالآتى :

  $data = array("items"=>$items);
  $items_view = $this->load->view("templates/items/single_item",$data,TRUE);

يحتوى ملف single_items على foreach loop لإظهار العناصر

إذا كنت أضيف عنصر عبر أجاكس مثلاً و رغبت فى ظهوره بعد عملية الإضافة

بعد الإضافة إلى قاعدة البيانات أستعلم عن العنصر المضاف ليأتى ك Object ثم أرسله فى مصفوفة ليتم قبوله فى foreach

  $data = array("items"=> array($single_item) );
  $single_item_view = $this->load->view("templates/parts/single_item",$data,TRUE);

الحلقات التكرارية جزء أساسي من أغلب أنظمة القوالب حتى القوالب المصغرة عن سبق إصرار وترصد تحتوي حلقات تكرار انظر

وذكرتها في مقالتي

<ul>
{{#items}}
    <li><strong>{{name}}</strong></li>
{{/items}}
</ul>

أعتقد أن هذا المشكل تم حله منذ القدم من طرق نظام القوالب

عن نفسي غالباً ما استخدم قوالب سمارتي وال loop يكون داخل القالب يعني في ملف البي اتش بي تكون السطور على هذا النحو :

$news_arr = array();

$smarty->assign('news_array',$news_arr);

وداخل القالب يكون بالشكل

{section name=foo loop=$news_array} {$news_array[foo].title} {/section}

وهكذا :)

عن نفسي غالباً ما استخدم قوالب سمارتي وال loop يكون داخل القالب يعني في ملف البي اتش بي تكون السطور على هذا النحو :

$news_arr = array();
$smarty->assign('news_array',$news_arr);

وداخل القالب يكون بالشكل {section name=foo loop=$news_array} {$news_array[foo].title} {/section}

وهكذا :)

شي بديهي وإلا الامر سيصبح متعب، لذلك في الوردبرس اتى ما يعرف بالـ Widget وكذلك ال Sidebar ممكن يندرج تحت هذا الموضوع.

اعتقد أنك تتكلم عن شيء آخر تماما وهو محتوى ثابت في كل أنحاء الموقع،

لكن نحن نتكلم عن محتوى ديناميكي يتغير على حسب مفهوم الصفحة