ما هو Shopify الهيدروجين ولماذا يجب أن تهتم 2022؟

نشرت: 2022-04-22

جدول المحتويات

في السنوات القليلة الماضية ، أصبحت التجارة بدون رأس اتجاهًا سائدًا للتجارة الإلكترونية من المتوقع أن تغير الطريقة التي تعمل بها التجارة عبر الإنترنت. Shopify ، إحدى منصات SaaS للتجارة الإلكترونية الرائدة حاليًا ، استفادت من التجارة بدون رأس إلى المستوى التالي مع Shopify Hydrogen - أحدث تقنياتها.

في هذه المقالة ، سوف نكتشف لماذا Shopify الهيدروجين سيكون مغير قواعد اللعبة في التجارة مقطوعة الرأس ، وكيف يمكن للتجار Shopify الاستفادة بشكل كبير من أحدث تقنيات Shopify.

=> اقرأ المزيد: أفضل أمثلة على متجر بلا رأس Shopify Store

التجارة مقطوعة الرأس قبل Shopify الهيدروجين

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

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

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

مقطوعة الرأس مقابل متجانسة

إذا كنت جديدًا على هذه التقنية ، نوصيك ببعض المقالات الشاملة لفهم أفضل للتجارة بدون رأس:

  • ما هي التجارة مقطوعة الرأس؟
  • 15 أفضل الأمثلة على التجارة بدون رأس   

كان من الممكن دائمًا إنشاء متجر بدون رأس باستخدام Shopify كنظام أساسي للتجارة الإلكترونية من خلال استخدام StorefrontAPI. ومع ذلك ، فإن قطع الرأس لا يأتي بدون تحديات. عادةً ما يكون الأمر أكثر تكلفة ويستغرق وقتًا طويلاً مع مجموعة متنوعة من المهام المعقدة التي يجب القيام بها. بالإضافة إلى ذلك ، يتطلب الأمر مزيدًا من الوقت والجهد في الصيانة ، وهو ما قد لا يكون أسلوبًا رائعًا لـ Shopify التجار الذين يديرون شركة صغيرة ومتنامية.

Shopify Hydrogen هو الحل الأمثل للتخلص من كل هذه التعقيدات والتكاليف الإضافية التي تسير جنبًا إلى جنب مع تطوير Shopify متجر مقطوعة الرأس في الماضي. ليست هناك حاجة للاعتماد على تكامل الجهات الخارجية أو الأنظمة الخارجية أو التكنولوجيا الإضافية لتخصيص واجهة متجر Shopify الخاصة بك. تريد Shopify أن تقدم Hydrogen "تجارب مشتري مخصصة وديناميكية مدعومة من منصة Shopify وواجهات برمجة التطبيقات." لهذا السبب يُعتقد أن أحدث تقنيات Shopify هي مستقبل التطور بلا رأس.

ما هو Shopify الهيدروجين

نعتقد أن مستقبل التجارة على الويب سريع وشخصي وديناميكي - ويعكس الهيدروجين كيف نرى هذه الرؤية تتحقق.

Shopify اتحدوا 2021

Shopify الهيدروجين هو إطار عمل قائم على التفاعل لبناء واجهة متجر مخصصة لـ Shopify. يتضمن جميع الهياكل والمكونات والأدوات التي يحتاجها مطورو البرامج للبدء ، والبناء السريع ، وتقديم أفضل تجربة مستخدم مخصصة.

shopify الهيدروجين

الهدف النهائي للهيدروجين هو منحك المزيد من المرونة والوقت لبناء وتخصيص متجر Shopify الخاص بك دون قيود الواجهة الأمامية أو تكامل البرامج الخارجية. وفي الوقت نفسه ، لا تزال جميع وظائف التجارة الخلفية المدعومة من Shopify تعمل بسلاسة دون أي انقطاع. من خلال هذا ، يمكن لمتجر Shopify الخاص بك تحقيق نهج مقطوع الرأس دون صخب وتعقيد تكامل الطرف الثالث.

