اذهب إلى المحتوى

كيفية تنصيب وإعداد Hugo، موّلد المواقع الإستاتيكية على أوبنتو


Safwan Alhaji

المقدّمة

يُعتبر Hugo موّلدًا للمواقع الإستاتيكية، يتميّز بسرعتِه وسهولةِ استخدامه، تمّت كتابته باستخدام لغة Go وهو متاح للعديد من الأنظمة. تُعد موّلدات المواقع الإستاتيكية خيارًا مثاليًا للمدوّنات والمحتويات الأخرى التي لا تتطلّب محتوًى ديناميكيًا يتم تحميله من قاعدة بيانات. تسمح لك أدات مثل Hugo بتبسيط مهامك، وبكتابة مستندات Markdown سهلة الاستخدام.

hugo-ubuntu.png

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

المتطلّبات المُسبقة

لإكمال خطوات هذا المقال، يجب أن يتوفّر لديك الوصول إلى خادوم Ubuntu 14.04. على هذا الخادوم، ستحتاج إلى مستخدم غير مستخدم Root مع صلاحيات sudo تمّت تهيئتها للقيام بمهامٍ إداريّة.

تنصيب آخر إصدار من Hugo

Hugo ليس متاحًا في مستودعات تخزين Ubuntu الافتراضية (Default Repositories)، إلّا إن هذه الحزم متاحة على GitHub للعديد من المعماريات والتوزيعات.

تحقّق من معمارية النظام

قبل أن نبدأ، يجب أن نتحقّق من معمارية خادوم Ubuntu لنتمكّن من تحميل الحزمة المناسبة. نفّذ الأمر التالي على خادومك:

$ uname –i

إذا ظهر التالي، هذا يعني أنّك تقوم بتشغيل إصدار64 بت من Ubuntu:

Output
X86_64

أمّا إذا ظهرَ التالي، هذا يعني أنّ إصدار الـ Ubuntu الخاص بك هو إصدار32 بت:

Output
i686

سنقوم باستخدام هذه المعلومات لاحقًا.

تحميل وتنصيب حزمة Hugo

قم بزيارة صفحة إصدارات Hugo لإيجاد آخر إصدار من Hugo (أعلى الصفحة). اذهب إلى قسم “Downloads”.

ثمّ بعد ذلك، يجب أن ننسخ رابط تنصيب الحزمة المناسبة. تعتمد الحزمة المناسبة على بُنية النظام التي تحقّقتَ منها أعلاه.

  • في حال استخدامك لإصدار 64 بت من Ubuntu، اضغط بالزر الأيمن على الرابط المنتهي بـ amd64.deb وانسخ موقع الرابط.
  • أمّا في حال استخدامك لإصدار 32 بت من Ubuntu، اضغط بالزر الأيمن على الرابط المنتهي بـ i386.deb وانسخ موقع الرابط.

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

$ cd ~
$ wget https://github.com/spf13/hugo/releases/download/v0.14/hugo_0.14_amd64.deb

يمكنك الآن تنصيب الحزمة باستخدام dpkg عن طريق كتابة التالي:

$ sudo dpkg -i hugo*.deb

تحقّق من نجاح التنصيب عن طريق تنفيذ أمر Hugo الذي سيقوم بطباعة إصدار البرنامج.

$ hugo version

يقوم هذا الأمر بطباعة إصدار Hugo الحالي.

Output
Hugo Static Site Generator v0.14 BuildDate: 2015-05-25T21:29:16-04:00

تنصيب برنامج دعم Hugo

أنهينا تنصيب Hugo، إلّا أنّ هنالك بضعة برامجيات صغيرة يجب علينا أن نُنصّبها لنتمكّن من تشغيل البرنامج بشكلٍ صحيح.

تنصيب القوالب Hugo Themes

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

يمكننا أن نجد git في مستودعات تخزين Ubuntu الافتراضية. قم بتحديث فهرس الحزم المحلّي ومن ثمّ تنصيب git بتنفيذ:

$ sudo apt-get update
$ sudo apt-get install git

ثمّ بعد ذلك، يمكننا نسخ مستودعات قوالب Hugo. تم تضمين كل قالب فردي كوحدة برمجيّة فرعيّة (submodule).

