كيفية تثبيت Gatsby على Ubuntu 20.04

في هذه المقالة ، سنشرح كيفية تثبيت Gatsby على Ubuntu 20.04.

Gatsby هو إطار عمل مفتوح المصدر قائم على React لإنشاء مواقع الويب والتطبيقات. إنه لأمر رائع سواء كنت تنشئ موقعًا أو مدونة ، أو متجرًا للتجارة الإلكترونية أو الصفحة الرئيسية للشركة. أنشئ مواقع ويب وتطبيقات فائقة السرعة واستغل قوة 2000+ من المكونات الإضافية. أنشئ مواقع بالخدمات التي تريدها ، مثل Shopify و Stripe و WordPress ، بسرعة وسهولة باستخدام مكونات Gatsby's 2000+. ادمج البيانات من أي مكان: واجهات برمجة التطبيقات أو قواعد البيانات أو أنظمة إدارة المحتوى أو الملفات الثابتة - أو مصادر متعددة في وقت واحد

ستوجهك هذه المقالة في عملية التثبيت ونشر موقع Gatsby الافتراضي للمبتدئين.

المتطلبات الأساسية

• خادم مخصص مثبت على Ubuntu 20.04 أو KVM VPS.
• مستخدم جذر أو مستخدم عادي له امتيازات مسؤول sudo.

قم بتثبيت Gatsby على Ubuntu 20.04

الخطوة 1 - حافظ على الخادم محدثًا

# apt update -y && apt upgrade -y

الخطوة الثانية - تثبيت NodeJS و NPM

قم بتثبيت أحدث إصدار مستقر من NodeJS.

# curl -sL https://deb.nodesource.com/setup_15.x | sudo -E bash -

# apt-get install -y nodejs

تحقق من نجاح التثبيت.

# node -v && npm -v

انتاج:

v15.9.0
7.5.4

الخطوة 3 - تثبيت gatsby-cli

يتم حزم Gatsby CLI ( gatsby-cli ) كملف تنفيذي يمكن استخدامه عالميًا. يتوفر Gatsby CLI عبر npm . قم بتشغيل الأمر التالي لتثبيت gatsby-cli :

# npm install -g gatsby-cli

تحقق من التثبيت:

# gatsby --version

انتاج:

# Gatsby CLI version: 2.19.1

الخطوة 4 - نشر موقع جديد

لإنشاء موقع Gatsby جديد ، قم بتشغيل الأمر التالي:

# gatsby new

انتاج:

create-gatsby version 0.5.1

Welcome to Gatsby!

This command will generate a new Gatsby site for you in /root with the setup you select. Let’s answer some
questions:

What would you like to call your site?
· My Gatsby Site

سيشغل CLI قذيفة تفاعلية تطلب هذه الخيارات قبل إنشاء موقع Gatsby لك. اختر واملأ حسب متطلبات موقع الويب الخاص بك. سيقوم بإنشاء موقع Gatsby ودليل في / root .

شاهد جميع الأوامر على https://www.gatsbyjs.com/docs/gatsby-cli/

إنشاء موقع من بداية

لإنشاء موقع Gatsby يسمى my-awesome-site باستخدام المبدئ الافتراضي ، قم بتشغيل الأمر التالي:

# gatsby new my-awesome-site

سيقوم الأمر أعلاه بإنشاء دليل my-awesome-site في / root .

راجع مستندات Gatsby للمبتدئين للحصول على مزيد من التفاصيل.

طور

بمجرد تثبيت موقع Gatsby ، انتقل إلى الدليل الجذر لمشروعك وابدأ خادم التطوير باستخدام الأمر التالي:

# cd my-awesome-site

# gatsby develop -H 0.0.0.0

خيارات:

• -H ، - المضيف تعيين المضيف. افتراضات إلى المضيف المحلي
• -p ، منفذ تعيين المنفذ. الافتراضيات إلى env.PORT أو 8000
• -o، - افتح الموقع في المتصفح (الافتراضي) لك
• -S ، --https استخدم HTTPS

يمكنك الآن عرض موقعي الرائع في المتصفح.

Local: http://localhost:8000/
On Your Network: http://192.168.0.102:8000/

يبني

في جذر موقع Gatsby ، قم بتجميع التطبيق الخاص بك وجعله جاهزًا للنشر:

# gatsby build

خيارات

• --prefix-paths إنشاء موقع بمسارات ارتباط مسبوقة (قم بتعيين pathPrefix في التكوين الخاص بك)
• - no-uglify قم ببناء موقع بدون تقويض حزم JS (لتصحيح الأخطاء)
• - الملف الشخصي بناء موقع مع التنميط رد الفعل. انظر تحديد أداء الموقع باستخدام React Profiler
• - فتح-تتبع- config-ملف تكوين المتتبع (متوافق مع OpenTracing). انظر تتبع الأداء
• --graphql-tracing Trace (انظر أعلاه) لكل محلل Graphql ، قد يكون له آثار على الأداء.
• - بلا لون ، - بلا ألوان لتعطيل الإخراج الطرفي الملون

هذا كل شيء. تم الانتهاء من التثبيت بنجاح.