الهيدروجين هو نهج Shopify الموصى به والمتمثل برأيه لإبراز تجربة مستخدم سريعة ، وإمكانيات تاجر الأفضل في فئتها ، وتجربة مطور رائعة. إنه التقاطع بين التجارة و UX والترميز.

في هذه اللحظة ، الهيدروجين مفتوح المصدر بالكامل ، ويمكنك المساعدة في بناء الهيدروجين من خلال تجربته وإرسال التعليقات لتحسينه.

كيف Shopify يعمل الهيدروجين

من خلال العمل مع ملايين التجار على مستوى العالم ، توصل فريق مطوري Shopify إلى إدراك أن التجارة الإلكترونية تتطلب تجربة مستخدم سريعة وسلسة تظل مخصصة ومضمونة في نفس الوقت.

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

يشتمل الهيدروجين على بيئة سريعة البدء مع مكونات خاصة بالتجارة وأدوات مطور جاهزة للاستخدام:

  • إطار عمل الهيدروجين : يوجد مكون إضافي من Vite يقدم عرضًا من جانب الخادم (SSR) ، وبرمجيات وسيطة للترطيب وتحويلات كود مكون العميل.
  • مكونات واجهة مستخدم الهيدروجين: المكونات والخطافات والأدوات المساعدة التي تدعم الميزات والمفاهيم الموجودة بالفعل في Shopify.
shopify مكون الهيدروجين
المصدر: Shopify

يعمل إطار عمل الهيدروجين مثل اللبنات الأساسية التي تتيح لك تحقيق التوازن بين تجارب التجارة العظيمة وتجربة المستخدم. أدى تقديم هذه الإمكانات إلى إجبار الهيدروجين على الاستفادة من أعلى إمكانات React و Vite ، بالإضافة إلى إيلاء اهتمام خاص لتطوير المكونات المحسنة وأدوات المطور.

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

إلى جانب قالب البداية ، يعمل Hydrogen على تسريع عملية تطوير واجهة المتجر مع جميع مكونات واجهة المستخدم المضمنة والتي تم إنشاؤها حول نماذج بيانات Shopify. يمكن دمج هذه القطع مباشرةً مع واجهة برمجة تطبيقات Storefront للتفاعل مع Shopify APIs أو أي مصادر بيانات تابعة لجهات خارجية.

TL ؛ DR: Shopify يساعد الهيدروجين التجار على الاستفادة من تجربة التجارة من خلال إطاره وتسريع عملية تطوير واجهة المتجر من خلال مكونات واجهة المستخدم الجاهزة للاستخدام. من خلال ذلك ، يمكنك إنشاء تجارب تجارية ديناميكية دون التخلي عن أداء الموقع.

الوقوع في الحب Shopify الهيدروجين بالفعل؟ دعنا نقوم بتمكين متجر Shopify الخاص بك من خلال نهج مقطوع الرأس بالهيدروجين.

استكشف تطوير واجهة محل الهيدروجين

Shopify مقابل الهيدروجين السائل

  • Liquid : لغة نموذجية مكتوبة بلغة Ruby وتم إنشاؤها بواسطة Shopify. هذا هو العمود الفقري لجميع سمات Shopify ويستخدم لتحميل محتوى ديناميكي على صفحات المتجر.
  • الهيدروجين : إطار عمل لبناء واجهة Shopify مقطوعة الرأس.

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

الإطار عبارة عن مجموعة من الأدوات والمكونات الجاهزة لإنشاء التطبيقات.

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

فكر في الأمر بهذه الطريقة: القالب يشبه التلوين بالأرقام والإطار يشبه إلى حد كبير مجموعة LEGO.

