00:00:00مرحباً بكم في البث المباشر الأسبوعي لمجتمع Purcell.
00:00:22أنا إيمي إيغان.
00:00:23أنا ضمن فريق المجتمع هنا في Purcell.
00:00:27تذكير، هذا البث يُعرض على X ويوتيوب، ولكن إذا أردت الانضمام إلى الدردشة، يرجى تسجيل الدخول إلى المجتمع والضغط على
00:00:34"حضور"
00:00:35في الفعالية.
00:00:35ستظهر الدردشة على الجانب وسأتأكد من أننا نرى تعليقاتكم إذا كان لديكم أي أسئلة.
00:00:42لا تترددوا في طرح الأسئلة طوال الجلسة وسنجيب عليها جميعاً في النهاية.
00:00:47وتذكير آخر، إذا كنتم تشاركون في الدردشة، يرجى تذكر أن تكونوا محترمين وتتبعوا مدونة قواعد السلوك الخاصة بنا.
00:00:54وبعد هذا، أود أن أرحب بضيوفنا على المسرح.
00:00:58في الشهر الماضي، انضم زميلي، جاكوب، إلى فريق HubSpot للحديث عن جلب الواجهة الخلفية الخاصة بك إلى برنامج مطوري HubSpot.
00:01:05وهذا الشهر ينضم إلينا فريق HubSpot للحديث عن كيفية استخدامهم لـ Purcell.
00:01:09فأهلاً بك يا بروك.
00:01:12شكراً جزيلاً لكِ يا إيمي.
00:01:13مرحباً بالجميع.
00:01:14اسمي بروك بوند، وأنا متحمسة لوجودي هنا في مجتمع Purcell.
00:01:20لديّ سؤالان فقط يمكنكم الإجابة عليهما مسبقاً في الدردشة، ولكننا نود أن نعرف، هل سبق لكم استخدام HubSpot من قبل؟
00:01:28هل تعرفون من نحن؟
00:01:30هل قمتم بالبناء معنا؟
00:01:31وإذا فعلتم، فماذا بنيتم؟
00:01:34أود أن أرى كل هذه التعليقات في الدردشة.
00:01:38سيكون ذلك رائعاً جداً، لكن لدينا 30 دقيقة فقط.
00:01:42لذا أريد التأكد من أننا نغطي كل محتوانا الرائع.
00:01:45لذا اليوم سنستعرض سريعاً ما هو HubSpot؟
00:01:49من نحن كفريق HubSpot DevRel؟
00:01:51كيف يمكننا استخدام HubSpot وPurcell معاً؟
00:01:54ثم لدينا بعض الأمثلة عن كيفية استخدام فريق HubSpot DevRel لـ Purcell في مشاريعنا المختلفة التي نقوم بها في HubSpot.
00:02:02وأخيراً، سنترك بعض الوقت للأسئلة والأجوبة.
00:02:04لذا كما قالت إيمي، إذا كان لديكم أي أسئلة على الإطلاق، يرجى وضعها في الدردشة وسنكون سعداء بالإجابة عليها في النهاية.
00:02:12لذا اليوم سينضم إليّ اثنان من زملائي، دينيس إدسون وكريس رايلي.
00:02:18ونحن متحمسون جداً لوجودنا هنا.
00:02:19لذا دعونا أولاً نضع القواعد الأساسية، لا أقصد القواعد الأساسية، بل دعونا نوضح ما هو HubSpot.
00:02:25HubSpot هو نظام CRM ذكي للشركات.
00:02:29لدينا مجموعة من برامج التسويق والمبيعات والخدمة، ولدينا منصة مطورين موحدة لبناء التكاملات.
00:02:39وهذا ما يركز عليه فريق DevRel جهوده، وهو مساعدة مطورينا على فهم كيفية استخدام منصة المطورين.
00:02:47الصورة التي ترونها هنا على الشاشة هي صفحة سجل جهة اتصال في CRM.
00:02:53لذا مع منصة مطوري HubSpot، يتم استضافة كل العمل الذي تنشئونه ضمن مشروع HubSpot.
00:03:00وعلى منصة مطوري HubSpot، يمكنكم بناء تطبيقات ثابتة داخلية أو تطبيقات OAuth خارجية.
00:03:09وإذا بنيتم تطبيقاً خارجياً، يمكنكم وضعه في سوق HubSpot الخاص بنا، ومن ثم يمكن لأي شخص لديه حساب HubSpot الذهاب إلى السوق وتنزيل تطبيقكم.
00:03:21لنفترض أنكم Vercel وتريدون بناء تكامل حيث يمكن للأشخاص رؤية مقاييس Vercel الخاصة بهم داخل حساب HubSpot الخاص بهم.
00:03:29يمكنكم المضي قدماً وبناء ذلك، وإنشاء تدفق OAuth، وجعل الأشخاص يقومون بتنزيله في حساباتهم، ومن ثم سيتمكنون من رؤية محتوى Vercel الخاص بهم مباشرة داخل HubSpot والعكس صحيح.
00:03:40الآن، لقطة الشاشة التي لدي هنا الآن هي صفحة نظرة عامة على التطوير.
00:03:46لذا لدينا صفحة نظرة عامة مخصصة للتطوير للمطورين عندما يكونون في حساباتهم حتى يتمكنوا من رؤية جميع المشاريع التي يقومون بها.
00:03:54لدينا أيضاً أدوات مراقبة حتى يتمكن الأشخاص من رؤية استخدام واجهة برمجة التطبيقات وكل تلك الأشياء الجيدة.
00:04:01لذا كل أغراضكم في مكان واحد، من السهل جداً عليكم الدخول.
00:04:05لا داعي للقلق بشأن ضوضاء كل تلك الأشياء الأخرى التي ليست جزءاً من مشاريع HubSpot الخاصة بكم.
00:04:11لذا الآن أريد أن أقدمنا سريعاً كفريق.
00:04:15نحن مجموعة متعددة التخصصات من المطورين والمديرين الذين يساعدون مطورينا على الازدهار في نظام HubSpot البيئي، ونحن نساعد مجتمع المطورين من خلال بناء الحلول، ومساعدتهم على تعلم أفضل الممارسات، وإنشاء تكاملات يمكنهم استخدامها.
00:04:32نستضيف فعاليات مباشرة مثل هذه وعلى قنواتنا الخاصة، ونحضر ونتحدث في المؤتمرات، ونتأكد أيضاً من أخذ ملاحظات المطورين الخارجيين في الاعتبار عند بناء وإطلاق ميزات جديدة.
00:04:45لذا نحن قريبون جداً من نظرائنا في هندسة المطورين ونقدم لهم ملاحظات من مجتمعنا لمساعدتنا في تحسين منتجاتنا.
00:04:53هذا مجرد رسم بياني صغير أنشأته لأوضح لكم المزيد.
00:04:57لدينا مواردنا التعليمية التي تشمل وثائق المطورين، ومدونتنا، وقناتنا على يوتيوب، ودروس تعليمية مختلفة لدينا على يوتيوب وGitHub وأماكن أخرى.
00:05:08مجتمعنا وتواصلنا، لدينا قناة Slack للمطورين يمكن لأي شخص التسجيل فيها.
00:05:13لدينا أيضاً منتدى، حتى يتمكن الأشخاص من طرح الأسئلة في منتديات المجتمع.
00:05:18ونقيم فعاليات حضورية على مدار العام.
00:05:22لدينا أيضاً بعض أدوات البناء والتطوير.
00:05:25لدينا تقييم جودة التطبيقات، وهذا هو فريق جودة النظام البيئي لدينا.
00:05:29إنهم ينظرون إلى جميع التطبيقات التي تُعرض في سوقنا ويتأكدون من أنها تفي بمعاييرنا.
00:05:37ولدينا أيضاً تطبيقات نموذجية.
00:05:39وأخيراً، هذا جديد، لكن لدينا Dev MCP الخاص بنا.
00:05:42وقد عملنا عن كثب مع المهندسين الذين بنوا ذلك حتى يتمكنوا من فهم كيف يمكننا صنع منتج MCP رائع حقاً لمطورينا.
00:05:51وأخيراً، العرض والنمو.
00:05:53لدينا قسم دراسات الحالة حيث نأخذ برامج مطورين رائعة ونسلط الضوء على كيفية استخدامهم لـ HubSpot.
00:06:02لدينا أيضاً شهادات السوق.
00:06:04لذا عندما تنشر تطبيقك في سوقنا، يمكنك الحصول على شهادة السوق، مما يعني أنك ستحصل على علامة زرقاء صغيرة أو مجرد رمز لإعلام الناس بأنك مضمون الجودة.
00:06:16وأخيراً، نساعد في تنسيق استراتيجية الدخول إلى السوق (GTM).
00:06:19لذا عندما يكون لدينا إطلاقات كبيرة على مدار العام، نساعد في المواد التسويقية لذلك، ونتأكد من أننا نتحدث إلى جمهور المطورين لدينا بالطريقة التي ستكون الأفضل لهم.
00:06:30الآن بعد أن تحدثنا عن من نحن وماذا نفعل، دعونا نتحدث عن كيفية استخدامنا لـ HubSpot وVercel معاً.
00:06:37كما قالت إيمي، في الشهر الماضي عقدنا ندوة عبر الإنترنت حول جلب الواجهة الخلفية الخاصة بك.
00:06:43لذا هذه إحدى حالات الاستخدام الرئيسية التي سأتحدث عنها هنا، وهي استخدام Vercel كخدمة واجهة خلفية.
00:06:50في هذه الحالة، لديك تطبيق HubSpot الخاص بك، وهو واجهتنا الأمامية، ويحتوي على مكونات واجهة مستخدم مبنية باستخدام React تضعها على صفحتك بحيث يمكنك عرضها للواجهة الأمامية داخل حساب HubSpot.
00:07:03ثم لديك واجهة Vercel الخلفية، التي ستحتوي على الكود الخاص بك.
00:07:06وما ستفعله هو أنك ستستخدم hubspot.fetch داخل الكود الخاص بك لاستدعاء الواجهة الخلفية عبر واجهة برمجة التطبيقات التي تنشئها.
00:07:14وبعد ذلك، ستقوم بإرجاع البيانات ومعالجتها ثم عرض استجابة للواجهة الأمامية.
00:07:20لإظهار كيف يبدو ذلك، سأستعرض سريعاً مثالاً قمت ببنائه، وهو مولد ملفات LLMS.txt.
00:07:30حاولوا قول ذلك ثلاث مرات بسرعة.
00:07:32ما يفعله هذا هو أن مولد ملفات LLMS.txt هو تطبيق HubSpot يأخذ صفحة ويب أو رابط خريطة موقع، ويحلل البيانات الموجودة في الصفحة لإنشاء هذا الملف.
00:07:45وملف LLMS.txt هو ملف لزواحف البحث بالذكاء الاصطناعي حتى لا يكون لديهم كل تلك الأكواد الإضافية من HTML.
00:07:55يعرض معلوماتك بتنسيق ملف Markdown حتى يتمكنوا من قراءتها بسرعة كبيرة.
00:08:02ويستخدم هذا HubSpot fetch لاستدعاء نقطة نهاية Vercel API وHubSpot files API لتحميل هذا الملف إلى حساب HubSpot الخاص بك.
00:08:11لقطة الشاشة التي أعرضها هنا هي الكود الخاص بي، وهذا هو المكان الذي أستدعي فيه Vercel API فعلياً.
00:08:18وهنا، قمت بلف ذلك داخل كتلة try-catch، ثم أرسلت نقطة النهاية.
00:08:25الآن بعد أن تحدثت عن ذلك، دعونا نرى كيف يعمل.
00:08:28لذا سأنتقل إلى الواجهة الأمامية حتى تتمكنوا من الرؤية.
00:08:31هذا داخل حساب HubSpot الخاص بنا، وهنا لدينا مولد DevRel Labs.
00:08:38هذه هي ما يُعرف بصفحة إعدادات التطبيق، والسبب تحديداً في اختياري عرضها على صفحة إعدادات التطبيق هو أن هذا نوع من العمل الإداري للغاية الذي يقوم به الأشخاص لمواقعهم الإلكترونية.
00:08:51لذا لم أرد أن أجعله متاحاً لأي شخص داخل حساب HubSpot الخاص بكم.
00:08:55أردت التأكد من أن الأشخاص المناسبين فقط لديهم حق الوصول إلى هذا حتى لا يقوم الناس بإنشاء هذه الملفات ويسببوا مشاكل لزواحف البحث بالذكاء الاصطناعي.
00:09:04لذا هنا، يمكنك اختيار نوعك، يمكنك إدخال خريطة موقع كاملة، أو يمكنك إدخال رابط URL واحد.
00:09:10من الواضح أن خريطة الموقع، إذا كان موقعك الإلكتروني كبيراً جداً، ستستغرق بعض الوقت.
00:09:15لذا سيكون رابط URL الواحد أسرع بكثير.
00:09:17ثم يمكنك فقط إدخال رابط URL الخاص بك.
00:09:20لذا سأقوم فقط بوضع developers.hubspot.com، ثم سيقوم بالتوليد...
00:09:26أوه، لقد حدث خطأ..
00:09:28حسناً.
00:09:29حسناً، هذا ممتع.
00:09:30هذا بث مباشر.
00:09:31لذا دعونا نرى.
00:09:32دعنا نذهب إلى إعدادات Vercel الخاصة بي ونرى إذا حصلنا على رسالة خطأ في...
00:09:37حسناً، ليس سجلات البناء..
00:09:39لذا هنا في الواجهة الخلفية الخاصة بي، يمكننا رؤية الأشياء.
00:09:43لذا دعنا نرى سجلات وقت التشغيل ونرى إذا كان بإمكاننا العثور على الخطأ.
00:09:46حسناً، الأمور لا تعمل، ولكن لو كان الوضع مثالياً، لتم إنشاء ملف llms.txt وتحميله إلى حساب HubSpot الخاص بك باستخدام وظيفة Vercel بدون خادم التي أنشأتها.
00:10:04لذا الآن سأمرر الكلمة لبقية زملائي للحديث عن كيفية استخدامنا لـ HubSpot بطرق أخرى، ليس فقط جلب Vercel كواجهة خلفية لـ HubSpot، ولكن أيضاً لأشياء مختلفة نقوم بها.
00:10:18لذا سأمرر الكلمة إلى كريس.
00:10:20شكراً لك.
00:10:22أحد الأشياء التي أحبها في العروض التوضيحية التي لا تعمل بشكل مثالي 100% هو أنها تسمح لنا بالتأكيد بالتعاطف مع جميع المطورين الذين يشاهدون ومجتمعنا وما إلى ذلك.
00:10:37إذا أمكننا العودة إلى الشرائح بسرعة على جهاز بروك.
00:10:43مثالي.
00:10:44شكراً لك.
00:10:45لذا بالطبع، نود منكم جميعاً أن تأخذوا إبداعكم وأفكاركم وتجلبوها لعملاء HubSpot عبر تكامل باستخدام واجهات برمجة التطبيقات الخاصة بنا.
00:10:57ولكن كيف نستخدم Vercel أيضاً داخل DevRel للتجربة وإجراء اختبارات سريعة جداً وبناء نماذج أولية سريعة جداً حتى نتمكن من اختبار الأفكار التي لدينا كفريق وتقديمها لبقية المنظمة.
00:11:15لذا لدينا شيء يسمى DevRel Labs، وهو مجموعة من القواعد، ومجموعة من العمليات التي تنتشر عبر جميع علاقات المطورين، وتمنحنا فرصة لامتلاك طريقة قياسية للتجربة، وأخذ تلك التجارب، والتحقق من صحتها أو إبطالها كما يحدث أحياناً، ثم تخرجها.
00:11:39ربما يكون ذلك في المنتج أو في حل أكثر صقلاً بعد ذلك.
00:11:46وما سنتحدث عنه الآن هما تجربتان كنت أقودهما، ثم سننتقل إلى دينيس للحديث عن التجربة التي كان يعمل عليها.
00:11:58لكن كل هذه التجارب، لديها عملية واضحة وهدف واضح حولها.
00:12:03وإحدى هذه التجارب هي أننا، مثل العديد من المنظمات، لدينا مجتمع Slack للمطورين الخارجيين.
00:12:10هذا مكان للأشخاص الذين يبنون حلولاً فوق HubSpot حيث يمكنهم القدوم والمشاركة والتعلم ومساعدة بعضهم البعض.
00:12:21لأن أفضل مجتمع حقاً هو المجتمع الذي يتميز بالتفاعل بين الأقران.
00:12:27لذا فكرنا، ماذا يمكننا أن نفعل لتقديم الحلول والموارد بسرعة أكبر لأعضاء هذا المجتمع؟
00:12:38وإحدى الحلول الواضحة، وأنا متأكد من أنكم تفاعلتم مع العديد من روبوتات Slack، كانت بناء روبوت Slack.
00:12:45ولكن عندما فكرنا في روبوت Slack، لم يكن شيئاً أردنا أن يهيمن على المحادثة.
00:12:51أردنا أن يكون موجوداً للمشاركة.
00:12:53لذا يجب ألا يكون تدخلياً جداً.
00:12:57وأردنا أن يكون موجوداً لتقديم الموارد السريعة في الوقت الفعلي لمجتمعنا الخارجي.
00:13:05ولذلك قمنا ببنائه على Vercel.
00:13:08لأن ذلك يسمح لنا بإنشاء نموذج أولي بسرعة كبيرة، ثم تقييم جودته، ثم الانتقال من هناك لنقول، ماذا سنفعل بعد ذلك بهذا؟
00:13:21وحالياً، نحن في مرحلة التجريب والتحقق.
00:13:25لذا بالتعاون مع بقية فريق مجتمعنا في DevRel، سنقرر إلى أين سيذهب بعد ذلك.
00:13:31لذا أردت أن أعرض بسرعة على شاشتي، الروبوتات، وما ترونه هنا لدينا، أنا في الواقع أحب هذه الشاشة الرئيسية لأنها ممتعة، كما تعلمون، الرسوم البيانية والمخططات والأرقام دائماً ممتعة حقاً.
00:13:45لكن لدينا شاشة بسيطة تمنحنا بعض البيانات حول تبني الروبوت.
00:13:51ولكن هناك طريقتان للتفاعل مع الروبوت.
00:13:53يمكنني القيام بذلك عبر رسالة مباشرة، أو لدينا بعض القنوات حيث سيستجيب الروبوت تلقائياً للأسئلة المتعلقة بالدعم.
00:14:01لذا سأقوم بتقديم سؤال ببساطة شديدة، كيف أبدأ مع HubSpot Dev MCP.
00:14:08وما أردت إظهاره، لأنني مقيد قليلاً فيما يمكنني عرضه فعلياً من الواجهة الخلفية لدينا، هو التسجيل في الوقت الفعلي الذي نحصل عليه من هذا في Vercel.
00:14:19لذا هذا يسمح لي، سأقول إن هذا هنا هو على الأرجح الدردشة في الوقت الفعلي التي أرسلتها للتو.
00:14:33وقد حدث ذلك بسرعة، وهذا خبر جيد.
00:14:35يتغير بسرعة إلى رسالة تفكير.
00:14:39يذهب إلى OpenAI للحصول على استجابة.
00:14:43يعود عبر أداة لمعرفة ما إذا كانت هناك موارد إضافية منسقة بواسطة فريق DevRel، والتي قد أقدمها لهذا المستخدم لمساعدته على المضي قدماً.
00:14:53يمكن أن يكون ذلك يوتيوب، أو وثائق، أو جميع أنواع الموارد.
00:14:58وبعد ذلك سيعطي استجابة.
00:15:00لذا أعتقد أن هذه هي الاستجابة، إنها كذلك.
00:15:06لذا الآن إذا عدت إلى هذا، ونرى أن كل شيء 200.
00:15:10إذن هذا هو أفضل سيناريو، أليس كذلك؟
00:15:13وقد فعل.
00:15:14لذا لم يكتفِ بإعطائي رداً، بل أعطاني مقالات لأطلع عليها.
00:15:21أخبرني بالانضمام إلى Dev Slack، أنا هنا بالفعل.
00:15:24لكنه أعطاني أيضاً دروساً تعليمية ومعلومات أخرى يوصي بها والتي قد تكون ذات صلة بالسؤال الذي كنت أطرحه هنا.
00:15:35وأعطاني الإجابة الصحيحة، وهي إعداد بيئة التطوير الخاصة بك، وتثبيت CLI، وتثبيت خادم MCP، وأنت جاهز للانطلاق.
00:15:43بل وقدم بعض الأفكار حول كيفية البدء.
00:15:47وكما ترون، كانت هذه طريقة بسيطة جداً لنا لبناء الاختبارات، والسجلات مهمة جداً هنا.
00:15:56اختبار حل باستخدام روبوت Slack مخصص، حيث إن مسؤوليتنا الأساسية في DevRel ليست بناء الحلول، فنحن جميعاً مطورون، لكننا لا نبني يومياً.
00:16:09لذا، أي شيء نبنيه يجب أن يكون سلساً جداً ولا يعيق طريقنا.
00:16:15الآن، هذا أعدنا لشيء فاجأني نوعاً ما.
00:16:18إذا عدنا إلى الشرائح، سأتحدث إليكم كيف أدى هذا إلى تجربة أخرى.
00:16:27عذراً، قبل ذلك، يمكنك العودة يا بروك إلى الشريحة التي تحتوي على...
00:16:35لذا أردت أولاً أن أقول، ما هي الأشياء في Vercel التي أثارت حماسي حقاً؟
00:16:39أولاً، سجلات سهلة القراءة، كما أظهرت، وقد قمت بتعيينها للبث المباشر.
00:16:43لذا رأيتم تدفق السجل في الوقت الفعلي.
00:16:46البدايات، نحن نتعامل مع بيئة بدون خادم.
00:16:49كانت البدايات سريعة بشكل مدهش.
00:16:52هذا مهم لـ Slack.
00:16:53إذا سبق لك بناء تكامل Slack أو أي أداة طرف ثالث أخرى تتكامل معها، وهي أيضاً بدون خادم، فأنت تريد بدايات سريعة.
00:17:02وفي كل مستوى داخل Vercel، هناك بدايات سريعة.
00:17:06أحب واجهة سطر الأوامر (CLI) لقدرتها على النشر قبل الالتزام أو إجراء طلب سحب للتأكد من أنني إذا وضعت أي نوع من الأكواد غير الجيدة هناك، يمكنني اكتشاف المشكلات بشكل أسرع قبل النشر، وبالطبع، النشر إلى بيئات مختلفة.
00:17:22وأيضاً، مثلما لدينا سوق، لديهم اتصالات بخدمات مثل Neon وUpstash لـ Redis وPostgres، مما يجعل من السهل جداً تشغيل قاعدة بيانات خلفية بسرعة كبيرة.
00:17:35وكان ذلك مهماً.
00:17:37بالحديث عن قاعدة البيانات الخلفية، هذا ما أدى إلى ما سيأتي لاحقاً.
00:17:41لذا لدينا كل هذه التفاعلات الآن في Dev Slack الخاص بنا.
00:17:48وقد تبين أنها مصدر غني جداً للمعلومات.
00:17:52من الواضح أننا يمكننا استنتاج ذلك.
00:17:54ولكن أحد الأشياء التي فاجأتني هو إدراكي أنني ربما أستطيع إنشاء واجهة أمامية أخرى لهذه البيانات، بحيث يمكننا استخدامها للعودة إلى ما قالته بروك سابقاً لتثقيف وإعلام عملية التغذية الراجعة لدينا، وكيف نتلقى المعلومات، وكيف نأخذ تلك المعلومات مرة أخرى إلى المنتج لتحسين تجربة المطور.
00:18:18وهكذا انتقلنا من بناء روبوت Slack إلى التحول فجأة إلى V0 في مشروع جديد، وأخذ تلك البيانات، وإنشاء واجهة أمامية بسيطة جداً محمية بكلمة مرور لعرض ما هي الأشياء التي يطرح الناس أسئلة عنها؟
00:18:37ما هي أنواع الموارد التي نعرضها؟
00:18:40لذا نحصل على الكثير من المحادثات حول webhooks، ونحصل على الكثير من المحادثات حول المصادقة.
00:18:46لقد سمح لنا ذلك بإظهار تأثير التجارب التي كنا نقوم بها، وهو أمر رائع حقاً لأننا يجب أن نأخذ روبوت Slack هذا إلى مكان ما.
00:18:57لم نرد فقط بناءه وتركه.
00:18:59علينا أن نأخذه إلى الخطوة التالية.
00:19:01وأفضل طريقة للقيام بذلك إذا كنت قد حضرت اجتماعات مع أي شخص في القيادة هي عرض رسم بياني أو تقديم عرض تقديمي هناك.
00:19:10وهذا سيساعدنا على اتخاذ القرارات مع فريق المجتمع داخل DevRel لنقول، ماذا سنفعل؟
00:19:18هل سنحتفظ به؟
00:19:19هل سنطوره؟
00:19:21إذا طورناه، فستتغير البنية التحتية في الواجهة الخلفية للروبوت.
00:19:28ولكن لم تكن هناك طريقة أفضل لنا للبدء من بنائه في منصة سهلة الاستخدام مثل Vercel، مع بعض التصورات، والآن يمكننا أن نقرر ما يجب فعله بعد ذلك.
00:19:43لذا الآن سنلقي نظرة على ما بناه دينيس، وهو أكثر تقدماً مما بنيته وأجرؤ على القول إنه أفضل، ولكنه أيضاً تجربة أخرى داخل DevRel Labs.
00:19:55لذا، دينيس، حان دورك.
00:19:57شكراً لك يا كريس.
00:19:59وشكراً لك لقولك إنه أفضل.
00:20:01يا إلهي، أتمنى أن يكون الجميع يستمع إلى ذلك.
00:20:04لذا قبل العمل في HubSpot، عملت في وكالة.
00:20:08وعندما أخبرني كريس عن هذه الأمور التي نقوم بها في DevRel Labs، واجهت مشكلة محددة جداً في الوكالة، وهي أنني كنت أبني شيئاً، واحداً من هذه الأشياء الثلاثة.
00:20:21إما أن أبني شيئاً، وأنهي منه، ويكون في وضع الصيانة نوعاً ما.
00:20:24أنا فقط أراقبه من حين لآخر.
00:20:25كان يتعطل لاحقاً لأنني فاتني شيء يحدث في نظام HubSpot البيئي.
00:20:31أو ورثت مجموعة كاملة من المشاريع، ولم يكن لدي أي فكرة عما كانت تفعله.
00:20:37وهكذا في النهاية كان أحدها سيواجه نوعاً من التغيير الجذري ويتعطل، وكان علي أن أكتشف أين ولماذا وكيف.
00:20:44والشيء الأخير، وربما هذا هو الأكبر بالنسبة لي، هو أن هناك الكثير من الأشياء اللعينة التي يجب الانتباه إليها، وغالباً ما كنت أفقد تتبع ما أفعله.
00:20:52لا أنتبه لأي من سجلات التغيير، ويحدث عطل.
00:20:56وخمنوا ماذا؟
00:20:57لديك عملاء يصرخون عليك في تلك المرحلة.
00:20:59لذا ما قررته هو أنني سأبني الشريحة التالية: أداة مراقبة سجل تغييرات مطوري HubSpot، والمعروفة أيضاً بالاسم الرمزي Sprocky change dust.
00:21:10ما تفعله هذه الأداة هو أنها تراقب بنشاط سجل تغييرات HubSpot الذي يستخدم الذكاء الاصطناعي للنظر في إدخالات سجل التغيير هذه، وتحديد نوع التغيير.
00:21:19هل هو تغيير جذري؟
00:21:21هل هو تحسين؟
00:21:22هل يؤثر على نظام إدارة المحتوى (CMS)؟
00:21:23هل يؤثر على نظام إدارة علاقات العملاء (CRM)؟
00:21:24هل يؤثر على كليهما؟
00:21:26ثم يسمح لك باستخدام مستودعات GitHub المستضافة للتحقق من سجلات التغيير هذه مقابل المستودع الخاص بك، مما يتيح لك أساساً وجود مساعد ينظر في سجل التغيير نيابة عنك.
00:21:39فكيف فعلنا ذلك؟
00:21:40مجموعة الأدوات التي استخدمناها هنا ستكون إطار عمل React مبني باستخدام Vercel، وبالطبع next.js، لأنه، كما تعلمون، زبدة الفول السوداني والمربى، Superbase لقاعدة بياناتنا، ثم كان علينا بناء تطبيق GitHub يسمح لنا بالاتصال بتلك المستودعات هناك.
00:21:56وبعد ذلك، من خلال بعض وظائف بدون خادم على Vercel وOpenAI، تمكنت من استعادة بعض البيانات عالية الجودة حقاً للمستخدم ليتصرف بناءً عليها.
00:22:06لماذا اخترت Vercel؟
00:22:07بصراحة، إنه سهل جداً جداً للإعداد.
00:22:11لم أضطر للقلق كثيراً بشأن الواجهة الأمامية.
00:22:13كان لدي تطبيق يعمل في أقل من نصف ساعة بسهولة.
00:22:18باستخدام الوظائف بدون خادم، تمكنت حقاً من تقليل تكلفة تشغيل هذا الخادم.
00:22:23إنه يعمل فقط عندما أحتاجه.
00:22:25أرسل هذه قوائم الانتظار الدفعية إلى OpenAI للقيام بذلك، ويعيدها بسرعة.
00:22:31وفرت الكثير من المال بفعل ذلك.
00:22:32وأيضاً مجرد حقيقة أنه يمكنني الاختبار بنفسي ثم النمو إلى آلاف الأشخاص الذين يستخدمون هذا التطبيق، Vercel موجودة هناك، تتوسع معي.
00:22:42عملية كل شيء كانت رائعة.
00:22:44لذا بالانتقال إلى الشريحة التالية، يمكنكم رؤية هذه هي الواجهة الأمامية التي بنيتها باستخدام Next.js.
00:22:50سترون أننا نجلب جميع إدخالات سجل التغييرات لدينا.
00:22:53هنا، يمكنك رؤية وصف لسجل التغييرات هذا.
00:22:57إذا كنت تعرف هنا الآن، يمكنك بالفعل إنشاء مشكلة لمستودع GitHub معين قمت بإرفاقه، مما يقودنا إلى الشريحة التالية، يجب علينا ربطه بـ GitHub.
00:23:07هذا يسمح لك بربط أي عدد تريده من المستودعات.
00:23:11في الفحص الأول، سيقوم بإجراء فحص برمجي فقط ليرى ما إذا كان يعتقد أنه ذو صلة بـ HubSpot.
00:23:18تذكر، ربما تكون قد ورثت مستودعات، مثل 50 مستودعاً.
00:23:22ليس لديك أي فكرة عما تفعله.
00:23:23تلقيها هنا.
00:23:24سيقوم بإجراء فحص أولي.
00:23:26سيجد أي شيء، أنماط ملفات يمكنه العثور عليها ليقول، أوه نعم، هذا قد يكون مرتبطاً بـ HubSpot، وعند هذه النقطة يمكنك الانتقال إلى الشريحة التالية وسترى أنه يمكنك النقر على زر HubSpot هناك، مما يعني أنه سيرسله إلى OpenAI في دفعة.
00:23:42سيقوم بالمراقبة، ويستخدم نظام RAG لإرسال التفاصيل المهمة فقط التي يعتقد أنها مرتبطة بمستودعك وHubSpot.
00:23:49سيستغرق الأمر بعض الوقت، وبمجرد الانتهاء، سيعود ويعرض لك جميع النتائج المحتملة.
00:23:56ستتلقى بريداً إلكترونياً للإشعار، وأنا أعمل على إشعار Slack أيضاً، يقول لك، يا صديقي، من الأفضل أن تتحقق من هذا.
00:24:03ثم لديك الخيار إما أن تقول، حسناً، هذا مشروع، سأقوم بإنشاء مشكلة حوله وسنبدأ العمل عليه، أو يمكنني تجاهله لأنه لا يتعلق بهذا حقاً.
00:24:12بمجرد تجاهله، نحن أذكياء بما يكفي للبدء في إدراك، حسناً، قد لا يكون هذا ما نريد مراقبته لهذا المستودع المحدد، لذا سنقوم بتحديث رسم بياني الاستخدام.
00:24:23بعد ذلك، سنقوم بمراقبة كل مستودع بشكل مستمر، لذا إذا كنت تجري تغييرات على أي من المستودعات، فنحن نراقب ذلك.
00:24:32إذا قمت بتغيير كبير، فسنقوم بإعادة فحص جميع سجلات التغيير مقابل هذا التغيير الجديد الذي أضفته للتأكد من أنك لم تفعل شيئاً لم تكن تعلم أنه يمثل مشكلة.
00:24:43كما يسمح لنا بالمضي قدماً ونسيت ما كنت سأقوله.
00:24:50يسمح لنا بالتحقق كلما جاء سجل تغيير جديد، ويسمح لنا بالمضي قدماً وتصفح كل مستودع متصل لديك لمعرفة ما إذا كان سجل التغيير هذا خاصاً بك.
00:25:01هذا يسمح لك بعدم الاضطرار إلى الاعتماد على عينيك للذهاب إلى سجل التغيير ومعرفة ما إذا كان هذا مرتبطاً بك أم لا.
00:25:08يسمح لسجل التغيير بالوصول إليك في صندوق الوارد الخاص بك ويمكنك اتخاذ الإجراء بشأنه حسب حاجتك.
00:25:14مع ذلك، أعتقد أننا وصلنا إلى وقت الأسئلة والأجوبة.
00:25:17لقد حاولت الإسراع في ذلك بأقصى سرعة ممكنة حتى نتمكن من طرح بعض الأسئلة والأجوبة إذا لزم الأمر.
00:25:22لقد قمت بعمل جيد يا دينيس.
00:25:23نعم، عمل رائع يا دينيس.
00:25:25سريع جداً.
00:25:26سريع جداً.
00:25:27حسناً، لدينا بضع دقائق هنا.
00:25:31لذا لدي سؤال للبدء.
00:25:34أعلم أننا رأينا اليوم أن العروض التوضيحية لا تسير دائماً بشكل مثالي عندما تكون مباشرة.
00:25:39وبينما تجعل Vercel الأمور سهلة للناس، هناك دائماً شيء يمكننا القيام به بشكل أفضل.
00:25:45لا أحد مثالي.
00:25:46لذا هل لديكم أي طلبات ميزات تودون مني مشاركتها مع فريق الهندسة؟
00:25:51هل هناك أي شيء تودون رؤيته مختلفاً أو مفقوداً تماماً؟
00:25:55لا أعرف عن المفقود بعد.
00:26:00لكن بصراحة، هناك بعض الميزات التي أطلقتموها مؤخراً، تمديد وقت عمل وظيفة بدون خادم، على ما أعتقد.
00:26:07لا أتذكر اسمها الذي أطلقتموه للتو والذي أنا مهتم به جداً لأنه عندما أعمل مع OpenAI، قد يستغرق انتظار النتيجة وقتاً أطول من مدة وظيفة بدون خادم.
00:26:19كان لديكم اسم لها وأنا أعتذر، لكنني نسيته.
00:26:21لكنني متحمس جداً للبدء في استخدام ذلك، بالإضافة إلى حزمة تطوير الذكاء الاصطناعي (AI SDK) التي قدمتموها للتو أيضاً.
00:26:28هذه ليست طلبات ميزات، بل هي استمتاعي بالميزات التي تقدمونها.
00:26:34لدي واحدة أخرى.
00:26:35في الواقع، كنت أستخدم، نسيت اسم واجهة برمجة التطبيقات لعمليات النشر لأنني لم أكن، كان الأمر مزعجاً نوعاً ما الانتقال من تطبيق الواجهة الأمامية الذي بنيته إلى، هل كان النشر ناجحاً حتى؟
00:26:53لذا لديكم واجهة برمجة تطبيقات للحصول على حالة النشر.
00:26:56لذا لا يجب علي فعل ذلك.
00:26:58يمكنني الانتظار حتى يتم قراءتها قبل أن، لأنني في الواقع لا أريد النظر إلى الواجهة حتى تكون هناك مشكلة.
00:27:05وإذا كان لدي نشر فاشل، فهذه هي المشكلة الأكثر إحباطاً التي أواجهها على الإطلاق.
00:27:09ولكن بخلاف ذلك، وجود مشاريع متعددة وأعتقد أن بعض الواجهات، مثل هناك دائماً أماكن للتحسين من حيث التجربة، ولكن لم يكن هناك شيء واحد لاحظته.
00:27:23نعم، لدي مشكلة محتملة قد تكون من جانبي وليست من Vercel.
00:27:28لذا إذا كان طلب ميزة، فهذا رائع.
00:27:30إذا كان مني، كما تعلمون، فاللوم علي.
00:27:33لقد قمت بالكثير من الاختبارات محلياً بكل أغراضي والوظائف لا تتوقف محلياً.
00:27:38على الأقل لم يحدث ذلك معي.
00:27:40لذا كان كل شيء يبدو سلساً كالحرير، كما تعلمون، كان مذهلاً.
00:27:43كل شيء يسير على ما يرام.
00:27:44عمل على جهازي.
00:27:45نعم.
00:27:46عمل على جهازي.
00:27:47بالضبط.
00:27:48كلاسيكي.
00:27:49لذا إذا قمت بـ Vercel، وكما تعلمون، تتوقف الوظائف في النهاية، أنا، مرة أخرى، قد يكون هذا شيئاً خاصاً بي حيث أحتاج فقط إلى، كما تعلمون، وضع حاكم أساساً على وظائفي للسماح لها بالعمل لفترة زمنية معينة فقط.
00:28:04ولكن إذا كان بإمكان Vercel تقديم ذلك جاهزاً، فسيكون ذلك رائعاً جداً.
00:28:08إنه مثل وقت تشغيل أطول.
00:28:10نعم.
00:28:11لا، لا.
00:28:12مثل، حسناً، أعني، أوقات التشغيل مطابقة لما هي عليه في الإنتاج.
00:28:17محلياً.
00:28:18نعم.
00:28:19حسناً.
00:28:20نعم.
00:28:21لقد واجهت بعضاً من ذلك أيضاً.
00:28:22جيد أن أعرف.
00:28:23هل لديك أي شيء؟
00:28:24هذا رائع.
00:28:25أعلم.
00:28:26لقد مررت بذلك طوال حياتي، والضرب على ما بجانبي يساعدني على التذكر.
00:28:32ليس لدي أي طلبات محددة، لا، لكنني أردت فقط الإشارة إلى أنه إذا كنت جديداً على HubSpot، ولكن أعجبك ما رأيته وتريد تجربتنا.
00:28:43يمكنك دائماً الانضمام إلى قناة Slack للمطورين لدينا.
00:28:45تحدثنا عن ذلك ويمكنك أيضاً الذهاب والاطلاع على وثائق المطورين لدينا حتى تتمكن من تجربة بعض الأشياء بنفسك.
00:28:55بالتأكيد.
00:28:56رائع.
00:28:57دعنا نرى.
00:28:58لدي سؤال آخر أحب أن أطرحه وهو، أعلم أنكم غطيتم الكثير.
00:29:05لذا إذا كان هناك شيء رئيسي يمكن استخلاصه، أو أي أفضل ممارسة أو مجرد نصيحة أساسية تريدون التأكد من أن الناس يتذكرونها بعد هذا؟
00:29:14لدي واحدة ولم أتبعها وما زلت لا أتبعها وأنا غاضب من نفسي، أنا غاضب جداً من نفسي.
00:29:23استخدم البيئات وقم بإعدادها مبكراً.
00:29:27لا تحاول تعديلها لاحقاً لأن ذلك مؤلم جداً.
00:29:32لذا في وقت مبكر، وجود بيئتك، هذا شيء واحد مثل في الواجهة، من السهل جداً ربط متغيرات بيئتك ببيئة معينة.
00:29:43مثل إعداد البيئات، استخدمها مبكراً.
00:29:48لا تنتظر لأن القيام بذلك لاحقاً مؤلم جداً جداً.
00:29:51وأعلم أننا جميعاً نريد فقط بناء الوظائف ورؤيتها تعمل بأسرع وقت ممكن.
00:29:57لذا فإن وجود بيئة اختبار قد يكون مزعجاً نوعاً ما، ولكن نعم، هذا ما أوصي به.
00:30:03أنا أؤيد ذلك بشدة.
00:30:04كنت أتلقى خطأ وكنت أسأل المؤشر لماذا خطأي، لماذا لم يكن يعمل عندما كنت في بيئة التطوير الخاصة بي وكان ذلك لأنني لم أقم بتشغيل استخدام بيئتي، مفتاح سري بيئتي داخل بيئة التطوير الخاصة بي.
00:30:22لذا كان الأمر وكأنه لم يتمكن من العثور على المفتاح.
00:30:24لذا كان ذلك سخيفاً نوعاً ما.
00:30:26ولكن نعم، أرى هذا السؤال حول كيف تستخدمون الذكاء الاصطناعي في سير عملكم؟
00:30:30لذا بالنسبة لي تحديداً، أحب استخدام MCP المطور الخاص بنا.
00:30:35أعتقد أنه منتج جيد حقاً ونحن نحاول دائماً الحصول على ملاحظات حول كيفية جعل MCP المطور هذا أفضل لمطوري HubSpot.
00:30:43لكنني أحبه لأنه عندما أسأل المؤشر، مثل، أوه، أريد أن أفعل شيئاً.
00:30:48ما سيفعله هو أنه سيبحث في وثائقنا في الوقت الفعلي.
00:30:51لذا ستحصل دائماً على أحدث المعلومات.
00:30:55لن تكون المعلومات قديمة عندما تسأل MCP سؤالاً ويذهب لتشغيل هذا البحث عن الوثائق.
00:31:04إضافتي هي أن أكون، أستخدم الذكاء الاصطناعي بشك.
00:31:07أشك في كل ما يرسله إليّ لأنه غالباً، كما تعلمون، لا يزال غير مثالي.
00:31:12لا تفعل، إنه سهل جداً.
00:31:14إنه مثل الحلوى.
00:31:15كما تعلمون، يمكنك فقط الضغط على قبول، انطلق، انطلق، انطلق، انطلق، انطلق.
00:31:19أنت في عمق 17 التزاماً.
00:31:21ثم، كما تعلمون، هذا الالتزام الثالث سيحطم كل شيء في الواقع.
00:31:26لذا استخدم Vercel أو استخدم Vercel استخدم الذكاء الاصطناعي بطريقة، بطريقة متشككة.
00:31:31كن ناقداً جداً له.
00:31:33دائماً، دائماً، دائماً أنشئ فروعاً جديدة عندما تقوم بشيء جديد.
00:31:38وبهذه الطريقة يمكنك التخلص منه إذا لزم الأمر.
00:31:40استفد من Vercel وبيئة المعاينة الخاصة بها، كما تعلمون، للقيام بذلك ونعم، لا تعتمد عليها كثيراً.
00:31:50كلها نصائح جيدة.
00:31:51أعلم أن الوقت قد حان وأنكم جميعاً مشغولون جداً وربما لديكم أماكن لتذهبوا إليها بعد هذا مباشرة.
00:31:58لذا شكراً جزيلاً لكم على تخصيص وقتكم.
00:32:00سأدعكم تذهبون حتى تتمكنوا من العودة إلى يومكم.
00:32:03أقدر ذلك.
00:32:04شكراً لكم.
00:32:05شكراً لـ Vercel ولكل من حضر.
00:32:09رائع.
00:32:11مجرد تذكير سريع.
00:32:12لدينا جلسة أخرى الأسبوع المقبل.
00:32:14سنتحدث عن بايثون في Vercel.
00:32:18ويمكنكم دائماً التحقق من تقويم الفعاليات على community.vercel.com/events لرؤية كل ما هو قادم.
00:32:24شكراً لكم جميعاً.
00:32:25أتمنى لكم أسبوعاً جيداً.