Intlayer का उपयोग करके अपने Fastify बैकएंड वेबसाइट का अनुवाद करें | अंतर्राष्ट्रीयकरण (i18n)

fastify-intlayer Fastify अनुप्रयोगों के लिए एक शक्तिशाली अंतर्राष्ट्रीयकरण (i18n) प्लगइन है, जिसे क्लाइंट की प्राथमिकताओं के आधार पर स्थानीयकृत प्रतिक्रियाएं प्रदान करके आपकी बैकएंड सेवाओं को विश्व स्तर पर सुलभ बनाने के लिए डिज़ाइन किया गया है।

GitHub पर पैकेज कार्यान्वयन देखें।

व्यावहारिक उपयोग के मामले

• उपयोगकर्ता की भाषा में बैकएंड त्रुटियां प्रदर्शित करना: जब कोई त्रुटि होती है, तो उपयोगकर्ता की मातृभाषा में संदेश प्रदर्शित करने से समझ में सुधार होता है और हताशा कम होती है। यह विशेष रूप से गतिशील त्रुटि संदेशों के लिए उपयोगी है जो टोस्ट या मोडल जैसे फ्रंट-एंड घटकों में दिखाए जा सकते हैं।
• बहुभाषी सामग्री प्राप्त करना: डेटाबेस से सामग्री प्राप्त करने वाले अनुप्रयोगों के लिए, अंतर्राष्ट्रीयकरण यह सुनिश्चित करता है कि आप इस सामग्री को कई भाषाओं में परोस सकें। यह ई-कॉमर्स साइटों या सामग्री प्रबंधन प्रणालियों जैसे प्लेटफार्मों के लिए महत्वपूर्ण है जिन्हें उपयोगकर्ता द्वारा पसंदीदा भाषा में उत्पाद विवरण, लेख और अन्य सामग्री प्रदर्शित करने की आवश्यकता होती है।
• बहुभाषी ईमेल भेजना: चाहे वह ट्रांजेक्शनल ईमेल हों, मार्केटिंग अभियान हों या सूचनाएं, प्राप्तकर्ता की भाषा में ईमेल भेजना जुड़ाव और प्रभावशीलता को काफी बढ़ा सकता है।
• बहुभाषी पुश सूचनाएं: मोबाइल अनुप्रयोगों के लिए, उपयोगकर्ता की पसंदीदा भाषा में पुश सूचनाएं भेजना बातचीत और प्रतिधारण में सुधार कर सकता है। यह व्यक्तिगत स्पर्श सूचनाओं को अधिक प्रासंगिक और कार्रवाई योग्य महसूस करा सकता है।
• अन्य संचार: बैकएंड से संचार का कोई भी रूप, जैसे एसएमएस संदेश, सिस्टम अलर्ट या यूजर इंटरफेस अपडेट, उपयोगकर्ता की भाषा में होने से लाभान्वित होता है, स्पष्टता सुनिश्चित करता है और समग्र उपयोगकर्ता अनुभव को बढ़ाता है।

बैकएंड को अंतर्राष्ट्रीय बनाकर, आपका अनुप्रयोग न केवल सांस्कृतिक मतभेदों का सम्मान करता है बल्कि वैश्विक बाजार की जरूरतों के साथ बेहतर रूप से मेल खाता है, जिससे यह आपकी सेवाओं को दुनिया भर में विस्तारित करने के लिए एक महत्वपूर्ण कदम बन जाता् है।

शुरुआत करना

GitHub पर एप्लिकेशन टेम्पलेट देखें।

इंस्टालेशन

fastify-intlayer का उपयोग शुरू करने के लिए, npm का उपयोग करके पैकेज इंस्टॉल करें:

npx intlayer init --interactive

--interactive ध्वज (flag) वैकल्पिक है। यदि आप एक AI एजेंट हैं तो intlayer-cli init का उपयोग करें।

यह कमांड आपके एनवायरनमेंट को डिटेक्ट करेगी और आवश्यक पैकेज इंस्टॉल करेगी। उदाहरण के लिए:

npm install intlayer fastify-intlayer

सेटअप

अपने प्रोजेक्ट रूट में intlayer.config.ts बनाकर अंतर्राष्ट्रीयकरण सेटिंग्स कॉन्फ़िगर करें:

import { Locales, type IntlayerConfig } from "intlayer";

const config: IntlayerConfig = {
  internationalization: {
    locales: [
      Locales.ENGLISH,
      Locales.FRENCH,
      Locales.SPANISH_MEXICO,
      Locales.SPANISH_SPAIN,
    ],
    defaultLocale: Locales.ENGLISH,
  },
};

export default config;

अपनी सामग्री घोषित करें

अनुवादों को संग्रहीत करने के लिए अपनी सामग्री घोषणाएं बनाएं और प्रबंधित करें:

import { t, type Dictionary } from "intlayer";

const indexContent = {
  key: "index",
  content: {
    exampleOfContent: t({
      en: "Example of returned content in English",
      fr: "Exemple de contenu renvoyé en français",
      "es-ES": "Ejemplo de contenido devuelto en español (España)",
      "es-MX": "Ejemplo de contenido devuelto en español (México)",
    }),
  },
} satisfies Dictionary;

export default indexContent;