في حالة Shopify ، بفضل لغة القالب ، من الممكن إعادة استخدام العناصر الثابتة التي تحدد تخطيط صفحة الويب ، أثناء ترحيل البيانات ديناميكيًا من متجر Shopify إلى الصفحة. من خلال الجمع بين السائل ولغات القوالب الأخرى ، مثل HTML و CSS و JavaScript ، يمكنك إنشاء وتخصيص سمة Shopify.

يشمل الهيدروجين جميع الهياكل والمكونات والأدوات اللازمة لبناء واجهات متاجر Shopify مخصصة. من خلال إطار العمل ومكونات واجهة المستخدم ، يساعدك Hydrogen في إنشاء واجهات متاجر مخصصة يمكنها تقديم أفضل تجربة للمستخدم.

نظرًا لأن Liquid يتطلب عناصر ثابتة وغير ثابتة لإنشاء سمة ، يمكن ملاحظة أن Liquid يفرض بعض القيود على تخصيص واجهة المتجر وأدائها. بالإضافة إلى ذلك ، يستغرق إنشاء سمة وتخصيصها باستخدام Liquid وقتًا طويلاً. لذلك ، يعمل الهيدروجين كحل من الجيل التالي لواجهات المتاجر القائمة على Shopify ، وذلك بفضل إمكانياته المفتوحة التي لا نهاية لها لبناء موقع فريد على الويب UX & UI. من المتوقع أن يتم تطوير الهيدروجين ليحل محل السائل في Shopify تطوير واجهة المتجر.

في هذه اللحظة ، يعد كل من Liquid و Hydrogen مفتوحين المصدر بالكامل على GitHub ويمكن للجميع تنزيله وتجربته.

لماذا الذهاب مقطوعة الرأس مع Shopify الهيدروجين

1. تحسين أداء الموقع

واحدة من الفوائد الواضحة لاتباع نهج مقطوعة الرأس مع Shopify Hydrogen هو الأداء الممتاز للموقع ، وخاصة سرعة الموقع.

من خلال فصل الواجهة الأمامية عن الواجهة الخلفية ، يمكنك الحصول على القدرة على فتح سرعة صفحة تحميل فائقة السرعة ، مع الحفاظ على كل المحتوى الديناميكي والوظائف داخل الواجهة الخلفية. يمكن أن يساعدك التبديل إلى Shopify Hydrogen على تقليل سرعة تحميل الصفحة من بضع ثوانٍ إلى أجزاء من الثانية ، وبالتالي الاستفادة من حيوية الويب الأساسية في المتجر.

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

2. قدرة أفضل على التوسع

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

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

الآن ، Shopify Hydrogen حلت هذه المشكلة من جذورها مع Shopify Oxygen - حل الاستضافة العالمي لواجهات متاجر الهيدروجين التي سيتم إطلاقها في عام 2022. لست بحاجة إلى الاعتماد على خدمات استضافة الطرف الثالث حيث سيتم استضافة متجر Shopify الخاص بك مباشرة على الأكسجين.

Shopify استثمرت بكثافة في هيكل Oxygen العالمي مع أكثر من 100 موقع خادم في جميع أنحاء العالم. يضمن Oxygen لعملائك الاستمتاع دائمًا بتحميل فوري من المتجر بغض النظر عن مواقعهم. تتيح هذه البنية التحتية القادمة الاتصال السريع بين المحتوى الديناميكي لواجهة المتجر وهياكل التجارة ، مما يترك مشكلات السرعة وقابلية التوسع قصة من الماضي.

Shopify الأكسجين

تدعي Shopify أن Oxygen هو أسرع طريقة لنشر تجارب التجارة المدعومة من Shopify. يمهد مزيج الهيدروجين والأكسجين الطريق للتجارة الحديثة بدون رأس في المستقبل القريب.

3. المزيد من حرية التصميم

