@intlayer/docs 5.5.8

package/hi/packages/next-intlayer/useIntlayerAsync.md

@@ -0,0 +1,211 @@
+# Next.js एकीकरण: `useIntlayerAsync` हुक दस्तावेज़ीकरण
+
+`useIntlayerAsync` हुक `useIntlayer` की कार्यक्षमता को बढ़ाता है, जो केवल पूर्व-रेंडर की गई शब्दकोशों को लौटाने के बजाय, अद्यतन को असिंक्रोनस रूप से प्राप्त करता है। यह उन अनुप्रयोगों के लिए आदर्श है जो प्रारंभिक रेंडर के बाद अपने स्थानीयकृत सामग्री को बार-बार अपडेट करते हैं।
+
+## अवलोकन
+
+- **असिंक्रोनस शब्दकोश लोडिंग:**  
+  क्लाइंट साइड पर, `useIntlayerAsync` पहले पूर्व-रेंडर की गई स्थानीय शब्दकोश लौटाता है (जैसे `useIntlayer`) और फिर किसी भी नए उपलब्ध रिमोट शब्दकोश को असिंक्रोनस रूप से प्राप्त और मर्ज करता है।
+- **प्रगति स्थिति प्रबंधन:**  
+  यह हुक एक `isLoading` स्थिति भी प्रदान करता है, जो यह संकेत देता है कि रिमोट शब्दकोश को प्राप्त किया जा रहा है। यह डेवलपर्स को एक स्मूथ उपयोगकर्ता अनुभव के लिए लोडिंग संकेतक या कंकाल स्थिति प्रदर्शित करने की अनुमति देता है।
+
+## पर्यावरण सेटअप
+
+Intlayer एक हेडलेस कंटेंट सोर्स मैनेजमेंट (CSM) सिस्टम प्रदान करता है जो गैर-डेवलपर्स को एप्लिकेशन सामग्री को निर्बाध रूप से प्रबंधित और अपडेट करने में सक्षम बनाता है। Intlayer के सहज डैशबोर्ड का उपयोग करके, आपकी टीम सीधे कोड को संशोधित किए बिना स्थानीयकृत टेक्स्ट, छवियों और अन्य संसाधनों को संपादित कर सकती है। यह सामग्री प्रबंधन प्रक्रिया को सुव्यवस्थित करता है, सहयोग को बढ़ावा देता है, और यह सुनिश्चित करता है कि अपडेट जल्दी और आसानी से किए जा सकते हैं।
+
+Intlayer के साथ आरंभ करने के लिए, आपको पहले [https://intlayer.org/dashboard](https://intlayer.org/dashboard) पर पंजीकरण करना होगा और एक एक्सेस टोकन प्राप्त करना होगा। एक बार जब आपके पास आपकी क्रेडेंशियल्स हों, तो उन्हें नीचे दिखाए गए अनुसार अपने कॉन्फ़िगरेशन फ़ाइल में जोड़ें:
+
+```typescript fileName="intlayer.config.ts" codeFormat="typescript"
+import type { IntlayerConfig } from "intlayer";
+
+export default {
+  // ...
+  editor: {
+    clientId: process.env.INTLAYER_CLIENT_ID,
+    clientSecret: process.env.INTLAYER_CLIENT_SECRET,
+  },
+} satisfies IntlayerConfig;
+```
+
+```javascript fileName="intlayer.config.mjs" codeFormat="esm"
+import { type IntlayerConfig } from "intlayer";
+
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  // ...
+  editor: {
+    clientId: process.env.INTLAYER_CLIENT_ID,
+    clientSecret: process.env.INTLAYER_CLIENT_SECRET,
+  },
+};
+
+export default config;
+```
+
+```javascript fileName="intlayer.config.cjs" codeFormat="commonjs"
+/** @type {import('intlayer').IntlayerConfig} */
+const config = {
+  // ...
+  editor: {
+    clientId: process.env.INTLAYER_CLIENT_ID,
+    clientSecret: process.env.INTLAYER_CLIENT_SECRET,
+  },
+};
+
+module.exports = config;
+```
+
+अपनी क्रेडेंशियल्स को कॉन्फ़िगर करने के बाद, आप निम्नलिखित कमांड चलाकर Intlayer पर एक नया स्थानीय शब्दकोश पुश कर सकते हैं:
+
+```bash
+npx intlayer dictionary push -d my-first-dictionary-key
+```
+
+यह कमांड आपकी प्रारंभिक सामग्री शब्दकोशों को अपलोड करता है, जिससे वे असिंक्रोनस रूप से प्राप्त करने और Intlayer प्लेटफ़ॉर्म के माध्यम से संपादित करने के लिए उपलब्ध हो जाते हैं।
+
+## Next.js में `useIntlayerAsync` आयात करना
+
+चूंकि `useIntlayerAsync` **क्लाइंट-साइड** घटकों के लिए अभिप्रेत है, आप इसे उसी क्लाइंट एंट्री पॉइंट से आयात करेंगे जैसे `useIntlayer`:
+
+```tsx codeFormat="typescript"
+"use client";
+
+import { useIntlayerAsync } from "next-intlayer";
+```
+
+```javascript codeFormat="esm"
+"use client";
+
+import { useIntlayerAsync } from "next-intlayer";
+```
+
+```javascript codeFormat="commonjs"
+"use client";
+
+const { useIntlayerAsync } = require("next-intlayer");
+```
+
+सुनिश्चित करें कि आयात करने वाली फ़ाइल के शीर्ष पर `"use client"` एनोटेट किया गया है, यदि आप Next.js ऐप राउटर का उपयोग कर रहे हैं जिसमें सर्वर और क्लाइंट घटक अलग-अलग हैं।
+
+## पैरामीटर
+
+1. **`key`**:  
+   **प्रकार**: `DictionaryKeys`  
+   स्थानीयकृत सामग्री ब्लॉक की पहचान करने के लिए उपयोग की जाने वाली शब्दकोश कुंजी। यह कुंजी आपकी सामग्री घोषणा फ़ाइलों में परिभाषित होनी चाहिए।
+
+2. **`locale`** (वैकल्पिक):  
+   **प्रकार**: `Locales`  
+   वह विशिष्ट स्थानीय जिसे आप लक्षित करना चाहते हैं। यदि छोड़ा गया है, तो हुक क्लाइंट संदर्भ से स्थानीय का उपयोग करता है।
+
+3. **`isRenderEditor`** (वैकल्पिक, डिफ़ॉल्ट `true`):  
+   **प्रकार**: `boolean`  
+   यह निर्धारित करता है कि सामग्री Intlayer संपादक ओवरले के साथ रेंडरिंग के लिए तैयार होनी चाहिए या नहीं। यदि `false` पर सेट है, तो लौटाए गए शब्दकोश डेटा में संपादक-विशिष्ट सुविधाएँ शामिल नहीं होंगी।
+
+## रिटर्न वैल्यू
+
+हुक एक शब्दकोश ऑब्जेक्ट लौटाता है जिसमें `key` और `locale` द्वारा कुंजीबद्ध स्थानीयकृत सामग्री होती है। इसमें एक `isLoading` बूलियन भी शामिल है जो यह संकेत देता है कि क्या वर्तमान में एक दूरस्थ शब्दकोश प्राप्त किया जा रहा है।
+
+## Next.js में उदाहरण उपयोग
+
+### क्लाइंट-साइड घटक उदाहरण
+
+```tsx fileName="src/components/AsyncClientComponentExample.tsx" codeFormat="typescript"
+"use client";
+
+import { useEffect, type FC } from "react";
+import { useIntlayerAsync } from "next-intlayer";
+
+export const AsyncClientComponentExample: FC = () => {
+  const { title, description, isLoading } = useIntlayerAsync("async-component");
+
+  useEffect(() => {
+    if (isLoading) {
+      console.log("सामग्री लोड हो रही है...");
+    }
+  }, [isLoading]);
+
+  return (
+    <div>
+      <h1>{title.value}</h1>
+      <p>{description.value}</p>
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/AsyncClientComponentExample.mjx" codeFormat="esm"
+"use client";
+
+import { useEffect } from "react";
+import { useIntlayerAsync } from "next-intlayer";
+
+const AsyncClientComponentExample = () => {
+  const { title, description, isLoading } = useIntlayerAsync("async-component");
+
+  useEffect(() => {
+    if (isLoading) {
+      console.log("सामग्री लोड हो रही है...");
+    }
+  }, [isLoading]);
+
+  return (
+    <div>
+      <h1>{title.value}</h1>
+      <p>{description.value}</p>
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/AsyncClientComponentExample.csx" codeFormat="commonjs"
+"use client";
+
+const { useEffect } = require("react");
+const { useIntlayerAsync } = require("next-intlayer");
+
+const AsyncClientComponentExample = () => {
+  const { title, description, isLoading } = useIntlayerAsync("async-component");
+
+  useEffect(() => {
+    if (isLoading) {
+      console.log("सामग्री लोड हो रही है...");
+    }
+  }, [isLoading]);
+
+  return (
+    <div>
+      <h1>{title.value}</h1>
+      <p>{description.value}</p>
+    </div>
+  );
+};
+```
+
+**मुख्य बिंदु:**
+
+- प्रारंभिक रेंडर पर, `title` और `description` पूर्व-रेंडर की गई स्थानीय शब्दकोश से आते हैं।
+- जबकि `isLoading` `true` है, पृष्ठभूमि में एक रिमोट अनुरोध किया जाता है ताकि एक अद्यतन शब्दकोश प्राप्त किया जा सके।
+- एक बार प्राप्ति पूरी हो जाने के बाद, `title` और `description` नवीनतम सामग्री के साथ अपडेट हो जाते हैं, और `isLoading` `false` पर लौट आता है।
+
+## विशेषता स्थानीयकरण को संभालना
+
+`useIntlayer` की तरह, आप विभिन्न HTML गुणों (जैसे, `alt`, `title`, `aria-label`) के लिए स्थानीयकृत विशेषता मान प्राप्त कर सकते हैं:
+
+```tsx
+<img src={title.image.src.value} alt={title.image.alt.value} />
+```
+
+## शब्दकोश फ़ाइलें
+
+सभी सामग्री कुंजियाँ आपकी सामग्री घोषणा फ़ाइलों में परिभाषित होनी चाहिए ताकि प्रकार सुरक्षा सुनिश्चित हो सके और रनटाइम त्रुटियों को रोका जा सके। ये फ़ाइलें TypeScript सत्यापन को सक्षम करती हैं, यह सुनिश्चित करते हुए कि आप हमेशा मौजूदा कुंजियों और स्थानीयों का संदर्भ देते हैं।
+
+सामग्री घोषणा फ़ाइलों को सेट करने के लिए निर्देश [यहाँ](https://github.com/aymericzip/intlayer/blob/main/docs/hi/dictionary/get_started.md) उपलब्ध हैं।
+
+## अधिक जानकारी
+
+- **Intlayer विज़ुअल एडिटर:**  
+  UI से सीधे सामग्री प्रबंधित और संपादित करने के लिए Intlayer विज़ुअल एडिटर के साथ एकीकृत करें। अधिक विवरण [यहाँ](https://github.com/aymericzip/intlayer/blob/main/docs/hi/intlayer_visual_editor.md)।
+
+---
+
+**सारांश में**, `useIntlayerAsync` एक शक्तिशाली क्लाइंट-साइड हुक है जिसे उपयोगकर्ता अनुभव को बढ़ाने और पूर्व-रेंडर की गई शब्दकोशों को असिंक्रोनस शब्दकोश अपडेट के साथ जोड़कर सामग्री ताजगी बनाए रखने के लिए डिज़ाइन किया गया है। `isLoading` और TypeScript-आधारित सामग्री घोषणाओं का लाभ उठाकर, आप अपने Next.js अनुप्रयोगों में गतिशील, स्थानीयकृत सामग्री को निर्बाध रूप से एकीकृत कर सकते हैं।

package/hi/packages/next-intlayer/useLocale.md

@@ -0,0 +1,105 @@
+# Next.js एकीकरण: `useLocale` हुक दस्तावेज़ीकरण `next-intlayer` के लिए
+
+यह अनुभाग `next-intlayer` लाइब्रेरी के भीतर Next.js अनुप्रयोगों के लिए `useLocale` हुक पर विस्तृत दस्तावेज़ीकरण प्रदान करता है। इसे स्थानीय परिवर्तन और रूटिंग को कुशलतापूर्वक संभालने के लिए डिज़ाइन किया गया है।
+
+## Next.js में `useLocale` आयात करना
+
+अपने Next.js अनुप्रयोग में `useLocale` हुक का उपयोग करने के लिए, इसे नीचे दिखाए गए अनुसार आयात करें:
+
+```javascript
+import { useLocale } from "next-intlayer"; // Next.js में स्थानीय और रूटिंग प्रबंधन के लिए उपयोग किया जाता है
+```
+
+## उपयोग
+
+यहां बताया गया है कि Next.js घटक के भीतर `useLocale` हुक को कैसे लागू करें:
+
+```tsx fileName="src/components/LocaleSwitcher.tsx" codeFormat="typescript"
+"use client";
+
+import type { FC } from "react";
+import { Locales } from "intlayer";
+import { useLocale } from "next-intlayer";
+
+const LocaleSwitcher: FC = () => {
+  const { locale, defaultLocale, availableLocales, setLocale } = useLocale();
+
+  return (
+    <div>
+      <h1>वर्तमान स्थानीय: {locale}</h1>
+      <p>डिफ़ॉल्ट स्थानीय: {defaultLocale}</p>
+      <select value={locale} onChange={(e) => setLocale(e.target.value)}>
+        {availableLocales.map((loc) => (
+          <option key={loc} value={loc}>
+            {loc}
+          </option>
+        ))}
+      </select>
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/LocaleSwitcher.mjx" codeFormat="esm"
+"use client";
+
+import { Locales } from "intlayer";
+import { useLocale } from "next-intlayer";
+
+const LocaleSwitcher = () => {
+  const { locale, defaultLocale, availableLocales, setLocale } = useLocale();
+
+  return (
+    <div>
+      <h1>वर्तमान स्थानीय: {locale}</h1>
+      <p>डिफ़ॉल्ट स्थानीय: {defaultLocale}</p>
+      <select value={locale} onChange={(e) => setLocale(e.target.value)}>
+        {availableLocales.map((loc) => (
+          <option key={loc} value={loc}>
+            {loc}
+          </option>
+        ))}
+      </select>
+    </div>
+  );
+};
+```
+
+```jsx fileName="src/components/LocaleSwitcher.csx" codeFormat="commonjs"
+"use client";
+
+const { Locales } = require("intlayer");
+const { useLocale } = require("next-intlayer");
+
+const LocaleSwitcher = () => {
+  const { locale, defaultLocale, availableLocales, setLocale } = useLocale();
+
+  return (
+    <div>
+      <h1>वर्तमान स्थानीय: {locale}</h1>
+      <p>डिफ़ॉल्ट स्थानीय: {defaultLocale}</p>
+      <select value={locale} onChange={(e) => setLocale(e.target.value)}>
+        {availableLocales.map((loc) => (
+          <option key={loc} value={loc}>
+            {loc}
+          </option>
+        ))}
+      </select>
+    </div>
+  );
+};
+```
+
+## पैरामीटर और रिटर्न मान
+
+जब आप `useLocale` हुक को कॉल करते हैं, तो यह निम्नलिखित गुणों वाला एक ऑब्जेक्ट लौटाता है:
+
+- **`locale`**: वर्तमान स्थानीय जो React संदर्भ में सेट किया गया है।
+- **`defaultLocale`**: कॉन्फ़िगरेशन में परिभाषित प्राथमिक स्थानीय।
+- **`availableLocales`**: सभी उपलब्ध स्थानीय की सूची जो कॉन्फ़िगरेशन में परिभाषित है।
+- **`setLocale`**: अनुप्रयोग के स्थानीय को बदलने और URL को अपडेट करने के लिए एक फ़ंक्शन। यह कॉन्फ़िगरेशन के आधार पर पथ में स्थानीय जोड़ने या न जोड़ने के लिए उपसर्ग नियमों का ध्यान रखता है। नेविगेशन फ़ंक्शंस जैसे `push` और `refresh` के लिए `next/navigation` से `useRouter` का उपयोग करता है।
+- **`pathWithoutLocale`**: एक गणना की गई संपत्ति जो स्थानीय के बिना पथ लौटाती है। यह URL की तुलना के लिए उपयोगी है। उदाहरण के लिए, यदि वर्तमान स्थानीय `fr` है, और URL `fr/my_path` है, तो स्थानीय के बिना पथ `/my_path` है। वर्तमान पथ प्राप्त करने के लिए `next/navigation` से `usePathname` का उपयोग करता है।
+
+## निष्कर्ष
+
+`next-intlayer` का `useLocale` हुक Next.js अनुप्रयोगों में स्थानीय प्रबंधन के लिए एक महत्वपूर्ण उपकरण है। यह आपके अनुप्रयोग को कई स्थानीय के लिए अनुकूलित करने के लिए एकीकृत दृष्टिकोण प्रदान करता है, स्थानीय भंडारण, स्थिति प्रबंधन, और URL संशोधनों को सहजता से संभालता है।

package/hi/packages/preact-intlayer/index.md

@@ -0,0 +1,3 @@
+this doc will be automatically generated translated from the english doc
+
+see /docs/en/packages/preact-intlayer/index.md

package/hi/packages/react-intlayer/index.md

@@ -0,0 +1,261 @@
+# react-intlayer: NPM पैकेज एक React एप्लिकेशन को अंतर्राष्ट्रीयकरण (i18n) करने के लिए
+
+**Intlayer** जावास्क्रिप्ट डेवलपर्स के लिए विशेष रूप से डिज़ाइन किए गए पैकेजों का एक सूट है। यह React, React, और Express.js जैसे फ्रेमवर्क्स के साथ संगत है।
+
+**`react-intlayer` पैकेज** आपको अपने React एप्लिकेशन को अंतर्राष्ट्रीयकरण करने की अनुमति देता है। यह React अंतर्राष्ट्रीयकरण के लिए संदर्भ प्रदाता और हुक प्रदान करता है।
+
+## अपने React एप्लिकेशन को अंतर्राष्ट्रीयकरण क्यों करें?
+
+अपने React एप्लिकेशन को अंतर्राष्ट्रीयकरण करना एक वैश्विक दर्शकों को प्रभावी ढंग से सेवा देने के लिए आवश्यक है। यह आपके एप्लिकेशन को प्रत्येक उपयोगकर्ता की पसंदीदा भाषा में सामग्री और संदेश प्रदान करने की अनुमति देता है। यह क्षमता उपयोगकर्ता अनुभव को बढ़ाती है और आपके एप्लिकेशन की पहुंच को व्यापक बनाती है, इसे विभिन्न भाषाई पृष्ठभूमि के लोगों के लिए अधिक सुलभ और प्रासंगिक बनाती है।
+
+## Intlayer को क्यों एकीकृत करें?
+
+- **जावास्क्रिप्ट-संचालित सामग्री प्रबंधन**: अपनी सामग्री को कुशलतापूर्वक परिभाषित और प्रबंधित करने के लिए जावास्क्रिप्ट की लचीलापन का उपयोग करें।
+- **टाइप-सुरक्षित वातावरण**: टाइपस्क्रिप्ट का उपयोग करके सुनिश्चित करें कि आपकी सभी सामग्री परिभाषाएँ सटीक और त्रुटि-मुक्त हैं।
+- **एकीकृत सामग्री फ़ाइलें**: अपनी अनुवादों को उनके संबंधित घटकों के पास रखें, जिससे रखरखाव और स्पष्टता बढ़े।
+
+## स्थापना
+
+अपने पसंदीदा पैकेज प्रबंधक का उपयोग करके आवश्यक पैकेज स्थापित करें:
+
+```bash packageManager="npm"
+npm install react-intlayer
+```
+
+```bash packageManager="yarn"
+yarn add react-intlayer
+```
+
+```bash packageManager="pnpm"
+pnpm add react-intlayer
+```
+
+## उपयोग का उदाहरण
+
+Intlayer के साथ, आप अपनी सामग्री को अपनी कोडबेस में कहीं भी संरचित तरीके से घोषित कर सकते हैं।
+
+डिफ़ॉल्ट रूप से, Intlayer `.content.{json,ts,tsx,js,jsx,mjs,mjx,cjs,cjx}` एक्सटेंशन वाली फ़ाइलों को स्कैन करता है।
+
+> आप [कॉन्फ़िगरेशन फ़ाइल](https://github.com/aymericzip/intlayer/blob/main/docs/hi/configuration.md) में `contentDir` प्रॉपर्टी सेट करके डिफ़ॉल्ट एक्सटेंशन को संशोधित कर सकते हैं।
+
+```bash codeFormat="typescript"
+.
+├── intlayer.config.ts
+└── src
+    └── components
+        ├── Component1
+        │   ├── index.content.ts
+        │   └── index.tsx
+        └── Component2
+            ├── index.content.ts
+            └── index.tsx
+```
+
+```bash codeFormat="esm"
+.
+├── intlayer.config.mjs
+└── src
+    └── components
+        ├── Component1
+        │   ├── index.content.mjs
+        │   └── index.mjx
+        └── Component2
+            ├── index.content.mjs
+            └── index.mjx
+```
+
+```bash codeFormat="commonjs"
+.
+├── intlayer.config.cjs
+└── src
+    └── components
+        ├── Component1
+        │   ├── index.content.cjs
+        │   └── index.cjx
+        └── Component2
+            ├── index.content.cjs
+            └── index.cjx
+```
+
+### अपनी सामग्री घोषित करें
+
+`react-intlayer` [`intlayer` पैकेज](https://github.com/aymericzip/intlayer/blob/main/docs/hi/packages/intlayer/index.md) के साथ काम करने के लिए बनाया गया है। `intlayer` एक पैकेज है जो आपको अपनी सामग्री को अपनी कोड में कहीं भी घोषित करने की अनुमति देता है। यह बहुभाषी सामग्री घोषणाओं को संरचित शब्दकोशों में परिवर्तित करता है जो आपके एप्लिकेशन में सहजता से एकीकृत होते हैं।
+
+यहाँ सामग्री घोषणा का एक उदाहरण है:
+
+```tsx fileName="src/Component1/index.content.ts" codeFormat="typescript"
+import { t, type Dictionary } from "intlayer";
+
+const component1Content = {
+  key: "component-1",
+  content: {
+    myTranslatedContent: t({
+      en: "Hello World",
+      fr: "Bonjour le monde",
+      es: "Hola Mundo",
+      hi: "नमस्ते दुनिया",
+    }),
+    numberOfCar: enu({
+      "<-1": "Less than minus one car",
+      "-1": "Minus one car",
+      "0": "No cars",
+      "1": "One car",
+      ">5": "Some cars",
+      ">19": "Many cars",
+    }),
+  },
+} satisfies Dictionary;
+
+export default component1Content;
+```
+
+```jsx fileName="src/Component1/index.content.mjs" contentDeclarationFormat="esm"
+import { t } from "intlayer";
+
+/** @type {import('intlayer').Dictionary} */
+const component1Content = {
+  key: "component-1",
+  content: {
+    myTranslatedContent: t({
+      en: "Hello World",
+      fr: "Bonjour le monde",
+      es: "Hola Mundo",
+      hi: "नमस्ते दुनिया",
+    }),
+    numberOfCar: enu({
+      "<-1": "Less than minus one car",
+      "-1": "Minus one car",
+      "0": "No cars",
+      "1": "One car",
+      ">5": "Some cars",
+      ">19": "Many cars",
+    }),
+  },
+};
+
+export default component1Content;
+```
+
+```jsx fileName="src/Component1/index.content.cjs" contentDeclarationFormat="commonjs"
+const { t } = require("intlayer");
+
+/** @type {import('intlayer').Dictionary} */
+const component1Content = {
+  key: "component-1",
+  content: {
+    myTranslatedContent: t({
+      en: "Hello World",
+      fr: "Bonjour le monde",
+      es: "Hola Mundo",
+      hi: "नमस्ते दुनिया",
+    }),
+    numberOfCar: enu({
+      "<-1": "Less than minus one car",
+      "-1": "Minus one car",
+      "0": "No cars",
+      "1": "One car",
+      ">5": "Some cars",
+      ">19": "Many cars",
+    }),
+  },
+};
+
+module.exports = component1Content;
+```
+
+```json fileName="src/Component1/index.content.json" codeFormat="json"
+{
+  "key": "component-1",
+  "content": {
+    "myTranslatedContent": {
+      "nodeType": "translation",
+      "translation": {
+        "en": "Hello World",
+        "fr": "Bonjour le monde",
+        "es": "Hola Mundo",
+        "hi": "नमस्ते दुनिया"
+      }
+    },
+    "numberOfCar": {
+      "nodeType": "enumeration",
+      "enumeration": {
+        "<-1": "Less than minus one car",
+        "-1": "Minus one car",
+        "0": "No cars",
+        "1": "One car",
+        ">5": "Some cars",
+        ">19": "Many cars"
+      }
+    }
+  }
+}
+```
+
+### अपनी कोड में सामग्री का उपयोग करें
+
+एक बार जब आप अपनी सामग्री घोषित कर लेते हैं, तो आप इसे अपनी कोड में उपयोग कर सकते हैं। यहाँ एक उदाहरण है कि React घटक में सामग्री का उपयोग कैसे करें:
+
+```tsx {4,7} fileName="src/components/Component1Example.tsx" codeFormat="typescript"
+"use client";
+
+import type { FC } from "react";
+import { useIntlayer } from "react-intlayer";
+
+export const Component1Example: FC = () => {
+  const { myTranslatedContent } = useIntlayer("component-1"); // संबंधित सामग्री घोषणा बनाएँ
+
+  return (
+    <div>
+      <p>{myTranslatedContent}</p>
+    </div>
+  );
+};
+```
+
+```jsx {3,6} fileName="src/components/Component1Example.mjx" codeFormat="esm"
+"use client";
+
+import { useIntlayer } from "react-intlayer";
+
+const Component1Example = () => {
+  const { myTranslatedContent } = useIntlayer("component-1"); // संबंधित सामग्री घोषणा बनाएँ
+
+  return (
+    <div>
+      <p>{myTranslatedContent}</p>
+    </div>
+  );
+};
+```
+
+```jsx {3,6} fileName="src/components/Component1Example.csx" codeFormat="commonjs"
+"use client";
+
+const { useIntlayer } = require("react-intlayer");
+
+const Component1Example = () => {
+  const { myTranslatedContent } = useIntlayer("component-1"); // संबंधित सामग्री घोषणा बनाएँ
+
+  return (
+    <div>
+      <p>{myTranslatedContent}</p>
+    </div>
+  );
+};
+```
+
+## अपने React एप्लिकेशन के अंतर्राष्ट्रीयकरण में महारत हासिल करें
+
+Intlayer आपके React एप्लिकेशन को अंतर्राष्ट्रीयकरण करने में मदद करने के लिए कई सुविधाएँ प्रदान करता है।
+
+**इन सुविधाओं के बारे में अधिक जानने के लिए, [Intlayer और Vite और React के साथ React अंतर्राष्ट्रीयकरण (i18n)](https://github.com/aymericzip/intlayer/blob/main/docs/hi/intlayer_with_vite+react.md) गाइड को देखें, या [Intlayer और React (CRA) के साथ React अंतर्राष्ट्रीयकरण (i18n)](https://github.com/aymericzip/intlayer/blob/main/docs/hi/intlayer_with_create_react_app.md) गाइड को देखें।**
+
+## `react-intlayer` पैकेज द्वारा प्रदान किए गए फ़ंक्शन
+
+`react-intlayer` पैकेज आपके एप्लिकेशन को अंतर्राष्ट्रीयकरण करने में मदद करने के लिए कुछ फ़ंक्शन भी प्रदान करता है।
+
+- [`t()`](https://github.com/aymericzip/intlayer/blob/main/docs/hi/packages/react-intlayer/t.md)
+- [`useIntlayer()`](https://github.com/aymericzip/intlayer/blob/main/docs/hi/packages/react-intlayer/useIntlayer.md)
+- [`useDictionary()`](https://github.com/aymericzip/intlayer/blob/main/docs/hi/packages/react-intlayer/useDictionary.md)
+- [`useLocale()`](https://github.com/aymericzip/intlayer/blob/main/docs/hi/packages/react-intlayer/useLocale.md)
+- [`useIntlayerAsync()`](https://github.com/aymericzip/intlayer/blob/main/docs/hi/packages/react-intlayer/useIntlayerAsync.md)