आपकी सामग्री घोषणाएं आपके अनुप्रयोग में कहीं भी परिभाषित की जा सकती हैं जब तक कि वे contentDir निर्देशिका (डिफ़ॉल्ट रूप से, ./src) में शामिल हों। और सामग्री घोषणा फ़ाइल एक्सटेंशन (डिफ़ॉल्ट रूप से, .content.{json,ts,tsx,js,jsx,mjs,cjs,md,mdx,yaml,yml}) से मेल खाती हों।

अधिक विवरण के लिए, सामग्री घोषणा दस्तावेज़ देखें।

Fastify अनुप्रयोग सेटअप

fastify-intlayer का उपयोग करने के लिए अपना Fastify अनुप्रयोग सेटअप करें:

import Fastify from "fastify";
import { intlayer, t, getDictionary, getIntlayer } from "fastify-intlayer";
import dictionaryExample from "./index.content";

const fastify = Fastify({ logger: true });

// अंतर्राष्ट्रीयकरण प्लगइन लोड करें
await fastify.register(intlayer);

// मार्ग
fastify.get("/t_example", async (_req, reply) => {
  return t({
    en: "Example of returned content in English",
    fr: "Exemple de contenu renvoyé en français",
    "es-ES": "Ejemplo de contenido devuelto en español (España)",
    "es-MX": "Ejemplo de contenido devuelto en español (México)",
  });
});

fastify.get("/getIntlayer_example", async (_req, reply) => {
  return getIntlayer("index").exampleOfContent;
});

fastify.get("/getDictionary_example", async (_req, reply) => {
  return getDictionary(dictionaryExample).exampleOfContent;
});

// सर्वर शुरू करें
const start = async () => {
  try {
    await fastify.listen({ port: 3000 });
  } catch (err) {
    fastify.log.error(err);
    process.exit(1);
  }
};

start();

अनुकूलता

fastify-intlayer पूरी तरह से इनके साथ संगत है:

• React अनुप्रयोगों के लिए react-intlayer
• Next.js अनुप्रयोगों के लिए next-intlayer
• Vite अनुप्रयोगों के लिए vite-intlayer

यह ब्राउज़र और एपीआई अनुरोधों सहित विभिन्न वातावरणों में किसी भी अंतर्राष्ट्रीयकरण समाधान के साथ निर्बाध रूप से काम करता है। आप हेडर्स या कुकीज़ के माध्यम से लोकेल का पता लगाने के लिए मिडलवेयर को कस्टमाइज़ कर सकते हैं:

import { Locales, type IntlayerConfig } from "intlayer";

const config: IntlayerConfig = {
  // ... अन्य कॉन्फ़िगरेशन विकल्प
  routing: {
    storage: [
      { type: "header", name: "my-locale-header" },
      { type: "cookie", name: "my-locale-cookie" },
    ],
  },
};

export default config;

डिफ़ॉल्ट रूप से, fastify-intlayer क्लाइंट की पसंदीदा भाषा निर्धारित करने के लिए Accept-Language हेडर की व्याख्या करेगा।

कॉन्फ़िगरेशन और उन्नत विषयों पर अधिक जानकारी के लिए, हमारे दस्तावेज़ पर जाएँ।

TypeScript कॉन्फ़िगर करें

fastify-intlayer अंतर्राष्ट्रीयकरण प्रक्रिया को बढ़ाने के लिए TypeScript की मजबूत क्षमताओं का लाभ उठाता है। TypeScript की स्थिर टाइपिंग यह सुनिश्चित करती है कि हर अनुवाद कुंजी का ध्यान रखा गया है, जिससे लापता अनुवादों का जोखिम कम हो जाता है और रखरखाव में सुधार होता है।

सुनिश्चित करें कि ऑटो-जेनरेटेड टाइप (डिफ़ॉल्ट रूप से ./types/intlayer.d.ts पर) आपकी tsconfig.json फ़ाइल में शामिल हैं।

{
  // ... आपके मौजूदा TypeScript कॉन्फ़िगरेशन
  "include": [
    // ... आपके मौजूदा TypeScript कॉन्फ़िगरेशन
    ".intlayer/**/*.ts", // ऑटो-जेनरेटेड टाइप शामिल करें
  ],
}

VS Code एक्सटेंशन

Intlayer के साथ अपने विकास के अनुभव को बेहतर बनाने के लिए, आप आधिकारिक Intlayer VS Code Extension इंस्टॉल कर सकते हैं।

VS Code Marketplace से इंस्टॉल करें

यह एक्सटेंशन प्रदान करता है:

• अनुवाद कुंजियों के लिए Autocompletion।
• लापता अनुवादों के लिए Real-time error detection।
• अनुवादित सामग्री का Inline previews।
• आसानी से अनुवाद बनाने और अपडेट करने के लिए Quick actions।

एक्सटेंशन का उपयोग करने के तरीके के बारे में अधिक विवरण के लिए, Intlayer VS Code Extension दस्तावेज़ देखें।

Git कॉन्फ़िगरेशन

Intlayer द्वारा उत्पन्न फ़ाइलों को अनदेखा करने की अनुशंसा की जाती है। यह आपको उन्हें अपने Git रिपॉजिटरी में प्रतिबद्ध करने से बचने की अनुमति देता है।

ऐसा करने के लिए, आप अपनी .gitignore फ़ाइल में निम्नलिखित निर्देश जोड़ सकते हैं:

# Intlayer द्वारा उत्पन्न फ़ाइलों को अनदेखा करें
.intlayer

अक्सर पूछे जाने वाले प्रश्न