الفرق بين المراجعتين ل"Liquid"
جميل-بيلوني (نقاش | مساهمات) |
|||
سطر 1: | سطر 1: | ||
− | + | لغة Liquid هي لغة قوالب آمنة وموجَّهة للعملاء لتطبيقات الويب المرنة، وهي لغة قوالب مفتوحة المصدر أنشأتها منصة شوبيفاي [https://www.shopify.com/ Shopify] وكُتِبت بلغة روبي [[Ruby]]، وهي العمود الفقري لقوالب شوبيفاي وتُستخدَم لتحميل محتوى ديناميكي على واجهات المتاجر. | |
− | هي لغة قوالب آمنة وموجَّهة للعملاء لتطبيقات الويب المرنة، وهي لغة قوالب مفتوحة المصدر أنشأتها منصة شوبيفاي [https://www.shopify.com/ Shopify] وكُتِبت بلغة روبي | ||
اُستخدِمت لغة Liquid في الإنتاج ضمن شوبيفاي منذ عام 2006 وتستخدمها الآن تطبيقات استضافة ويب أخرى متعددة. | اُستخدِمت لغة Liquid في الإنتاج ضمن شوبيفاي منذ عام 2006 وتستخدمها الآن تطبيقات استضافة ويب أخرى متعددة. | ||
يمكنك [https://github.com/Shopify/liquid/archive/master.zip تنزليها] أو الاطلاع عليها على [https://github.com/Shopify/liquid GitHub]. | يمكنك [https://github.com/Shopify/liquid/archive/master.zip تنزليها] أو الاطلاع عليها على [https://github.com/Shopify/liquid GitHub]. | ||
+ | == مدخل إلى لغة Liquid== | ||
+ | تستخدم لغة Liquid مزيجًا من الكائنات objects والوسوم tags والمرشّحات filters ضمن ملفات القالب template لعرض محتوى ديناميكي متغير. | ||
+ | ===الكائنات Objects=== | ||
+ | تحتوي الكائنات على المحتوى الذي تعرضه لغة Liquid على الصفحة، حيث تُعرَض الكائنات والمتغيرات عند وضعها ضمن أقواس معقوصة مزدوجة <code><nowiki>{{</nowiki></code> و <code><nowiki>}}</nowiki></code>.<syntaxhighlight lang="liquid"> | ||
+ | {{ page.title }} | ||
+ | </syntaxhighlight>الخرج:<syntaxhighlight lang="liquid"> | ||
+ | Introduction | ||
+ | </syntaxhighlight>تعرض لغة Liquid في هذه الحالة محتوى خاصية العنوان <code>title</code> لكائن الصفحة <code>page</code> الذي يحتوي على النص <code>Introduction</code>. | ||
+ | ===الوسوم Tags=== | ||
+ | تُنشِئ الوسوم منطق وتحكم تدفق القوالب. لا تنتج محدّدات النسبة المئوية للقوس المعقوص <code>{%</code> و <code>%}</code> والنص المُحاط بهما أيَّ خرج مرئي عند تصيير rendered القالب. يتيح لك هذا إسناد متغيرات وإنشاء شروط أو حلقات بدون إظهار منطق لغة Liquid على الصفحة.<syntaxhighlight lang="liquid"> | ||
+ | {% if user %} | ||
+ | Hello {{ user.name }}! | ||
+ | {% endif %} | ||
+ | </syntaxhighlight>خرج الشيفرة:<syntaxhighlight lang="liquid"> | ||
+ | Hello Adam! | ||
+ | </syntaxhighlight>يمكن تصنيف الوسوم إلى أنواع مختلفة هي: | ||
+ | *[[Liquid/control-flow|التحكم بسير أو تدفق تنفيذ الشيفرة Control flow]] | ||
+ | *[[Liquid/iteration|التكرار أو المرور على العناصر Iteration]] | ||
+ | *[[Liquid/template|قوالب Template]] | ||
+ | *[[Liquid/variable|إسناد متغيرات Variable assignment]] | ||
+ | اطّلع على المزيد عن كل نوع من الوسوم في الأقسام الخاصة بها. | ||
+ | ===المرشحات Filters=== | ||
+ | تغيّر المرشحات خرج كائن أو متغيّر لغة Liquid، وتُستخدَم ضمن الأقواس المزدوجة المعقوصة <code><nowiki>{{ }}</nowiki></code> والوسوم ذات النوع إسناد متغيرات [[Liquid/variable|variable assignment]] ويُفصَل بينهما بمحرف الشريط العمودي <code>|</code>.<syntaxhighlight lang="liquid"> | ||
+ | {{ "/my/fancy/url" | append: ".html" }} | ||
+ | </syntaxhighlight>الخرج:<syntaxhighlight lang="liquid"> | ||
+ | /my/fancy/url.html | ||
+ | </syntaxhighlight>يمكن استخدام مرشّحات متعددة على خرج واحد، إذ تُطبَّق المرشّحات من اليسار إلى اليمين:<syntaxhighlight lang="liquid"> | ||
+ | {{ "adam!" | capitalize | prepend: "Hello " }} | ||
+ | </syntaxhighlight>الخرج:<syntaxhighlight lang="liquid"> | ||
+ | Hello Adam! | ||
+ | </syntaxhighlight> | ||
− | == التطبيقات التي تستخدم لغة Liquid == | + | === التطبيقات التي تستخدم لغة Liquid === |
[[ملف:web-applications.png|مركز|تصغير|439x439بك]][https://github.com/Shopify/liquid/wiki#who-uses-liquid وغيرها الكثير]. | [[ملف:web-applications.png|مركز|تصغير|439x439بك]][https://github.com/Shopify/liquid/wiki#who-uses-liquid وغيرها الكثير]. | ||
+ | |||
+ | == الأساسيات == | ||
+ | |||
+ | === [[Liquid/operators|المعاملات Operators]] === | ||
+ | شرح المعاملات المنطقية ومعاملات موازنة متعددة التي تحتويها Liquid، ويمكنك استخدام هذه المعاملات لإنشاء منطق مع الوسوم ذات النوع [[Liquid/control-flow|control flow]] (تحكم في تدفق أو خط سير الشيفرة). | ||
+ | |||
+ | === [[Liquid/truthy-and-falsy|نوعا القيم الصحيحة Truthy والخطأ Falsy في Liquid]] === | ||
+ | يشرح هذا القسم أنواع البيانات التي تُقيَّم على أنها صح <code>true</code> أو خطأ <code>false</code>. | ||
+ | |||
+ | === [[Liquid/types|أنواع البيانات في لغة Liquid]] === | ||
+ | تشرح هذه الصفحة أنواع البيانات التي تحويها لغة Liquid وكيفية التعامل معها. | ||
+ | |||
+ | === [[Liquid/variations|إصدارات Liquid]] === | ||
+ | يعرض الإصدارات الأكثر شيوعًا من لغة Liquid الموجودة وهي Liquid و Shopify Liquid و Jekyll Liquid. | ||
+ | |||
+ | === [[Liquid/whitespace|التحكم بالمسافات الفارغة Whitespace في Liquid]] === | ||
+ | تتيح Liquid آليةً للتحكم بالمسافات الفارغة عند تصيير الشيفرة وطباعتها في قالب HTML، إذ يُحوَّل أي سطر من شيفرة Liquid في القالب إلى سطر إضافي ضمن ملف HTML المصيَّر حتى إن لم يحتوي ذلك السطر على نص لطباعته فيه، لذا وجب توفير آلية للتحكم بتلك الأسطر والمسافات الفارغة. | ||
+ | |||
+ | == الوسوم Tags == | ||
+ | |||
+ | === [[Liquid/control-flow|وسوم التحكم في تدفق وسير التنفيذ في Liquid]] === | ||
+ | يعرض وسوم التحكم في تدفق وسير التنفيذ Control flow tags التي تحدّد تنفيذ كتل شيفرة Liquid أم لا وتتحكم في تدفق سير تنفيذ شيفرة Liquid. | ||
+ | |||
+ | === [[Liquid/iteration|وسوم التكرار Iteration في Liquid]] === | ||
+ | يعرض الوسوم التكرارية التي تحويها Liquid والتي تنفِّذ كتلًا من الشيفرة تكراريًا. | ||
+ | |||
+ | === [[Liquid/template|وسوم القالب Template tags]] === | ||
+ | يعرض الوسوم الخاصة بالقالب التي تحويها Liquid والتي تخبر لغةَ Liquid بمكان تعطيل معالجة التعليقات أو الشيفرة التي ليست تابعة للغة Liquid، وكيفية إنشاء علاقات بين ملفات القوالب. | ||
+ | |||
+ | === [[Liquid/variable|وسوم المتغيرات في Liquid]] === | ||
+ | يعرض الوسوم الخاصة بالمتغيرات التي تنشئ متغيرات Liquid جديدة. | ||
+ | |||
+ | == [[Liquid/filters|المرشحات Filters]] == | ||
+ | يعرض هذا القسم كل المرشحات الموجودة في Liquid. | ||
+ | |||
+ | == المصدر == | ||
+ | |||
+ | * [https://shopify.github.io/liquid/ توثيق Liquid الرسمي] | ||
+ | [[تصنيف:Liquid]] |
مراجعة 13:21، 5 أغسطس 2021
لغة Liquid هي لغة قوالب آمنة وموجَّهة للعملاء لتطبيقات الويب المرنة، وهي لغة قوالب مفتوحة المصدر أنشأتها منصة شوبيفاي Shopify وكُتِبت بلغة روبي Ruby، وهي العمود الفقري لقوالب شوبيفاي وتُستخدَم لتحميل محتوى ديناميكي على واجهات المتاجر.
اُستخدِمت لغة Liquid في الإنتاج ضمن شوبيفاي منذ عام 2006 وتستخدمها الآن تطبيقات استضافة ويب أخرى متعددة.
يمكنك تنزليها أو الاطلاع عليها على GitHub.
مدخل إلى لغة Liquid
تستخدم لغة Liquid مزيجًا من الكائنات objects والوسوم tags والمرشّحات filters ضمن ملفات القالب template لعرض محتوى ديناميكي متغير.
الكائنات Objects
تحتوي الكائنات على المحتوى الذي تعرضه لغة Liquid على الصفحة، حيث تُعرَض الكائنات والمتغيرات عند وضعها ضمن أقواس معقوصة مزدوجة {{
و }}
.
{{ page.title }}
الخرج:
Introduction
تعرض لغة Liquid في هذه الحالة محتوى خاصية العنوان title
لكائن الصفحة page
الذي يحتوي على النص Introduction
.
الوسوم Tags
تُنشِئ الوسوم منطق وتحكم تدفق القوالب. لا تنتج محدّدات النسبة المئوية للقوس المعقوص {%
و %}
والنص المُحاط بهما أيَّ خرج مرئي عند تصيير rendered القالب. يتيح لك هذا إسناد متغيرات وإنشاء شروط أو حلقات بدون إظهار منطق لغة Liquid على الصفحة.
{% if user %}
Hello {{ user.name }}!
{% endif %}
خرج الشيفرة:
Hello Adam!
يمكن تصنيف الوسوم إلى أنواع مختلفة هي:
- التحكم بسير أو تدفق تنفيذ الشيفرة Control flow
- التكرار أو المرور على العناصر Iteration
- قوالب Template
- إسناد متغيرات Variable assignment
اطّلع على المزيد عن كل نوع من الوسوم في الأقسام الخاصة بها.
المرشحات Filters
تغيّر المرشحات خرج كائن أو متغيّر لغة Liquid، وتُستخدَم ضمن الأقواس المزدوجة المعقوصة {{ }}
والوسوم ذات النوع إسناد متغيرات variable assignment ويُفصَل بينهما بمحرف الشريط العمودي |
.
{{ "/my/fancy/url" | append: ".html" }}
الخرج:
/my/fancy/url.html
يمكن استخدام مرشّحات متعددة على خرج واحد، إذ تُطبَّق المرشّحات من اليسار إلى اليمين:
{{ "adam!" | capitalize | prepend: "Hello " }}
الخرج:
Hello Adam!
التطبيقات التي تستخدم لغة Liquid
الأساسيات
المعاملات Operators
شرح المعاملات المنطقية ومعاملات موازنة متعددة التي تحتويها Liquid، ويمكنك استخدام هذه المعاملات لإنشاء منطق مع الوسوم ذات النوع control flow (تحكم في تدفق أو خط سير الشيفرة).
نوعا القيم الصحيحة Truthy والخطأ Falsy في Liquid
يشرح هذا القسم أنواع البيانات التي تُقيَّم على أنها صح true
أو خطأ false
.
أنواع البيانات في لغة Liquid
تشرح هذه الصفحة أنواع البيانات التي تحويها لغة Liquid وكيفية التعامل معها.
إصدارات Liquid
يعرض الإصدارات الأكثر شيوعًا من لغة Liquid الموجودة وهي Liquid و Shopify Liquid و Jekyll Liquid.
التحكم بالمسافات الفارغة Whitespace في Liquid
تتيح Liquid آليةً للتحكم بالمسافات الفارغة عند تصيير الشيفرة وطباعتها في قالب HTML، إذ يُحوَّل أي سطر من شيفرة Liquid في القالب إلى سطر إضافي ضمن ملف HTML المصيَّر حتى إن لم يحتوي ذلك السطر على نص لطباعته فيه، لذا وجب توفير آلية للتحكم بتلك الأسطر والمسافات الفارغة.
الوسوم Tags
وسوم التحكم في تدفق وسير التنفيذ في Liquid
يعرض وسوم التحكم في تدفق وسير التنفيذ Control flow tags التي تحدّد تنفيذ كتل شيفرة Liquid أم لا وتتحكم في تدفق سير تنفيذ شيفرة Liquid.
وسوم التكرار Iteration في Liquid
يعرض الوسوم التكرارية التي تحويها Liquid والتي تنفِّذ كتلًا من الشيفرة تكراريًا.
وسوم القالب Template tags
يعرض الوسوم الخاصة بالقالب التي تحويها Liquid والتي تخبر لغةَ Liquid بمكان تعطيل معالجة التعليقات أو الشيفرة التي ليست تابعة للغة Liquid، وكيفية إنشاء علاقات بين ملفات القوالب.
وسوم المتغيرات في Liquid
يعرض الوسوم الخاصة بالمتغيرات التي تنشئ متغيرات Liquid جديدة.
المرشحات Filters
يعرض هذا القسم كل المرشحات الموجودة في Liquid.