أهم موديولات Nuxt التي نستخدمها في "مرتكز"
الحمد لله الذي علَّم بالقلم، علَّم الإنسان ما لم يعلم، والصلاة والسلام على خير معلِّم الناس الخير سيدنا محمد - صلَّى الله عليه وسلم … أما بعد ،،
في رحلة بناء "مرتكز"، كان علينا اتخاذ عشرات القرارات الصغيرة التي تصنع في مجموعها تجربة كبيرة؛ من سرعة المنصة، إلى استقرارها، إلى سهولة التطوير خلف الكواليس.
أحد أهم هذه القرارات كان اختيار الموديولات المناسبة داخل Nuxt، فهي تضيف طبقات جاهزة من الوظائف دون إعادة اختراع العجلة، وتمنح الفريق مساحة للتركيز على ما يهم فعلاً وهو بناء منتج عربي قوي، قابل للنمو، ويقدم تجربة سلسة للمستخدم.
في هذا المقال نشارك أبرز الموديولات التي اعتمدنا عليها، وكيف ساعد كل منها في جانب محدد من المنصة.
موديول Vuetify Nuxt
يوفر هذا الموديول واجهة جاهزة مبنية على Vuetify داخل Nuxt، مما يسهل تصميم الصفحات والعناصر ويقدم دعم ممتاز للغة العربية واتجاه الكتابة من اليمين إلى اليسار.
اخترناه لأنه ساعدنا على بناء شكل المنصة بسرعة وبمظهر متناسق، ووفر علينا الكثير من الوقت الذي يُستهلك عادة في تصميم المكونات الأساسية وتنسيقها.
للتوثيق الرسمي للموديول أضغط هنا
كما يمكنك الرجوع إلي مقالي السابق بعنوان (أنسب مكتبة UI يمكنك استخدامها مع Nuxt) لمزيد من التفاصيل حول مكتبة Vuetify ولماذا أفضل دائما استخدامها دونا عن باقي المكتبات الأخري.
موديول nuxt-auth-utils
يوفر هذا الموديول طريقة بسيطة لإدارة تسجيل الدخول وحماية الصفحات داخل Nuxt، ويتعامل بسهولة مع تسجيل الدخول عبر جوجل وGitHub وLinkedIn.
اخترناه لأنه سهل علينا بناء نظام مصادقة واضح ومستقر دون كتابة منطق معقد، ولأنه يضمن دخول آمن للمستخدمين مع الحفاظ على تجربة سلسة في المنصة.
توجد في هذه الموديول ميزة قوية (Custom OAuth Provider) تساعدك علي التكامل مع أي مزود بأسلوب بسيط، وقد ساعدتنا هذه الميزة كثيرا عند تفعيل خاصية تسجيل الدخول بواسطة منصة "قبيلة"
للتوثيق الرسمي للموديول أضغط هنا
موديول nuxt-umami
يسهل هذا الموديول ربط منصة "مرتكز" بخدمة Umami للحصول على إحصاءات واضحة وخفيفة دون التأثير على سرعة الموقع.
اخترناه لأنه يحترم خصوصية المستخدمين ولا يعتمد على التتبع المزعج، ومع ذلك يزودنا ببيانات دقيقة تساعدنا على فهم استخدام المنصة وتطويرها دون الإخلال بقيمها الأساسية.
يمكن الرجوع إلي مقالي السابق بعنوان (كيف أتابع احصائيات الزوار في مدونتي) لمزيد من التفاصيل حول الأداة Umami حيث أتناول أهم مزاياها، وشرح طريقة دمجها بسهولة مع Nuxt.
للتوثيق الرسمي للموديول أضغط هنا
موديول nuxt-mongoose
يساعد هذا الموديول على ربط Nuxt بقاعدة بيانات MongoDB بسهولة، ويجعل التعامل مع البيانات أكثر تنظيماً دون إعدادات معقدة.
اخترناه لأنه سرّع بناء نماذج المشاريع والمستخدمين والتصويت، ووفر طريقة واضحة لكتابة الـ API، مما اختصر وقتاً كبيراً في تطوير جزء الخلفي (Back-End) من المنصة.
للتوثيق الرسمي للموديول أضغط هنا
موديول dayjs-nuxt
يُسهل هذا الموديول التعامل مع التواريخ داخل المشروع باستخدام مكتبة Day.js، سواء في العرض أو التنسيق أو الحسابات البسيطة.
اخترناه لأن "مرتكز" يعتمد على التواريخ في العديد من الصفحات، وقد قدم لنا طريقة خفيفة وواضحة للتعامل معها دون زيادة في حجم المشروع أو تعقيد في الكود.
للتوثيق الرسمي للموديول أضغط هنا
موديول nuxtjs/google-fonts
يُسهل هذا الموديول إضافة الخطوط من Google Fonts مباشرة إلى مشروع Nuxt بشكل منظم وسريع، مع تحسينات تلقائية للأداء.
اخترناه لجلب خط عربي يمنح الواجهة وضوحا وشخصية مميزة، ولأنه يوفر طريقة أفضل وأكثر استقرارا من تحميل الخطوط يدويا.
للتوثيق الرسمي للموديول أضغط هنا
موديول nuxt-api-shield
يوفر هذا الموديول طبقة حماية جاهزة لمسارات الـ API، تساعد على الحد من الطلبات الزائدة ومنع محاولات الاستخدام غير الطبيعي.
اخترناه بعد ازدياد التفاعل على المنصة، لأنه يقدم حلا بسيطا وفعّالا يحسن أمان "مرتكز" دون الحاجة لبناء نظام حماية معقد من الصفر.
للتوثيق الرسمي للموديول أضغط هنا
موديول nuxt-tiptap-editor
يوفر هذا الموديول محرر نصوص مريح وسهل الاستخدام داخل Nuxt، يسمح بكتابة محتوى منسق دون الحاجة إلى أدوات معقدة.
اخترناه ليتمكن أصحاب المشاريع من نشر تحديثاتهم بسهولة وبمظهر واضح، ولأنه يمنحنا تحكم جيد في النصوص والصور، مما ساعد على تحسين جودة المحتوى المنشور.
للتوثيق الرسمي للموديول أضغط هنا
خاتمة
لقد كشف لنا العمل على "مرتكز" أن اختيار الموديولات المناسبة في Nuxt ليس تفضيلا تقنيا، بل خطوة أساسية في بناء منتج قوي وقابل للنمو.
ساعدتنا هذه الأدوات في تسريع التطوير، وتقليل الأخطاء، وتحقيق توازن واضح بين الأداء والمرونة.
زائر مدونتي الكريم، وفقني الله وإياك إلى ما يحبه ويرضاه ،،