@intlayer/docs 5.5.10 → 5.5.12

package/blog/ar/index.md

@@ -0,0 +1,69 @@
+---
+createdAt: 2024-24-12
+updatedAt: 2025-06-29
+title: مدونة
+description: اكتشف جميع المواضيع ذات صلة مع Intlayer، التدويل الدولي وغيرها
+keywords:
+  - Intlayer
+  - التدويل
+  - التوثيق
+  - Next.js
+  - JavaScript
+  - React
+slugs:
+  - blog
+  - search
+---
+
+# احتضان أنظمة التدويل في JavaScript: تعزيز الوصول العالمي وتحسين محركات البحث
+
+مرحبًا بك في مدونتنا المخصصة لكل ما يتعلق بـ **التدويل** لتطبيقات JavaScript! هنا، نستكشف أفضل الممارسات والاستراتيجيات والأدوات لمساعدة المطورين في توسيع منتجاتهم الرقمية عبر العالم.
+
+---
+
+## لماذا يعتبر التدويل (i18n) مهمًا
+
+في عالم اليوم المتصل، يتوقع المستخدمون تجارب محلية سلسة. يضمن التدويل (i18n) أن تطبيق الويب الخاص بك يمكنه التكيف مع لغات مختلفة وفروق ثقافية. من خلال دمج ممارسات i18n من البداية، يمكنك فتح العديد من الفوائد، مثل:
+
+1. **تحسين تجربة المستخدم:** يشعر المستخدمون براحة أكبر عند التفاعل مع المحتوى بلغتهم الأم.
+2. **توسيع نطاق السوق:** يساعد تقديم لغات متعددة على الوصول إلى مناطق جديدة وزيادة قاعدة المستخدمين.
+3. **تحسين الوصول:** غالباً ما يتماشى هيكل i18n الجيد مع معايير الوصول، مما يجعل تطبيقك أكثر شمولية.
+4. **أداء أفضل لمحركات البحث:** يمكن أن يعزز المحتوى المحلي رؤيتك في نتائج البحث المحددة حسب المنطقة.
+
+---
+
+## حلول التدويل مفتوحة المصدر
+
+لا يجب أن يكون بناء تطبيق دولي معقدًا. يوفر المجتمع مفتوح المصدر العديد من الأدوات والمكتبات القوية والمُدعمة بشكل جيد التي تجعل التوطين أكثر بساطة. الحلول الشائعة مثل **react-intl** و **i18next** و **FormatJS** تقدم واجهات برمجة تطبيقات مرنة ودمج سهل مع أطر JavaScript الحديثة مثل React و Vue و Angular.
+
+### الفوائد الرئيسية للحلول مفتوحة المصدر
+
+- **المرونة:** تتطور المكتبات المدفوعة من المجتمع بسرعة، مما يوفر تحديثات وميزات جديدة حسب الحاجة.
+- **توفير التكاليف:** لا توجد رسوم ترخيص، مما يجعل من السهل اختبار أو توسيع تطبيقك.
+- **دعم المجتمع:** غالباً ما تعني المجتمعات الكبيرة المزيد من الدروس التعليمية والتوثيق والمكونات الإضافية الجاهزة.
+
+---
+
+## الإعلانات وما هو قادم
+
+نحن متحمسون للإعلان عن دروس قادمة، وأفضل الممارسات، و **دراسات الحالة** حول كيفية تحسين تطبيقات JavaScript الخاصة بك للجماهير العالمية. إليك لمحة سريعة:
+
+- **نصائح متقدمة للتوطين:** إتقان التعدد، وتنسيق التاريخ/الوقت، والمحتوى الديناميكي.
+- **تحسينات الأداء:** تقليل أحجام الحزم مع دعم لغات متعددة.
+- **دراسات حالة من المجتمع:** عرض أمثلة من العالم الحقيقي لتطبيقات i18n الناجحة.
+
+تابعونا للحصول على هذه التحديثات والمزيد!
+
+---
+
+## ساهم في مدونتنا!
+
+نحن نؤمن بمشاركة المعرفة المستندة إلى المجتمع. إذا كانت لديك فكرة رائعة لمقال مدونة تتعلق بالتدويل، أو **تحسين محركات البحث**، أو أي موضوع ذي صلة آخر، نحب أن نسمع منك. يمكنك تقديم طلب سحب من خلال إضافة مقالك المقترح إلى مستودع GitHub الخاص بنا:
+
+[**قدّم مقالك هنا**](https://github.com/aymericzip/intlayer/blob/main/docs/blog)
+
+تساعد مساهماتك في إثراء هذه المنصة وتمكين المطورين في جميع أنحاء العالم. دعونا نبني مجتمعًا من التطبيقات العالمية أولاً, معًا.
+
+---
+
+**شكرًا لقراءة، ومرحبا بك في مجتمعنا الخاص بالتدويل!** تابعونا للحصول على المزيد من الرؤى والنصائح وأفضل الممارسات حول كيفية تحقيق النجاح الدولي لتطبيقات JavaScript الخاصة بك.

package/blog/ar/internationalization_and_SEO.md

@@ -0,0 +1,314 @@
+---
+createdAt: 2024-12-24
+updatedAt: 2025-06-29
+title: SEO و التدويل
+description: تعرّف على كيفية تحسين موقعك متعدد اللغات لمحركات البحث وتحسين SEO.
+keywords:
+  - SEO
+  - Intlayer
+  - التدويل
+  - التوثيق
+  - Next.js
+  - JavaScript
+  - React
+slugs:
+  - blog
+  - SEO-and-i18n
+---
+
+# SEO & I18n: الدليل الشامل لجعل موقع الويب الخاص بك متعدد اللغات
+
+هل تريد الوصول إلى المزيد من المستخدمين في جميع أنحاء العالم؟ إن جعل موقع الويب الخاص بك متعدد اللغات هو واحد من أفضل الطرق لتوسيع جمهورك وتحسين محركات البحث الخاصة بك (تحسين محركات البحث). في هذه التدوينة، سنقوم بشرح أساسيات تحسين محركات البحث الدولية - التي يُشار إليها غالبًا باسم **i18n** (اختصارًا لـ "الدولية") - بعبارات واضحة ومفهومة. ستتعلم عن القرارات الرئيسية التي تحتاج إلى اتخاذها، وكيفية استخدام العناصر التقنية مثل `hreflang`، ولماذا يمكن أن تسهل أدوات مثل **Intlayer** مشاريعك متعددة اللغات في Next.js.
+
+---
+
+## 1. ماذا يعني جعل موقع الويب الخاص بك متعدد اللغات؟
+
+موقع الويب متعدد اللغات يقدم محتواه بأكثر من لغة واحدة. على سبيل المثال، قد يكون لديك نسخة باللغة الإنجليزية (`example.com/en/`)، ونسخة باللغة الفرنسية (`example.com/fr/`)، ونسخة باللغة الإسبانية (`example.com/es/`). تسمح هذه الطريقة لمحركات البحث بعرض النسخة الصحيحة بلغة معينة للمستخدمين بناءً على تفضيلاتهم أو مواقعهم الجغرافية.
+
+عندما تقوم بذلك بشكل صحيح، ستخلق تجربة أكثر ملاءمة للمستخدمين غير الناطقين باللغة الإنجليزية - مما يؤدي إلى تحسين التفاعل، وزيادة معدلات التحويل، وتحسين محركات البحث في مناطق مختلفة.
+
+---
+
+## 2. اختيار هيكل عنوان URL الصحيح
+
+إذا قررت أن يكون لديك نسخ متعددة للغة، ستحتاج إلى وسيلة واضحة ومتسقة لتنظيم عناوين URL الخاصة بموقعك. يجب أن يكون لكل لغة (أو منطقة) "عنوان" فريد خاص بها على الإنترنت. وفيما يلي ثلاث طرق شائعة لهيكلة المواقع متعددة اللغات:
+
+1. **نطاقات المستوى العلوي برمز الدولة (ccTLDs)**
+
+   - مثال: `example.fr`، `example.de`
+   - **الإيجابيات:** ترسل إشارة قوية إلى محركات البحث حول البلد الذي يستهدفه المحتوى (مثل: `.fr` = فرنسا).
+   - **السلبيات:** إدارة مجالات متعددة قد تكون أكثر تكلفة وتعقيدًا.
+
+2. **النطاقات الفرعية**
+
+   - **مثال:** `fr.example.com`، `de.example.com`
+   - **الإيجابيات:** كل لغة "تعيش" على نطاق فرعي خاص بها، مما يجعل من السهل نسبيًا إضافة أو إزالة اللغات.
+   - **السلبيات:** أحيانًا تعالج محركات البحث النطاقات الفرعية كمواقع منفصلة، لذلك يمكن أن تُخفف من سلطة النطاق الرئيسي.
+
+3. **الدلائل الفرعية (المجلدات)**
+   - **مثال:** `example.com/fr/`، `example.com/de/`
+   - **الإيجابيات:** سهل الإدارة، وكل حركة المرور تشير إلى نطاق رئيسي واحد.
+   - **السلبيات:** ليست إشارة قوية لتحسين محركات البحث المحلية مثل ccTLDs (على الرغم من أنها فعالة إذا تم القيام بها بشكل صحيح).
+
+> **نصيحة:** إذا كان لديك علامة تجارية عالمية وترغب في تقليل التعقيدات، تعمل الدلائل الفرعية غالبًا بشكل أفضل. إذا كنت تستهدف دولة أو دولتين رئيسيتين فقط وترغب في إبراز كل منهما، فقد تكون ccTLDs هي الطريق المناسب.
+
+---
+
+## 3. إتقان استهداف اللغة مع Hreflang
+
+### 3.1. ما هو Hreflang؟
+
+عندما يكون لديك محتوى متطابق أو مشابه جدًا بلغات متعددة، يمكن أن تتشوش محركات البحث مثل Google بشأن أي نسخة يجب عرضها للمستخدم. **Hreflang** هو سمة HTML تُخبر محركات البحث باللغة (والمنطقة) التي يُقصد بها صفحة معينة، وما هي صفحات اللغة/المنطقة البديلة.
+
+### 3.2. لماذا هذا مهم؟
+
+1. يمنع مشاكل **المحتوى المكرر** (عندما تعتقد محركات البحث أنك تنشر نفس المحتوى عدة مرات).
+2. يضمن أن **المستخدمين الفرنسيين يرون النسخة الفرنسية**، و **المستخدمين الإسبانيين يرون النسخة الإسبانية**، وهكذا.
+3. يُحسن تجربة المستخدم العامة، مما يعني مزيدًا من التفاعل وترتيب أفضل لتحسين محركات البحث.
+
+### 3.3. كيفية استخدام Hreflang في علامة `<head>`
+
+في HTML الخاص بك، ستضيف شيئًا مثل:
+
+```html
+<link
+  rel="alternate"
+  hreflang="en"
+  href="https://github.com/aymericzip/intlayer/blob/main/docs/docs/ar/alternate/en"
+/>
+<link
+  rel="alternate"
+  hreflang="fr"
+  href="https://github.com/aymericzip/intlayer/blob/main/docs/docs/ar/alternate/fr"
+/>
+<link
+  rel="alternate"
+  hreflang="es"
+  href="https://github.com/aymericzip/intlayer/blob/main/docs/docs/ar/alternate/es"
+/>
+<link
+  rel="alternate"
+  hreflang="x-default"
+  href="https://github.com/aymericzip/intlayer/blob/main/docs/docs/ar/alternate/en"
+/>
+```
+
+- **`hreflang="en"`**: تشير إلى النسخة الإنجليزية من الصفحة.
+- **`hreflang="fr"`**: تشير إلى النسخة الفرنسية من الصفحة.
+- **`hreflang="es"`**: تشير إلى النسخة الإسبانية من الصفحة.
+- **`hreflang="x-default"`**: لغة "احتياطية" أو عنوان URL افتراضي عندما لا تتطابق أي من اللغات الأخرى مع تفضيلات المستخدم.
+
+> **ملاحظة سريعة:** تأكد من أن عناوين URL في هذه العلامات تشير مباشرة إلى الصفحة النهائية، مع **عدم** وجود أي إعادة توجيه إضافية.
+
+---
+
+## 4. جعل المحتوى "محليًا" حقًا (ليس مجرد ترجمة)
+
+### 4.1. التوطين مقابل الترجمة
+
+- **الترجمة** تعني تحويل النص من لغة إلى أخرى كلمة بكلمة.
+- **التوطين** يعني تكييف تنسيق المحتوى، والعملة، والقياسات، والمراجع الثقافية لجمهور محلي. على سبيل المثال، إذا كنت تستهدف فرنسا، ستستخدم `€` بدلاً من `You are an expert in internationalization and content management. Your task is to translate the following documentation into the specified locales.
+
+1. **Requirement:**
+
+   - You should only translate the text, and titles of the file.
+   - You should not alter the structure of the file.
+   - You should not alter the code logic of code elements.
+   - You should transform urls as `https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/**/*.md` to `https://github.com/aymericzip/intlayer/blob/main/docs/docs/ar/**/*.md`
+   - You should not transform url as `https://github.com/aymericzip/intlayer/blob/main/docs/assets/**/*`
+   - You should transform locale urls as `/**/*` to `/{{locale}}/**/*`
+   - In the code elements, the naming of the variables should be made in English. But the comments should be in العربية.
+   - You should return the translated file content without any additional comments or explanations.
+   - You should be sure to do not forgot to translate any content
+
+2. **Locales:**
+
+   - Base file locale: en: English (US)
+   - Desired Locales: {{locale}} : {{localeName}}
+
+**File to Translate:**
+
+, وقد تذكر التفاصيل المحلية المتعلقة بالعطلات أو الأمور الخاصة بالمنطقة.
+
+### 4.2. تجنب المحتوى المكرر
+
+حتى مع الترجمة الجيدة، يمكن أن ترفع محركات البحث إنذارات لموقعك بسبب المحتوى المكرر إذا كان يشبه هيكله بشكل كبير. يساعد Hreflang في توضيح أن هذه الصفحات ليست مكررة ولكنها مجرد إصدارات لغوية.
+
+---
+
+## 5. المتطلبات الأساسية لتحسين محركات البحث التقنية
+
+### 5.1. إعلانات اللغة (`lang` و`dir`)
+
+في علامة HTML الخاصة بك، يمكنك الإعلان عن اللغة بهذا الشكل:
+
+```html
+<html lang="en"></html>
+```
+
+- **`lang="en"`** يساعد المتصفحات والتقنيات المساعدة على فهم اللغة.
+
+للغات من اليمين إلى اليسار (مثل العربية أو العبرية)، أضف:
+
+```html
+<html dir="rtl" lang="ar"></html>
+```
+
+- **`dir="rtl"`** يضمن أن اتجاه النص يكون من اليمين إلى اليسار.
+
+### 5.2. العلامات الأساسية
+
+تخبر العلامات الأساسية محركات البحث أي صفحة هي النسخة "الأصلية" أو الرئيسية إذا كان لديك صفحات متطابقة تقريبًا. عادة، سيكون لديك **إشارة أساسية** تشير إلى النسخة الأساسية لمواقع متعددة اللغات.
+
+```html
+<link rel="canonical" href="https://example.com/fr/produits" />
+```
+
+---
+
+## 6. تحسين محركات البحث على الصفحات بلغات متعددة
+
+### 6.1. العناوين ووصف الميتا
+
+- **تمت ترجمته وتحسينه** لكل لغة.
+- أجرِ **بحثًا عن الكلمات الرئيسية** لكل سوق لأن ما يبحث عنه الناس باللغة الإنجليزية قد يختلف في الفرنسية أو الإسبانية.
+
+### 6.2. العناوين (H1، H2، H3)
+
+يجب أن تعكس العناوين العبارات أو **الكلمات الرئيسية** المحلية لكل منطقة. لا تقتصر على استخدام العنوان الإنجليزي الأصلي في Google Translate فقط وتعتبره نهائيًا.
+
+### 6.3. الصور ووسائط الإعلام
+
+- محليًا نصوص alt، والتعليقات التوضيحية، وأسماء الملفات إذا لزم الأمر.
+- استخدم الصور التي تتناغم مع الثقافة المستهدفة.
+
+---
+
+## 7. تغيير اللغة وتجربة المستخدم
+
+### 7.1. إعادة التوجيه التلقائي أو مُحدد اللغة؟
+
+- **إعادة التوجيه التلقائي** (استنادًا إلى IP أو إعدادات المتصفح) قد يكون مريحًا ولكن قد يرسل المسافرين أو مستخدمي VPN إلى النسخة الخاطئة.
+- **مستخدم اللغة** غالبًا ما يكون أكثر وضوحًا - يمكن للمستخدمين اختيار لغتهم الخاصة إذا كانت اللغة المحددة تلقائيًا غير صحيحة.
+
+إليك مثال مبسط لـ Next.js + Intlayer:
+
+```tsx
+import { useLocation, useNavigate } from "react-router-dom";
+import {
+  Locales,
+  getHTMLTextDir,
+  getLocaleName,
+  getLocalizedUrl,
+} from "intlayer";
+import { useLocale } from "react-intlayer";
+import { type FC } from "react";
+
+const LocaleSwitcher: FC = () => {
+  const location = useLocation(); // الحصول على مسار URL الحالي. مثال: /fr/about
+  const navigate = useNavigate();
+
+  const changeUrl = (locale: Locales) => {
+    // بناء URL مع اللغة المحدثة
+    // مثال: /es/about مع تعيين اللغة إلى الإسبانية
+    const pathWithLocale = getLocalizedUrl(location.pathname, locale);
+
+    // تحديث مسار URL
+    navigate(pathWithLocale);
+  };
+
+  const { locale, availableLocales, setLocale } = useLocale({
+    onLocaleChange: changeUrl,
+  });
+
+  return (
+    <ol>
+      {availableLocales.map((localeItem) => (
+        <li key={localeItem}>
+          <a
+            href={getLocalizedUrl(location.pathname, localeItem)}
+            hrefLang={locale === localeItem ? "x-default" : localeItem}
+            aria-current={locale === localeItem ? "page" : undefined}
+            onClick={(e) => {
+              e.preventDefault();
+              setLocale(localeItem);
+            }}
+          >
+            <span>
+              {/* لغة في لغتها الخاصة - على سبيل المثال: Français */}
+              {getLocaleName(localeItem, locale)}
+            </span>
+            <span dir={getHTMLTextDir(localeItem)} lang={localeItem}>
+              {/* لغة في اللغة الحالية - على سبيل المثال: Francés مع تعيين اللغة الحالية إلى Locales.SPANISH */}
+              {getLocaleName(localeItem)}
+            </span>
+            <span dir="ltr" lang={Locales.ENGLISH}>
+              {/* لغة باللغة الإنجليزية - على سبيل المثال: French */}
+              {getLocaleName(localeItem, Locales.ENGLISH)}
+            </span>
+            <span>
+              {/* لغة في لغتها الخاصة - على سبيل المثال: FR */}
+              {localeItem}
+            </span>
+          </a>
+        </li>
+      ))}
+    </ol>
+  );
+};
+```
+
+### 7.2. تخزين التفضيلات
+
+- احفظ خيار لغة المستخدم في **ملف تعريف الارتباط** أو **الجلسة**.
+- في المرة القادمة التي يزور فيها المستخدم موقعك، يمكنك تحميل لغته المفضلة تلقائيًا.
+
+---
+
+## 8. بناء روابط محلية
+
+تظل **الروابط الخلفية** (الروابط من المواقع الخارجية إلى موقعك) عاملاً مهمًا في تحسين محركات البحث. عندما تقوم بتشغيل موقع متعدد اللغات، فكر في:
+
+- الوصول إلى مواقع الأخبار المحلية، المدونات، أو المنتديات. على سبيل المثال، انقر على نطاق `.fr` الذي يشير إلى الدليل الفرعي الفرنسي يمكن أن يعزز تحسين محركات البحث المحلية الفرنسية.
+- مراقبة الروابط الخلفية لكل لغة لمعرفة المناطق التي تحتاج لمزيد من جهود العلاقات العامة/التسويق.
+
+---
+
+## 9. مراقبة وصيانة موقعك متعدد اللغات
+
+### 9.1. Google Analytics وSearch Console
+
+- قسم بياناتك حسب كل دليل لغة (`/en/`، `/fr/`، `/es/`).
+- ترقب **أخطاء الزحف**، **إشعارات المحتوى المكرر**، و**م Issues related to indexing** على أساس كل لغة.
+
+### 9.2. تحديثات محتوى منتظمة
+
+- حافظ على ترجمة العروض جديدة. إذا قمت بتغيير وصف منتج باللغة الإنجليزية، قم بتحديثه باللغة الفرنسية، الإسبانية، إلخ.
+- يمكن أن تكون الترجمات القديمة مربكة للعملاء وتؤثر على ثقتهم بالمستخدمين.
+
+---
+
+## 10. العقبات الشائعة التي يجب تجنبها
+
+1. **المحتوى المترجم آليًا**
+   الترجمة الآلية بدون مراجعة بشرية يمكن أن تكون مليئة بالأخطاء.
+
+2. **علامات `hreflang` غير الصحيحة أو المفقودة**
+   لا يمكن لمحركات البحث تحديد إصدارات اللغة من تلقاء نفسها إذا كانت علامتك غير مكتملة أو فيها رموز خاطئة.
+
+3. **تغيير اللغة فقط عبر JavaScript**
+   إذا لم تتمكن Google من الزحف إلى عناوين URL الفريدة لكل لغة، فقد لا تظهر صفحاتك في نتائج البحث المحلية الصحيحة.
+
+4. **تجاهل الفروق الثقافية**
+   قد تكون نكتة أو عبارة تعمل في دولة واحدة مسيئة أو بدون معنى في دولة أخرى.
+
+---
+
+## الخاتمة
+
+يتطلب جعل موقع الويب الخاص بك متعدد اللغات أكثر من مجرد ترجمة النص. إنها تتعلق بهيكلة عناوين URL بشكل فعال، واستخدام علامات `hreflang` لمساعدة محركات البحث في تقديم النسخة الصحيحة، وتوفير تجربة ممتازة للمستخدم - كاملة مع المرئيات المحلية، ومحددات اللغة، وتنقل متسق. ستمكنك اتباع هذه الممارسات الجيدة من النجاح في الأسواق العالمية، وتعزيز رضا المستخدمين، وفي النهاية، تقديم نتائج أفضل لتحسين محركات البحث عبر المناطق.
+
+إذا كنت تستخدم Next.js (خصوصًا App Router في Next.js 13+)، يمكن أن تساعد أداة مثل **Intlayer** في تبسيط هذه العملية بالكامل. تساعدك في كل شيء من إنشاء الخرائط الموقعة المحلية إلى التعامل تلقائيًا مع روابط `hreflang`، واكتشاف اللغة، والمزيد - حتى تتمكن من التركيز على صياغة محتوى متعدد اللغات عالي الجودة.
+
+**هل أنت جاهز للانتقال إلى العولمة؟** ابدأ في تنفيذ استراتيجيات تحسين محركات البحث وi18n هذه الآن، وراقب كيف يكتشف الزوار الجدد من جميع أنحاء العالم ويتفاعلون مع موقعك!

package/blog/ar/intlayer_with_i18next.md

@@ -0,0 +1,162 @@
+---
+createdAt: 2024-12-24
+updatedAt: 2025-06-29
+title: التدويل باستخدام Intlayer و i18next
+description: تعرّف على كيفية دمج Intlayer مع i18next لتحقيق أفضل تدويل. قارن بين الإطارين وتعلم كيفية تكوينهما معًا.
+keywords:
+  - Intlayer
+  - i18next
+  - التدويل
+  - i18n
+  - التوطين
+  - ترجمة
+  - React
+  - Next.js
+  - JavaScript
+  - TypeScript
+slugs:
+  - blog
+  - intlayer_with_i18next
+---
+
+# التدويل باستخدام Intlayer و i18next
+
+i18next هو إطار عمل مفتوح المصدر للتدويل (i18n) مصمم لتطبيقات JavaScript. ويستخدم على نطاق واسع لإدارة الترجمات، والتوطين، وتبديل اللغة في مشاريع البرمجيات. ومع ذلك، لديه بعض القيود التي يمكن أن تعقد القابلية للتوسع والتنمية.
+
+Intlayer هو إطار عمل آخر للتدويل يعالج هذه القيود، مما يوفر نهجًا أكثر مرونة لتصريح المحتوى وإدارته. دعونا نستعرض بعض الفروقات الرئيسية بين i18next و Intlayer، وكيفية تكوين كلاهما لتحقيق أفضل تدويل.
+
+## Intlayer مقابل i18next: الفروقات الرئيسية
+
+### 1. تصريح المحتوى
+
+مع i18next، يجب أن يتم التصريح عن قواميس الترجمات في مجلد محدد، مما يمكن أن يعقد من قابلية تطبيقك للتوسع. في المقابل، يتيح Intlayer التصريح عن المحتوى داخل نفس الدليل كما هو في المكون الخاص بك. وهذا له عدة مزايا:
+
+- **تحرير محتوى مبسط**: لا يحتاج المستخدمون للبحث عن القاموس الصحيح للتحرير، مما يقلل من فرصة حدوث أخطاء.
+- **التكيف التلقائي**: إذا تغير مكان المكون أو تم إزالته، يكتشف Intlayer ذلك ويتكيف تلقائيًا.
+
+### 2. تعقيد التكوين
+
+يمكن أن يكون تكوين i18next معقدًا، خاصة عند التكامل مع المكونات الجانبية للخادم أو تكوين middleware لإطارات العمل مثل Next.js. يبسط Intlayer هذه العملية، مما يوفر تكوينًا أكثر بساطة.
+
+### 3. اتساق قواميس الترجمات
+
+يمكن أن يكون ضمان اتساق قواميس الترجمات عبر لغات مختلفة تحديًا مع i18next. يمكن أن تؤدي هذه الفجوة إلى تعطل التطبيق إذا لم يتم التعامل معها بشكل صحيح. يعالج Intlayer هذا من خلال فرض قيود على المحتوى المترجم، مما يضمن عدم فقدان أي ترجمة وأن المحتوى المترجم دقيق.
+
+### 4. تكامل TypeScript
+
+يقدم Intlayer تكاملًا أفضل مع TypeScript، مما يسمح بالاقتراحات التلقائية للمحتوى في الكود الخاص بك، وبالتالي يعزز كفاءة التطوير.
+
+### 5. مشاركة المحتوى عبر التطبيقات
+
+يسهل Intlayer مشاركة ملفات تصريح المحتوى عبر تطبيقات متعددة ومكتبات مشتركة. تجعل هذه الميزة من السهل الحفاظ على ترجمات متسقة عبر قاعدة شفرة أكبر.
+
+## كيفية إنشاء قواميس i18next باستخدام Intlayer
+
+### تكوين Intlayer لتصدير قواميس i18next
+
+> ملاحظات مهمة
+
+> تصدير قواميس i18next حاليًا في النسخة التجريبية ولا يضمن توافق 1: 1 مع أطر العمل الأخرى. يُنصح بالالتزام بتكوين يعتمد على Intlayer لتقليل المشاكل.
+
+لتصدير قواميس i18next، تحتاج إلى تكوين Intlayer بشكل مناسب. فيما يلي مثال على كيفية إعداد Intlayer لتصدير كل من قواميس Intlayer و i18next.
+
+```typescript fileName="intlayer.config.ts" codeFormat="typescript"
+import { Locales, type IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  content: {
+    // الإشارة إلى أن Intlayer سيصدر كل من قواميس Intlayer و i18next
+    dictionaryOutput: ["intlayer", "i18next"],
+    // المسار النسبي من جذر المشروع إلى الدليل الذي ستصدر فيه قواميس i18n
+    i18nextResourcesDir: "./i18next/dictionaries",
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.mjs" codeFormat="esm"
+import { Locales } from "intlayer";
+
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  content: {
+    // الإشارة إلى أن Intlayer سيصدر كل من قواميس Intlayer و i18next
+    dictionaryOutput: ["intlayer", "i18next"],
+    // المسار النسبي من جذر المشروع إلى الدليل الذي ستصدر فيه قواميس i18n
+    i18nextResourcesDir: "./i18next/dictionaries",
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.cjs" codeFormat="commonjs"
+const { Locales } = require("intlayer");
+
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  content: {
+    // الإشارة إلى أن Intlayer سيصدر كل من قواميس Intlayer و i18next
+    dictionaryOutput: ["intlayer", "i18next"],
+    // المسار النسبي من جذر المشروع إلى الدليل الذي ستصدر فيه قواميس i18n
+    i18nextResourcesDir: "./i18next/dictionaries",
+  },
+};
+
+module.exports = config;
+```
+
+من خلال تضمين 'i18next' في التكوين، يقوم Intlayer بإنشاء قواميس i18next مخصصة بالإضافة إلى قواميس Intlayer. لاحظ أن إزالة 'intlayer' من التكوين قد تكسر التوافق مع React-Intlayer أو Next-Intlayer.
+
+### استيراد القواميس في تكوين i18next الخاص بك
+
+لاستيراد القواميس المنشأة في تكوين i18next الخاص بك، يمكنك استخدام 'i18next-resources-to-backend'. إليك مثال لكيفية استيراد قواميس i18next الخاصة بك:
+
+```typescript fileName="i18n/client.ts" codeFormat="typescript"
+// i18n/client.ts
+
+import i18next from "i18next";
+import resourcesToBackend from "i18next-resources-to-backend";
+
+i18next
+  // تكوين i18next الخاص بك
+  .use(
+    resourcesToBackend(
+      (language: string, namespace: string) =>
+        import(`../i18next/dictionaries/${language}/${namespace}.json`)
+    )
+  );
+```
+
+```javascript fileName="i18n/client.mjs" codeFormat="esm"
+// i18n/client.mjs
+
+import i18next from "i18next";
+import resourcesToBackend from "i18next-resources-to-backend";
+
+i18next
+  // تكوين i18next الخاص بك
+  .use(
+    resourcesToBackend(
+      (language, namespace) =>
+        import(`../i18next/dictionaries/${language}/${namespace}.json`)
+    )
+  );
+```
+
+```javascript fileName="i18n/client.cjs" codeFormat="commonjs"
+// i18n/client.cjs
+
+const i18next = require("i18next");
+const resourcesToBackend = require("i18next-resources-to-backend");
+
+i18next
+  // تكوين i18next الخاص بك
+  .use(
+    resourcesToBackend(
+      (language, namespace) =>
+        import(`../i18next/dictionaries/${language}/${namespace}.json`)
+    )
+  );
+```