يفضل نسخ القوالب إلى المجلد الرئيسي home. يُمكننا بعد ذلك إنشاء رابط رمزي (Symbolic Link) لتلك القوالب ضمن مجلّد الموقع. ستسمح لنا هذه العمليّة بمشاركة القوالب بسهولة تامّة في حال امتلاكنا لعدّة مواقع.

انسخ مستودع القوالب إلى المجلّد الرئيسي عن طريق كتابة التالي:

$ git clone --recursive https://github.com/spf13/hugoThemes ~/themes

تنصيب برنامج تلوين النّصوص البرمجية Pygments Syntax Highlighter

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

يمكننا الحصول على pip من مستودعات التخزين الافتراضية بكتابة:

$ sudo apt-get install python-pip

حالما ينتهي الأمر apt، يمكننا استخدام pip لتنصيب Pygments عن طريق كتابة التالي:

$ sudo pip install Pygments

تفعيل خاصيّة الإكمال التلقائي الخاصة بـ Hugo على Bash

آخر إجراء يجب علينا القيام به قبل البدء بالعمل على موقعنا الأول، هو تفعيل خاصيّة الإكمال التلقائي الخاصة بـ Hugo على Bash. يتم ذلك بتنفيذ الأمر التالي:

$ sudo hugo genautocomplete

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

$ . /etc/bash_completion

إذا قمت الآن بكتابة hugo متبوعةً ببضعة ضغطات على مفتاح الجدولة TAB، ستتمكن من رؤية الأوامر المدعومة من قبل Hugo:

$ hugo [TAB][TAB][TAB]
Output
benchmark        config           genautocomplete  help             new              undraft
check            convert          gendoc           list             server           version

إنشاء موقعك الأوّل

بعدَ انتهائنا من تهيئة البرنامج، يمكننا المُضي قدمًا وإنشاء أول موقع لدينا. يحتوي Hugo على موّلدٍ قادرٍ على إنشاء هيكل من الملفّات والمجلّدات اللازمة لإنشاء الموقع.

يمكننا إنشاء موقعٍ جديد في المجلد الرئيسي عن طريق كتابة التالي: 

$ hugo new site ~/my-website

انتقل إلى المجلد الذي يحتوي موقعك الجديد لرؤية المزيد:

$ cd ~/my-website
$ ls -F

سترى بنية المجلد وملف الإعدادات الرئيسي المُستخدم لبناء موقع الـ Hugo.

الخرج:

archetypes/  config.toml  content/  data/  layouts/  public/  static/

لنقم بالربط على مجلد القوالب ~/themes من داخل موقعنا. ولتسهيل مهمة نقل الموقع لاحقًا، سنقوم بإعداد رابط رمزي نسبي.

 ls -l

total 28
drwxrwxr-x  2 demouser demouser 4096 Nov  5 11:25 archetypes
-rw-rw-r--  1 demouser demouser  210 Nov  5 11:55 config.toml
drwxrwxr-x  3 demouser demouser 4096 Nov  5 11:38 content
drwxrwxr-x  2 demouser demouser 4096 Nov  5 11:25 data
drwxrwxr-x  2 demouser demouser 4096 Nov  5 11:25 layouts
drwxrwxr-x 13 demouser demouser 4096 Nov  5 11:25 public
drwxrwxr-x  2 demouser demouser 4096 Nov  5 11:25 static
lrwxrwxrwx  1 demouser demouser    9 Nov  5 14:21 themes -> ../themes

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

التّحكم في الموقع باستخدام نظام إدارة الإصدارات Source Control

قبل الشّروع في إعداد الموقع وإنشاء المحتوى، يجب أن ندير موقعنا باستخدام git.

تأكّد من وجودِك في مجلّد الموقع وأنشئ مستودع git بكتابة التالي:

$ cd ~/my-website
$ git init

الخرج:

Initialized empty Git repository in /home/demouser/my-website/.git/

قُم بإعداد git (إن لم يسبق لك القيام بذلك) . الطريقة الأسهل للقيام بذلك هي عن طريق الأمر git config –global يجب عليك أن تُحدّد اسمك وعنوان البريد الإلكتروني الخاص بك، حتى تتمكّن git من تخزين معلوماتنا في الإيداعات commit بشكل صحيح.