نظرًا لأن Hydrogen يتبع نهجًا بدون رأس يفصل بين واجهة المتجر الخاصة بك Shopify من الواجهة الخلفية التي تحتوي على جميع البيانات ووظائف الموقع ، فإنه يوفر مزيدًا من المرونة والحرية لبناء واجهة متجرك وتخصيصها بالطريقة التي تريدها. قدرة التصميم مع Shopify Hydrogen لا حصر لها ، ويمكنك إنشاء تصميمات UX / UI فريدة لتقديم تجربة تسوق شخصية وديناميكية للزوار.

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

عرض الهيدروجين تابيتا
واجهة هيدروجينية تم إنشاؤها باستخدام أداة Tapita page builder

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

قم بتخصيص صفحاتك الحالية بسهولة وبناء واجهة متجر Shopify الخاصة بك باستخدام Tapita Page Builder. ليست هناك حاجة إلى مهارات البرمجة أو التصميم.

استكشف Tapita Page Builder

4. خبرة تجارية متميزة

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

تقدم Shopify Hydrogen مع مرونة الواجهة الأمامية ونظام إدارة المحتوى المنفصل حلاً بسيطًا وخفيف الوزن يمكن لأي متجر Shopify استخدامه. لديك سيطرة كاملة على تصميم واجهة المتجر وإدارة المحتوى لتخصيص واجهات المحلات المخصصة لإرضاء العملاء. بالإضافة إلى ذلك ، فإن الجمع بين الهيدروجين والأكسجين يضمن سرعة تحميل صفحات تبلغ جزء من الثانية مع الحفاظ على أداء الويب المستقر.

لا ينبغي أن تهدف التجربة التجارية الرائعة إلى إرضاء العملاء فقط ، ولكن يجب أن توازن بعناية تجربة العملاء وقدرة المتجر. يساعدك Shopify Hydrogen على التعامل مع تجربة تجارية رائعة يمكن أن ترضي أداء المتجر وتجربة العملاء في نفس الوقت.

5. التطور السريع

من خلال استخدام الإطار التأسيسي ومكونات واجهة المستخدم الجاهزة للاستخدام ، يمكن لـ Shopify Hydrogen تسريع تطوير الواجهة الأمامية مع الاستمرار في منح التجار قدرة تصميم لا نهاية لها. أيضًا ، يساعد الهيدروجين في تقليل كل التعقيدات التي غالبًا ما تأتي مع تكاملات وبرامج الجهات الخارجية اللازمة لبناء واجهة متجر مخصصة في الماضي.

وبالتالي ، Shopify Hydrogen هي واحدة من أسرع الطرق التي يمكن لمتاجر Shopify اعتمادها لتحقيق أفضل ميزات التجارة بدون رأس بدون عملية تطوير طويلة ومعقدة ومكلفة.

Shopify قيود الهيدروجين

نظرًا لأن Shopify Hydrogen متاح فقط في معاينة المطور ، فلا يوجد الكثير يمكننا قوله حول هذا التطوير بدون رأس Shopify الذي يعمل بالطاقة حتى الآن. في الوقت الحالي ، لا يمكن استخدام الهيدروجين إلا لبناء واجهات متاجر Shopify. لا يتم حاليًا دعم أي أنواع أخرى من واجهات المتاجر المخصصة ، بما في ذلك تطبيقات الأجهزة المحمولة وألعاب الفيديو والأجهزة الذكية. سنقوم بتحديث أحدث تقنيات Shopify بانتظام لإبلاغك بالقيود والعيوب المحتملة الأخرى.

الذهاب مقطوعة الرأس مع SimiCart اليوم

في حين أن هناك العديد من الأساليب للتجارة بدون رأس ، Shopify Hydrogen هو بالتأكيد مغير للعبة يمكننا توقع المزيد في المستقبل. على الرغم من أنه لن يحل محل السائل في أي وقت قريب ، إلا أن اتباع أحدث اتجاهات التكنولوجيا يمكن أن يجعلك تسبق منافسيك بخطوة.

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

استكشف الآن