jamstack.org

جامستاك

هذا هو الريبو لـ https://jamstack.org

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

المساهمة بالموارد

لقد قمنا بجمع مجموعة من مقاطع الفيديو والعروض التقديمية والمقالات والموارد التعليمية الأخرى حول Jamstack. يمكنك المساهمة بالمحتوى في مجموعة الموارد هذه!

نحن نقبل المساهمات المقدمة كطلبات سحب.

المساهمة في الروابط إلى الموارد

للمساهمة برابط إلى أحد الموارد:

1. قم بإنشاء ملف md جديد في المجلد src/site/resources باسم فريد ووصفي. قم بتعبئة هذا الملف وفقًا للبنية الموضحة أدناه.
2. بالنسبة للعروض التقديمية والفيديو، أضف صورة مصغرة اختيارية إلى المجلد src/site/img/cms . (يجب أن تكون الصورة بتنسيق jpeg بعرض 600 بكسل وطول 400 بكسل)
3. إرسال طلب سحب

مرجع MD للمورد:

---
title : Resource title
date : Publish date (YYYY-MM-DD)
link : the URL of this resource
thumbnailurl : /img/cms/resources/resource-thumbnail.jpg
type :
  - article (Help us group and sort the resources by type article|video|presentation)
---

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

تشغيل البناء المحلي

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

• العقدة وNPM

تثبيت وتشغيل البناء

 # Clone this repository to your local environment
git clone [email protected]:jamstack/jamstack.org.git

# move in to your local site folder
cd jamstack.org

# install the dependencies
npm install

# run the build and dev server locally
npm start

التصميم باستخدام TailwindCSS

يستخدم هذا الموقع TailwindCSS لتقديم فئات CSS المفيدة وتوفير وسيلة سريعة لتصميم الموقع. هذا يعني أن معظم التصميمات يمكن إجراؤها دون كتابة أي CSS إضافي. بدلاً من ذلك، يمكن إضافة فئات الأدوات المساعدة مباشرة إلى HTML. يمكن أن يوفر هذا تطورًا سريعًا جدًا ويقدم أيضًا مستويات مدهشة من الإلمام بأولئك الذين اعتادوا العمل بهذه الطريقة (نظرًا لأن الاتفاقيات والفصول الدراسية ليست لكل موقع ).

أثناء التشغيل/التطوير محليًا، سيقوم أمر npm run start بإنشاء الموقع بما في ذلك مسار CSS من Tailwind.

المرافق العالمية لـ CSS.

يتم توفير عدد صغير من قواعد CSS المخصصة لكفاءة الفئات المتكررة أو العالمية. توجد هذه العناصر في src/css/tailwind.css ولكن يجب استخدامها بشكل مقتصد، حيث تتم معظم التصميمات في HTML عبر فئات الأدوات المساعدة في Tailwind.

ديف مقابل همز

أثناء إنشاء الإنتاج، يتضمن مسار CSS خطوة لإزالة جميع عبارات CSS غير المستخدمة وضغط CSS الناتج. من أجل كفاءة التطوير، لا يتم تنفيذ هذه الخطوة أثناء التطوير المحلي عبر الأمر npm run start . يمكنك معاينة إصدار الإنتاج المحسّن عن طريق تشغيل هذه الأوامر:

 # Run a production build
npm run build

# Serve the build locally
npm run start

استنساخ ونشر بنقرة واحدة

يمكنك استنساخ هذا المستودع وتشغيله كموقع اختبار خاص بك، مكتملًا بمسار بناء CI/CD على Netlify بالنقر فوق الزر أدناه. (يتطلب حسابات GitHub وNetlify مجانية)