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

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

الفكرة

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

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

لذلك، قررت إنشاء مدونة جديدة، مكان جديد، أكتب فيه دون أن يتوقع القارئ نوع معين من التدوينات.

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

التصميم

الاسم

بعد تفكير... أخترت اسم مشخبط، وتحققت من نتائج البحث، وتوفر الدومين "domain"، وأجل جميل لم أتوقع هذا ولكن لم يستخدم أحد هذا الاسم من قبل أو على الأقل نقحرته "mushkhbat".

الشعار

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

وبعد بضعة نماذج أخترت الشعار الحالي...

شعار مشخبط الحالي.
شعار مشخبط الحالي.

التنفيذ

شكل الموقع

أنا مبرمج مواقع، وملم في مجال تصميم الواجهات، وبالطبع سأصمم مدونتي بنفسي.

حسنًا ما هي المدونة؟ بحسب ويكيبيديا "المدوَّنة موقع إلكتروني يجمع عدد من التدوينات وهي بمثابة مفكرة أو ساحة طرح آراء شخصية."

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

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

وشخصيًا قررت استخدام نظام تصميم بسيط جدًا وهو focus

نظام تصميم focus
نظام تصميم focus

فقد استلهمت نظام الألوان (color palette) والمساحات (spacing) منه.

صورة من مدونة مشخبط
صورة من مدونة مشخبط

إدارة المحتوى

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

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

هنا تأتي مشكلة، حين تبني مدونة دون نظام إدارة محتوى (CMS) وردبريس مثلًا أو على بلوجر... عليك إدارتها بنفسك.

يمكننا تلخيص عملية إدارة المحتوى في عدة نقاط وهي:

  1. حفظ المحتوى، وتسهيل عملية إضافة المحتوى
  2. الرجوع للمحتوى وإمكانية تحديثه وتحريره
  3. فرز وتصنيف المحتوى، وجلبه

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

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

على خلاف أنظمة إدارة المحتوى (CMS) الأخرى التي قد تُجبرك على تصميم قالب بطريقة مُعينة مثلًا، يعطيك Astro أريحية في استخدام أي شيء تستطيع حتى استخدام HTML عادية لو أردت، لا مشكلة.

وكنقطة إضافية لـ Astro هو يسمح لك بتصدير الموقع كملفات HTML ثابتة، هناك العديد من البرمجيات التي تستخدم نفس المفهوم مثل hugo و jekyll أو gatsby وغيرها... لكن ما يميز Astro أنه لا يحصرك في مساحة معينة... تستطيع البدأ في استخدامه دون تعلم شيء جديد، طالما كنت تجيد بعض من HTML وبعضًا من JavaScript! عكس تلك البقية التي قد تحتاج فيها إلى تعلم بعض الأمور لإدارة القالب وطريقة عرض المحتوى.

إدارة المحتوى في مشخبط

أعتمدت على مفهوم شائع ومشهور وهو flat-file و git integration كمبرمج أنت معتاد على هذا المفهوم، حتى لو لم تكن مبرمجًا تستطيع الإستغناء عن git integration لا مشكلة، وستتعامل مع ملفات عادية ببساطة.

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

  1. تكتب
  2. فيها
  3. عدة نقاط
  4. متسلسلة

وهذا النص-الغني ببساطة.

لذلك أسهل طريقة لكتابة نص غني في ملف عادي، هي استخدام مارك-دون Markdown.

في مشخبط قررت استخدام MDX-JS وهو امتداد لـماركدون لكنه محسن ويدعم إضافة مكونات مخصصة فيه.

نشر المدونة واستضافتها

حسنًا، هذه النقطة التي جعلتني لا استخدام وردبريس أو خدمات Headless-CMS وغيرها... ﻷنك تحتاج إلى استضافتها في خادم! والخادم مكلف... أو على الأقل الخوادم الجيدة مكلفة وتحتاج إلى إدارة أحيانًا... لذلك قررت الإعتماد على مفهوم JAMStack و Static Site Generator. حيث يمكن لك استخدام استضافات المواقع الثابتة لتنشر فيها موقعك، بشكل مجاني!

مشخبط اﻵن مستضاف على Pages من كلاودفلاير، الخطة المجانية.

تستطيع زيارة مدونة مشخبط عبر الرابط الآتي: www.mushkhbat.com