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

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

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

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

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

• बहुभाषी ईमेल भेजना: चाहे वह ट्रांजेक्शनल ईमेल हों, मार्केटिंग अभियान हों या सूचनाएं, प्राप्तकर्ता की भाषा में ईमेल भेजने से जुड़ाव और प्रभावशीलता में काफी वृद्धि हो सकती है।

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

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

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

शुरुआत करना

See Application Template on GitHub.

स्थापना

hono-intlayer का उपयोग शुरू करने के लिए, npm का उपयोग करके पैकेज स्थापित करें:

npx intlayer init --interactive

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

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

npm install intlayer hono-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,
      Locales.HINDI,
    ],
    defaultLocale: Locales.ENGLISH,
  },
};

export default config;

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

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

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

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

Hono एप्लिकेशन सेटअप

hono-intlayer का उपयोग करने के लिए अपना Hono एप्लिकेशन सेट करें:

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

const app = new Hono();

// अंतर्राष्ट्रीयकरण अनुरोध हैंडलर लोड करें
app.use("*", intlayer());

// रूट
app.get("/t_example", (c) => {
  return c.text(
    t({
      en: "Example of returned content in English",
      fr: "Exemple de contenu renvoyé en français",
      hi: "हिंदी में लौटाई गई सामग्री का उदाहरण",
    })
  );
});

app.get("/getIntlayer_example", (c) => {
  return c.json(getIntlayer("index").exampleOfContent);
});

app.get("/getDictionary_example", (c) => {
  return c.json(getDictionary(dictionaryExample).exampleOfContent);
});

export default app;

संगतता

hono-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;

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

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

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

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

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

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

VS Code एक्सटेंशन

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

VS Code Marketplace से स्थापित करें

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

• अनुवाद कुंजियों के लिए ऑटो-कम्प्लीशन।
• गायब अनुवादों के लिए रीयल-टाइम त्रुटि पहचान।
• अनुवादित सामग्री का इनलाइन पूर्वावलोकन।
• आसानी से अनुवाद बनाने और अपडेट करने के लिए त्वरित कार्रवाई।

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

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

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

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

# Intlayer द्वारा जेनरेट की गई फ़ाइलों को अनदेखा करें
.intlayer

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