Welcome to our platform

Start your journey with us today

\n \n

\n );\n}\n```\n\n**متطلبات الاستخراج:**\n\n1. استبدال النصوص الثابتة بخطافات ومكونات react-intl\n2. استخدام تنسيق ICU للمتغيرات والصيغ الجمعية\n3. هيكلة المفاتيح بشكل هرمي حسب تنظيم المكونات\n4. إضافة جميع المفاتيح إلى ملف JSON المصدر\n5. الحفاظ على اتفاقيات تسمية متسقة\n\n**نص طلب الذكاء الاصطناعي:**\n\n```\nاستخرج جميع النصوص الثابتة من مكونات React و:\n\n1. استبدلها باستخدام react-intl:\n - استخدم خطاف useIntl للنصوص الديناميكية\n - استخدم FormattedMessage للنص الثابت\n - أضف تنسيق ICU للمتغيرات ({name}) والصيغ الجمعية ({count})\n\n2. هيكلة مفاتيح الترجمة:\n - تجميع حسب التسلسل الهرمي للمكونات (components.*, pages.*)\n - استخدم مفاتيح وصفية ومتداخلة (header.nav.home)\n - طابق هيكل المكون في JSON\n\n3. تحديث الترجمات المحلية:\n - أضف جميع المفاتيح إلى src/locales/en.json\n - حافظ على تسمية متسقة عبر التطبيق\n```\n\n**بعد استخراج الذكاء الاصطناعي:**\n\n```jsx\nimport { useIntl } from \"react-intl\";\n\nfunction WelcomeCard() {\n const intl = useIntl();\n\n return (\n

{intl.formatMessage({ id: \"welcome.title\" })}

{intl.formatMessage({ id: \"welcome.description\" })}

\n \n

\n );\n}\n```\n\n**ملف en.json المُنشأ:**\n\n```json\n{\n \"welcome.title\": \"Welcome to our platform\",\n \"welcome.description\": \"Start your journey with us today\",\n \"welcome.getStarted\": \"Get started\"\n}\n```\n\n## المعالجة الدفعية\n\nللمكونات المتعددة، حدد جميع الملفات واستخدم نفس الموجه الشامل. يمكن لبيئات التطوير المتكاملة المدعومة بالذكاء الاصطناعي مثل Cursor وGitHub Copilot وغيرها معالجة ملفات متعددة في وقت واحد، مع الحفاظ على تسمية المفاتيح بشكل متسق عبر تطبيقك.\n\n## إنشاء الترجمة\n\nبمجرد أن تستخرج بيئة التطوير المتكاملة للذكاء الاصطناعي المفاتيح، قم بإنشاء الترجمات:\n\n```bash\nnpx lingo.dev@latest i18n\n```\n\nهذا ينشئ إصدارات مترجمة من ملف المصدر الخاص بك:\n\n```bash\nsrc/locales/\n en.json (المصدر مع المفاتيح المستخرجة)\n es.json (الترجمات الإسبانية)\n fr.json (الترجمات الفرنسية)\n de.json (الترجمات الألمانية)\n```\n\n## التحقق\n\nبعد الاستخراج، تحقق من الإعداد الخاص بك:\n\n**تحقق من تغطية الترجمة:**\n\n```bash\nnpx lingo.dev@latest i18n --frozen\n```\n\nيفشل هذا الأمر إذا كانت هناك أي ترجمات مفقودة، مما يضمن تغطية كاملة.\n\n**اختبر باستخدام لغات مختلفة:**\n\n```jsx\n// قم بتبديل اللغة في تطبيقك للتحقق من عمل الترجمات\n\n \n\n```\n","content","\nتحويل تطبيق React موجود لدعم لغات متعددة هو أحيانًا عملية مملة تتضمن البحث عن النصوص المكتوبة بشكل ثابت واستبدالها بمفاتيح الترجمة.\n\nتعمل **واجهة سطر أوامر Lingo.dev** بسلاسة مع بيئات التطوير المدعومة بالذكاء الاصطناعي مثل Cursor وGitHub Copilot وأدوات مماثلة لأتمتة استخراج المحتوى القابل للترجمة من مكونات React الخاصة بك.\n\nيمكن استخدام المفهوم الموضح أدناه لأي مجموعة تقنية، ولكن للبساطة ولتوضيح الفكرة، سنستخدم تطبيق React بسيط كمثال.\n\n## المتطلبات الأساسية\n\nقبل استخراج المفاتيح، قم بإعداد التدويل الأساسي في تطبيق React الخاص بك. للحصول على تعليمات الإعداد الكاملة، راجع [وثائق react-intl](https://formatjs.io/docs/react-intl/).\n\nبعد اتباع إعداد التدويل لمجموعة التقنيات الخاصة بك، يجب أن يكون لمشروعك:\n\n- القدرة على التبديل بين اللغات بشكل ديناميكي في التطبيق\n- هيكل مشروع أساسي لتنظيم ملفات الترجمة\n\n## عملية الإعداد\n\n**تثبيت وتكوين واجهة سطر أوامر Lingo.dev:**\n\n```bash\nnpx lingo.dev@latest init\n```\n\n**إنشاء ملف مصدر فارغ:**\n\n```bash\nmkdir -p src/locales\necho '{}' > src/locales/en.json\n```\n\n**تكوين ملف i18n.json:**\n\n```json\n{\n \"locale\": {\n \"source\": \"en\",\n \"targets\": [\"es\", \"fr\", \"de\"]\n },\n \"buckets\": {\n \"json\": {\n \"include\": [\"src/locales/[locale].json\"]\n }\n }\n}\n```\n\n## استخراج المفاتيح باستخدام الذكاء الاصطناعي\n\n**حدد مكون React الخاص بك** واستخدم بيئة التطوير المدعومة بالذكاء الاصطناعي لاستخراج النصوص الثابتة:\n\n**قبل الاستخراج:**\n\n```jsx\nfunction WelcomeCard() {\n return (\n

Welcome to our platform

Start your journey with us today

\n \n

{intl.formatMessage({ id: \"welcome.title\" })}

{intl.formatMessage({ id: \"welcome.description\" })}

\n \n

استخراج مفاتيح i18n باستخدام الذكاء الاصطناعي