Laravel By Categories Ads

موقع لعرض اﻹعلانات المبوبة -مثل Opensooq- وفقا لتصانيفها، برمجته عبر Laravel Framework. هنا سوف تجد تفاصيل حول البنية العامة لتطبيق الويب هذا وكذلك بعض تفاصيل الـ Config وشرحا للأكواد المهمة، لقطات من الموقع:

تتطلب عرض الشرائح هذه للجافا سكريبت.

1. بدايةً؛ بالنسبة للـ Front-end فهو جاهز من موقع Start Bootstrap ولم أقم بكتابته وقمت بالتعديل عليه وفقًا لما تقتضيه الحاجة، أردت التركيز على جزئية الـ Back-end.
 
2. بالنسبة لنظام قواعد البيانات فقد استعملت PostgreSQL DBMS مع استعمال برنامج LibreOffice Base كـ Interface للتواصل رسوميًا مع قاعدة البيانات وإجراء عمليات الـ DDL والـ DML عوضا عن استعمال سطر اﻷوامر. لقد كتبتُ مقالة سابقة حول كيفية ضبط وتنصيب PostgreSQL على لينوكس وربطها مع ليبر أوفيس على الرابط التالي:
 
 
3. بالنسبة لنظام كتابة الاستعلامات فلقد استعملت Elqount Model وهو موديل أفضل وأكثر تقدما من الطريقة التقليدية للتعامل مع استعلامات SQL. 
 
4. قمت بتصميم العرض المفاهيمي للجداول عبر موقع https://www.dbdesigner.net  
 
5
 
5. اﻵن إعدادات قاعدة البيانات، فقد كانت في ملف .env على النحو التالي:
 
6.png
 
6. احتجتُ في بادئ اﻷمر لتوليد بيانات تجريبية عبر المكتبة Faker وذلك لاختبار عرض البيانات، الكود التالي هو مثال على توليد بيانات عشوائية لجدول البوستات:
 
7
 
*عند اختبار عمل SELECT للجدول posts نلاحظ التالي حيث قد تم توليد بيانات تجريبية:
 
8
 
7. طريقة تنظيمي لهرميّة العروض (Views) كانت على النحو التالي:
 
– المجلد front: يحتوي على الصفحات التي تظهر للمستخدم وبداخله layouts داخلها ملف Master Page حتى تقوم الصفحات اﻷخرى بعمل وراثة extends للهيدر والفووتر المشتركيّن بين جميع الصفحات لمنع تكرار الكود؛ كذلك هنالك لدينا الصفحة الرئيسية index لعرض أحدث المنتجات المضافة والصفحة details لعرض تفاصيل المنتج الواحد والصفحة byCategory لعرض المنتجات حسب التنصيف المختار وأخيرا addPost ﻹضافة منتج جديد.
– المجلد back: يحتوي على الـ Dashboard التي لا تعرض إلا للمدراء؛ ولم أقم بتصميمها حتى اﻵن هي والدوكيومنتيشن.
 
9
 
8. قمتُ بتخزين مجلد الصور images في المجلد public (يتم تخزين مسارات الصور في الجدول image على أن تؤشّر على الصورة المطلوبة المتواجدة في المجلد images)، بالنسبة لملفات التصميم CSS وJS فهي مخزنة على public كذلك.
 
10
 
9. في بعض اﻹعلانات (التي لا تمتلك صور) قمت بتعيين صورة افتراضية تلقائية وذلك باستخدام الخاصية Onerorr متبوعة بمسار الصورة الافتراضية المطلوبة:
 
11
 
10. ملف الـ Web:
 
12
 
11. ملف الـ HomePageContoller:
 
13
 
12. ملف الـ PostContoller:
 
14
13. الـ Model المسمى Post:
 
15
 
14.ملف الـ LoginContoller:
 
16
 
15. ملف AppServiceProvider:
 
17
 
16. هذا الكود في صفحة front/master.blade.php مختص بعرض اسم المستخدم في الـ navbar، إذا كان المستخدم مسجلًا دخوله فسيظهر اسمه ومن أسفله تسجيل خروج، عدا عن ذلك سوف يظهر زرّ تسجيل الدخول\تسجيل:
 
18

اترك رد

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

شعار وردبرس.كوم

أنت تعلق بإستخدام حساب WordPress.com. تسجيل خروج   /  تغيير )

Google photo

أنت تعلق بإستخدام حساب Google. تسجيل خروج   /  تغيير )

صورة تويتر

أنت تعلق بإستخدام حساب Twitter. تسجيل خروج   /  تغيير )

Facebook photo

أنت تعلق بإستخدام حساب Facebook. تسجيل خروج   /  تغيير )

Connecting to %s