$ git config --global user.name "yourName"
$ git config --global user.email "user@email.com"

بشكلٍ افتراضي، لن تضيف git أيّ مجلداتٍ فارغة إلى المستودع. في بعضِ الأوقات، يتطلّب Hugo أن تكون تلك المجلّدات موجودة حتى في حال خليّها من الملفات. يمكننا تضمين ملف .gitkeep مخفي في كلِّ من هذه المجلّدات لحل هذا المُشكل.

يمكننا إضافة ملف .gitkeep مخفي لكلِّ من مجلّدات المستوى الأعلى (غير مجلّد .git المخفي أصلًا) بكتابة التالي:

$ for DIR in `ls -p | grep /`; do touch ${DIR}.gitkeep; done

نلاحظ إضافة الملف المخفي .gitkeep لكلٍّ من مجلّدات المستوى الأعلى عن طريق كتابة ما يلي:

$ find . -name .gitkeep

الخرج:

./data/.gitkeep
./layouts/.gitkeep
./archetypes/.gitkeep
./static/.gitkeep
./content/.gitkeep

احرص أيضًا أن لا يتم إيداع الملفات التي تم توليدها (ملفات HTML، JavaScript و CSS) إلى المُستودع. يجب أن يتم توليد هذه الملفات بعد كل عملية نشر للموقع. يمكننا أن نطلب من git تجاهل المجلّد العام public حيث يتم تخزين المحتوى المُوّلد عن طريق إضافته إلى ملفّ .gitignore كالتالي:

$ echo "public" >> .gitignore

يمكننا الآن إيداع هيكل موقعنا لمستودع التخزين، وذلك بإضافة كلّ المحتوى للمجلّد الحالي ومن ثمّ الإيداع (commit).

$ git add .
$ git commit -m 'Initial commit, pre-configuration.'

ضبط الإعدادات الأوليّة للموقع

لنقم الآن بضبط ملف إعدادات Hugo الرئيسي لتحديد كيفية بناء Hugo لموقعنا.
قم بفتح الملف config.toml في محرّرك:

$ nano config.toml

سترى في داخله بضعة أسطر بحاجة إلى الضبط:

~/my-website/config.toml
baseurl = "http://replace-this-with-your-hugo-site.com/"
languageCode = "en-us"
title = "My New Hugo Site"

السطر الأول الواجب تغييره هو سطر الـ baseurl. يُستخدم هذا السطر لبناء عناوين URL عند بناء الموقع. قم بتغيير ذلك السطر إلى اسم نطاق خاص بك أو عنوان الـ IP العام الخاص بخادومك. ينبغي عليك أيضًا أن تُعدّل القيمة المُسندة لسطر العنوان title. يُستخدم هذا السطر لتحديد عناوين صفحات موقعك.

~/my-website/config.toml
baseurl = "http://your_domain_or_IP/"
languageCode = "en-us"
title = "Your Site Name"

هنالك بضعة إعداداتٍ إضافيّة يجب علينا تعديلها في هذا الملف. أولاً، يمكننا ضبط محرّر النصوص المفضّل لدينا؛ يتم بهذه الطريقة عند توليد صفحاتٍ جديدة فتح نموذج الصفحة في محرّرنا.

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

~/my-website/config.toml
baseurl = "http://your_domain_or_IP/"
languageCode = "en-us"
title = "Your Site Name"
newContentEditor = "nano"
theme = "nofancy"
pygmentsStyle = "native"

يمكنك التعرّف على معلوماتٍ أخرى حول الإعدادات المتاحة في هذه الصفحة، قم بحفظ وإغلاق الملف.

لنقم بإيداع تعديلات التهيئة قبل أن نستمر بإنشاء الموقع:

$ git add .
$ git commit -m 'Initial configuration complete'

خاتمة:

تعرفنا في هذا المقال على كيفية تنصيب وإعداد Hugo. في المقال القادم سنستعرض كيفية إضافة صفحات ومُحتويات إلى الموقع.

ترجمة -وبتصرّف- للمقال How to Install and Use Hugo, a Static Site Generator, on Ubuntu 14.04 لصاحبه Justin Ellingwood


تفاعل الأعضاء

أفضل التعليقات

لا توجد أية تعليقات بعد



انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أضف تعليق

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • أضف...