انتقل إلى المحتوى

إنشاء مستودع المعرفة الشخصي - باستخدام Docusaurus

في هذا المقال، سنواصل شرح بناء مستودع المعرفة باستخدام إطار العمل Docusaurus، استنادًا إلى المقالة السابقة لماذا تحتاج إلى مستودع معرفة؟.

قبل بدء هذا المقال، يُرجى التأكد من جاهزيتك بالنقاط التالية:

  • الوصول إلى الإنترنت بحرية
  • القدرة على التكيف بشكل عشوائي
  • معرفة أساسية باللغة الإنجليزية

تكوين البيئة المحلية

تثبيت Node.js

انتقل إلى موقع Node.js الرسمي ، وقم بتنزيل وتثبيت Node.js.

تثبيت وتكوين VS Code

سنستخدم VS Code كمحرر محلي لتعديل الإطار الخاص بالموقع وكتابة المقالات.

أولاً، انتقل إلى موقع VS Code الرسمي وقم بتنزيل وتثبيت VS Code.

بعد اكتمال عملية التثبيت، يمكننا تثبيت المكملات التاليتين:

بعد تثبيت المكملات، قد تحتاج إلى إعادة تشغيل VS Code وفقًا للإرشادات المعروضة.

يمكن العثور على تعليمات تفصيلية حول التكوين في دليل إنتاجية VS Code - تكوين البيئة هذا المقال.

تثبيت إطار Docusaurus

انتقل إلى الدليل الذي ترغب في إنشاء مشروع الموقع فيه.

على سبيل المثال، إذا كنت ترغب في إنشاء مشروع معرفة بالاسم "wiki" في محرك الأقراص D على جهاز الكمبيوتر الخاص بك، فقم بالانتقال إلى VS Code واختيار "ملف" - "فتح مجلد"، ثم قم بالنقر فوق D واختيار المجلد "wiki".

استخدم الأمر npx لتهيئة الموقع:

npx @docusaurus/init@latest init [name] [template]

على سبيل المثال، إذا كان اسم مجلد مشروع موقعك "wiki"، قم بتبديل "[name]" بهذا الاسم. ووفقًا للمستندات الرسمية هنا، "[template]" هو قالب موقع الويب. يمكنك ببساطة استبداله بـ "classic" هنا. لذا، الأمر الذي سنقوم بتنفيذه هو:

npx @docusaurus/init@latest init wiki classic

استخدم اختصارات لوحة المفاتيح "Ctrl" + ` في VS Code لفتح الوحدة الطرفية والصق الأمر أعلاه واضغط على "إدخال"، وانتظر حتى اكتمال التحميل.

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

cd [name]

استبدل "[name]" بالاسم الذي تمثله مجلد مشروع الموقع الخاص بك. على سبيل المثال، إذا كنت استخدمت "wiki" في الخطوة السابقة.

ثم، قم بتنفيذ الأمر التالي:

npm run start

هذا الأمر يقوم بنشر الموقع محليًا. انتظر حتى انتهاء عملية النشر، وسيتم فتح صف

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

التسجيل في حساب GitHub

الرجاء التسجيل في حساب GitHub على الموقع الرسمي لـ GitHub.

تثبيت Git

قم بتنزيل برنامج Git من الموقع الرسمي لـ Git وقم بتثبيته.

أعد تشغيل VS Code، وافتح الطرفية ثم قم بلصق الأمر التالي لتهيئة Git:

git config --global user.name "اسم المستخدم"
git config --global user.email "البريد الإلكتروني@example.com"

يجب استبدال "اسم المستخدم" هنا بالاسم الذي ستستخدمه في القراءة، ويُفضل أن يكون مطابقًا لاسم الحساب الذي قمت بتسجيله في GitHub، على سبيل المثال، يمكنني استبداله بـ linyuxuanlin. نفس الأمر ينطبق على "البريد الإلكتروني@example.com" حيث يجب استبداله بعنوان البريد الإلكتروني الذي استخدمته أثناء التسجيل في GitHub.

لمزيد من التفاصيل حول التكوين، يمكنك الرجوع إلى مذكرات تعلم Git هذه.

تكوين مستودع المشروع داخل VS Code

لتمكين الرفع إلى خادم GitHub في الخطوة التالية، يجب عليك تكوين مستودع Git داخل VS Code ورفعه إلى GitHub.

استخدم اختصارات لوحة المفاتيح Ctrl + Shift + G داخل VS Code للتبديل إلى واجهة إدارة الشيفرة المصدرية، ثم قم بتهيئة مستودع Git للمشروع وقم بإجراء الالتزام الأول.

ثم، استخدم اختصارات لوحة المفاتيح Ctrl + Alt + S لرفع مستودع Git المحلي إلى GitHub (سيُطلب منك تسجيل الدخول إلى حساب GitHub كما هو مطلوب).

استخدام خدمة Vercel لنشر الموقع على السحابة

تقوم خدمة Vercel بتوفير وظائف مشابهة لخدمة GitHub Action + GitHub Pages، وهي توفر نظامًا لنشر مستمر تلقائي وعرض مواقع الويب الثابتة. تم اختيار Vercel بسبب سرعة الوصول من داخل الصين بالمقارنة مع GitHub Pages.

أولًا، قم بزيارة صفحة تسجيل الدخول إلى GitHub على Vercel مباشرة وقم بالتسجيل في Vercel باستخدام حساب GitHub.

بمجرد الانتهاء من التسجيل، انقر على New Project واستيراد مستودع GitHub المناسب (على سبيل المثال، المستودع "wiki" الذي قمت بإنشائه مسبقًا). قد تحتاج إلى تسجيل الدخول إلى GitHub مرة أخرى وفقًا للإرشادات. بعد الاستيراد، انقر على Next وستتم عملية نشر الموقع بسرعة.

التلخيص

تم في هذه المقالة نشر مكتبة المعرفة التي تعتمد على Docusaurus محليًا وعلى السحابة. إذا واجهت أي مشكلة خلال هذا العملية، يمكنك الاتصال بي عبر WeChat. في المقالة القادمة (قادمة للتحديث)، سأقدم شرحًا مفصلًا لتكوين الخصائص الشخصية.

المراجع والشكر

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