بلوكات مخصصة وذكاء اصطناعي
إذا كان ينتمي إلى تطبيقك، فيمكنك بناءه.
اكتب بلوكات React Native حقيقية مقابل بيانات Shopify المباشرة، بالمحرر واشتراك الذكاء الاصطناعي الذي تستخدمه بالفعل. لا ذكاء اصطناعي خاص، ولا هوامش، ولا ارتباط إلزامي.
01import { useCart } from '@evlop/shopify';02import { View, Pressable } from 'react-native';0304export function StorefrontHeader() {05 const cart = useCart();06 return <HeaderShell>07 <PredictiveSearch />08 <AccountButton />09 <CartButton count={cart.lines?.length ?? 0} />10 </HeaderShell>;11}
REPLACE WITHStorefrontHeader.tsx
محررك + ذكاؤك الاصطناعي
«أنشئ ترويسة تطبيق بديلة تتضمن بحثاً تنبؤياً وإمكانية الوصول إلى الحساب وعدداً حياً لسلة التسوق.»
استخدم اشتراكك الحالي · بلا رسوم إضافية على الذكاء الاصطناعي من Evlop معاينة مباشرة متصلةجاهز لاستبدال ترويسة التطبيقiOS + Android
أنشئ. عيّن. استبدل.
ابنِ أي جزء من تطبيقك باستخدام Custom Blocks.
أنشئ Custom Block جديدًا في React Native. أضِفه كقسم، أو عيّنه ليحل محل الترويسة أو القائمة الجانبية أو بطاقة المنتج أو بطاقة المجموعة أو التذييل المدمجة في التطبيق.
إدراج WITHNewArrivalsSection.tsx
هدف الإدراجقسم مخصصتم إدراج كتلة جديدة في هذه الشاشة
كتلة قسم جديدةNewArrivalsSection.tsxبلوك مخصص جديد · React Native
أنشئ كتلة قسم جديدة، ثم ضعها على أي شاشة.
ابنِ القسم ككتلة React Native قابلة لإعادة الاستخدام، واربط البيانات والسلوك الذي يحتاجه، ثم أدرجه أينما ينتمي في تطبيقك.
01إنشاء كتلة جديدة→02إضافة الكتلة إلى شاشة
المنتجاتمجموعةالحقول الوصفية
استخدم مساعد الذكاء الاصطناعي المتصل بكأنشئ قسمًا جديدًا للوصولات التحريرية مع شريط منتجات قابل للتسوق.
01import { useProducts } from '@evlop/shopify';02import { View } from 'react-native';0304export function NewArrivalsSection() {05 const products = useProducts({06 query: 'tag:new-arrival'07 });0809 return <EditorialRail products={products} />;10}
متجرك هو بيئة التشغيل
أدخل بيانات Shopify إلى أي واجهة.
يمكن للبلوكات المخصصة قراءة سياق التجارة والمتسوقين المباشر، واستدعاء إجراءات أصلية، والاستعلام عن بيانات إضافية من Storefront API. والنتيجة واجهة مستخدم مخصصة مفيدة — وليست مجرد زخرفة.
الحزمة الرسمية@evlop/shopifyبيانات مُنمّطة · إجراءات أصلية · تحديثات مباشرة
01import {02 useCart, useProducts, useMetaobjects,03 useStorefrontQuery04} from '@evlop/shopify';0506const cart = useCart();07const products = useProducts({ query: 'tag:editorial' });08const customer = useStorefrontQuery(CUSTOMER_QUERY);09const stories = useMetaobjects({ metaobjectType: 'story' });
بيانات مباشرة
تحتاج شيئًا آخر؟استعلم عن أي حقل من حقول Storefront API أو اربط خدمة خارجية معتمدة.
أحضر محررك وذكاءك الاصطناعي الخاصين
استخدم سير عمل الذكاء الاصطناعي الذي تثق به بالفعل.
اربط مساحة عمل Custom Blocks البرمجية بالمحرر الذي تفضله، ثم استخدم مساعد البرمجة بالذكاء الاصطناعي والاشتراك اللذين تملكهما بالفعل. لا يتوسط Evlop النموذج، ولا يقيس رموز الذكاء الاصطناعي، ولا يقيد مكتباتك بمزوّد واحد.
اربط مساحة عمل Custom Blocks البرمجية بالمحرر الذي يعمل به فريقك بالفعل.
استخدم مساعد البرمجة وحساب الذكاء الاصطناعي اللذين تملكهما بالفعل—لا يتطلب Evlop نموذجًا خاصًا به.
لا يقيس Evlop رموز الذكاء الاصطناعي ولا يضيف رسومًا منفصلة لاستخدامه إلى خطتك.
بدّل المحرر أو مزود الذكاء الاصطناعي دون تغيير طريقة عمل الكتل المخصصة في Evlop.
أنشئ هيدر بديلاً مع بحث تنبؤي وترحيب بالعميل وعدد حي لعناصر السلة.
React Nativeبيانات Shopifyسمة التطبيق
يبني الذكاء الاصطناعي الخاص بك→
01import { useCart } from '@evlop/shopify';02import { View, Pressable } from 'react-native';0304export function StorefrontHeader() {05 const cart = useCart();06 return <HeaderShell>07 <PredictiveSearch />08 <CustomerGreeting />09 <CartButton count={cart.lines?.length ?? 0} />10 </HeaderShell>;11}
افتح مساحة عمل Custom Blocks في بيئة التطوير التي تفضلها.
اعمل بحساب واشتراك الذكاء الاصطناعي الحالي لديك—بلا فاتورة ذكاء اصطناعي إضافية من Evlop.
راجع الكتلة وحسّنها مقابل بيانات Shopify الحية على جهاز حقيقي.
استبدل سطحاً مدمجاً أو أدرج المكوّن الجديد في الشاشة.
مصمم للإنتاج
حرية بلا حدود، مع المنصة التي تحته.
التخصيص لا يعني الانفصال. يبقى كل مكوّن جزءاً من التطبيق الأصلي نفسه، ومن بيئة تشغيل التجارة، ونظام التصميم، والمعاينة، وسير عمل النشر.
React Native حقيقي
مكوّنات Custom Blocks هي مكونات React أصلية وليست تضمينات ويب، لذا يبدو التخطيط والتفاعلات والأداء طبيعياً تماماً على iOS وAndroid.
مدرك لـ Shopify افتراضياً
استخدم حزمة Shopify من Evlop واستعلامات Storefront لإدخال المنتجات والمجموعات وسلة الشراء وبيانات العميل وحقول metafields وmetaobjects وغيرها في أي مكوّن.
متصل بنظام تطبيقك
أعد استخدام ألوان التطبيق وخطوطه وسماته وتوطينه وتنقله والإجراءات الأصلية فيه بدلاً من إعادة بناء هذه الأساسيات.
معاينة ونشر فوري
شغّل التغييرات على جهاز اختبار حقيقي، وحسّن التجربة، وانشر دون انتظار مراجعة جديدة من متجر التطبيقات.
الاستفسارات الشائعة
الأسئلة الأكثر تكرارًا.
إجابات عملية حول بناء Custom Blocks وتشغيلها ومعاينتها ونشرها.
أنشئ بلوكًا جديدًا، ثم أضفه كقسم أو عيّنه ليحل محل الترويسة أو القائمة الجانبية أو بطاقة المنتج أو بطاقة المجموعة أو التذييل المدمجين في التطبيق. يمكنك أيضًا إنشاء تجارب الحساب وواجهات سلة التسوق ووحدات الحملات ووظائف أخرى مصممة لأغراض محددة.