Upload README.md with huggingface_hub

README.md

@@ -1,3 +1,10 @@
+# دليل شامل: الذكاء الاصطناعي المتقدم في Node.js و Shopify Hydrogen
+
+## المقدمة
+
+يقدم هذا الدليل الشامل رؤى عملية حول دمج تقنيات الذكاء الاصطناعي المتقدمة، بما في ذلك البحث الدلالي (Semantic Search) ونماذج اللغة الضخمة (LLMs)، في تطبيقات Node.js ومتاجر Shopify Hydrogen. يهدف هذا المرجع إلى تمكين المطورين من بناء تجارب تجارة إلكترونية أكثر ذكاءً وتخصيصًا، مما يعزز تفاعل العملاء ويزيد من الكفاءة التشغيلية.
+
+---
 
 ## دليل عملي: بناء محرك بحث دلالي (Semantic Search) باستخدام Node.js و Shopify Hydrogen
 
@@ -204,3 +211,150 @@ export function SemanticSearch() {
 [1] Hugging Face Inference API. [https://huggingface.co/docs/api-inference/index](https://huggingface.co/docs/api-inference/index)
 [2] Shopify Hydrogen. [https://shopify.dev/custom-storefronts/hydrogen](https://shopify.dev/custom-storefronts/hydrogen)
 [3] `sentence-transformers/all-MiniLM-L6-v2` model. [https://huggingface.co/sentence-transformers/all-MiniLM-L6-v2](https://huggingface.co/sentence-transformers/all-MiniLM-L6-v2)
+
+---
+
+## دليل عملي: تكامل نماذج اللغة الضخمة (LLMs) مع Node.js و Shopify Hydrogen
+
+### المقدمة
+
+تُعد نماذج اللغة الضخمة (LLMs) مثل GPT-OSS-120B أدوات قوية لتوليد المحتوى، والإجابة على الأسئلة، وتحسين تجربة المستخدم. يوضح هذا الدليل كيفية دمج هذه النماذج مع تطبيقات Node.js، وخصوصًا في سياق متاجر Shopify Hydrogen، لإنشاء تجارب تسوق أكثر ذكاءً وتخصيصًا.
+
+### المكونات الأساسية
+
+1.  **نموذج اللغة الضخم (LLM):** مثل `openai/gpt-oss-120b` أو أي نموذج آخر متاح عبر API.
+2.  **Node.js Backend:** للتعامل مع استدعاءات API للنموذج، ومعالجة البيانات، وتوفير واجهات برمجة تطبيقات (APIs) للواجهة الأمامية.
+3.  **Shopify Hydrogen Frontend:** لدمج الميزات التي تعمل بالذكاء الاصطناعي في واجهة المستخدم، مثل أوصاف المنتجات التلقائية، أو روبوتات الدردشة، أو توصيات المنتجات.
+
+### الخطوات التنفيذية
+
+#### 1. الوصول إلى نموذج LLM
+
+معظم نماذج LLM الضخمة يتم الوصول إليها عبر واجهات برمجة تطبيقات (APIs). سنفترض استخدام Hugging Face Inference API أو OpenAI API.
+
+```javascript
+// llmService.js
+import axios from 'axios';
+
+const HF_INFERENCE_API_URL = "https://api-inference.huggingface.co/models/openai/gpt-oss-120b";
+const HF_TOKEN = process.env.HF_TOKEN; // أو OPENAI_API_KEY
+
+async function generateText(prompt, maxTokens = 100) {
+    try {
+        const response = await axios.post(
+            HF_INFERENCE_API_URL,
+            { inputs: prompt, parameters: { max_new_tokens: maxTokens } },
+            {
+                headers: {
+                    Authorization: `Bearer ${HF_TOKEN}`,
+                },
+            }
+        );
+        return response.data[0].generated_text;
+    } catch (error) {
+        console.error("Error generating text:", error.response ? error.response.data : error.message);
+        throw error;
+    }
+}
+
+export { generateText };
+```
+
+#### 2. بناء واجهة خلفية (Backend) في Node.js
+
+يمكنك إنشاء نقطة نهاية (API Endpoint) في Node.js تستدعي خدمة LLM وتوفر المحتوى المولّد للواجهة الأمامية.
+
+```javascript
+// api/llm.js (مثال باستخدام Express)
+import express from 'express';
+import { generateText } from '../llmService.js';
+
+const app = express();
+app.use(express.json());
+
+app.post('/generate-product-description', async (req, res) => {
+    const { productName, keywords } = req.body;
+    if (!productName) {
+        return res.status(400).json({ error: 'Product name is required' });
+    }
+    const prompt = `اكتب وصفًا جذابًا للمنتج التالي: ${productName}. الكلمات المفتاحية: ${keywords || ''}.`;
+    try {
+        const description = await generateText(prompt, 150);
+        res.json({ description });
+    } catch (error) {
+        res.status(500).json({ error: 'Failed to generate description' });
+    }
+});
+
+app.listen(3002, () => console.log('LLM Integration API running on port 3002'));
+```
+
+#### 3. دمج LLM في Shopify Hydrogen
+
+يمكن لمكونات Hydrogen استدعاء نقطة النهاية الخلفية (Backend Endpoint) لتوليد المحتوى ديناميكيًا.
+
+```jsx
+// components/ProductDescriptionGenerator.jsx (مثال في Hydrogen)
+import React, { useState } from 'react';
+
+export function ProductDescriptionGenerator({ productId, initialDescription }) {
+  const [description, setDescription] = useState(initialDescription);
+  const [loading, setLoading] = useState(false);
+  const [productName, setProductName] = useState('');
+  const [keywords, setKeywords] = useState('');
+
+  const handleGenerateDescription = async () => {
+    setLoading(true);
+    try {
+      const response = await fetch('http://localhost:3002/generate-product-description', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ productName, keywords }),
+      });
+      const data = await response.json();
+      setDescription(data.description);
+    } catch (error) {
+      console.error('Error generating product description:', error);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div>
+      <h2>توليد وصف المنتج بالذكاء الاصطناعي</h2>
+      <input
+        type="text"
+        value={productName}
+        onChange={(e) => setProductName(e.target.value)}
+        placeholder="اسم المنتج"
+      />
+      <input
+        type="text"
+        value={keywords}
+        onChange={(e) => setKeywords(e.target.value)}
+        placeholder="كلمات مفتاحية (اختياري)"
+      />
+      <button onClick={handleGenerateDescription} disabled={loading}>
+        {loading ? 'جاري التوليد...' : 'توليد الوصف'}
+      </button>
+      {description && (
+        <div>
+          <h3>الوصف المولّد:</h3>
+          <p>{description}</p>
+        </div>
+      )}
+    </div>
+  );
+}
+```
+
+### الخلاصة
+
+من خلال دمج نماذج اللغة الضخمة مع Node.js و Shopify Hydrogen، يمكن للمتاجر الإلكترونية تقديم تجارب مخصصة وديناميكية للعملاء، بدءًا من توليد أوصاف المنتجات وحتى توفير مساعدين افتراضيين. هذا يفتح آفاقًا جديدة للابتكار في التجارة الإلكترونية.
+
+### المراجع
+
+[1] Hugging Face Inference API. [https://huggingface.co/docs/api-inference/index](https://huggingface.co/docs/api-inference/index)
+[2] Shopify Hydrogen. [https://shopify.dev/custom-storefronts/hydrogen](https://shopify.dev/custom-storefronts/hydrogen)
+[3] `openai/gpt-oss-120b` model. [https://huggingface.co/openai/gpt-oss-120b](https://huggingface.co/openai/gpt-oss-120b)