Internationalization

अपने app में multi-language support जोड़ें। संपादकीय localization के लिए Proyecta Content API का उपयोग करें, या AI से सीधे code में i18n framework को wire up करने के लिए कहें।

Proyecta तुम्हारे बनाए apps को internationalize करने के लिए दो पूरक तरीके support करता है:

1. Proyecta Content API के ज़रिए Content localization — संपादकीय content (blog posts, FAQs, marketing copy) के लिए, जिसे कई भाषाओं में translate करना हो
2. Translation framework के ज़रिए Code-level i18n — UI strings, dates, currencies, और runtime locale switching के लिए

दोनों आज काम करते हैं। तुम्हें किसकी ज़रूरत है, यह इस बात पर निर्भर करता है कि तुम क्या translate कर रहे हो।

Proyecta का builder खुद 24 locales के साथ आता है, इसलिए product i18n में माहिर है। वही patterns उन apps पर भी लागू होते हैं जो तुम इसके अंदर बनाते हो।

Option 1: Content localization (Proyecta Content API)

अगर तुम एक content-heavy site बना रहे हो — blog, knowledge base, marketing pages, product catalog — तो built-in locale support का उपयोग करो। AI को बता दो कि तुम कौन-सी भाषाएँ support करते हो ("Make the site available in English, Spanish and French") और वह उन्हें तुम्हारे लिए register कर देगा, English को default रखते हुए। फिर visitor की भाषा में अपना content वापस पढ़ो।

Front end पर, template के typed content hooks तुम्हारे लिए localized fields resolve करते हैं — visitor की active locale pass करो और हर localized field एक single translated value के रूप में वापस आती है:

import { useCollection, useEntry } from '@/hooks/useContent';
import { useTranslation } from 'react-i18next';

function Blog({ slug }: { slug: string }) {
    const { i18n } = useTranslation();

    // List a collection in the current locale
    const { data: posts } = useCollection('posts', { locale: i18n.language });

    // Or read one entry by slug in the current locale
    const { data: post } = useEntry('posts', slug, { locale: i18n.language });

    // ...render posts / post
}

परदे के पीछे CMS एक fallback chain पर चलता है — requested locale → उसके configured fallbacks → default locale — और हर entry पर localeResolved के रूप में वह code report करता है जो उसने actually serve किया। Single-language sites पर locale छोड़ो और fields raw values के रूप में वापस आती हैं।

यह सही जवाब है जब:

• जो editors code नहीं लिखते, उन्हें content translate करना हो
• तुम चाहते हो कि translations versionable हों
• तुम्हें locale-specific publishing चाहिए (scheduled publishing जल्द आ रहा है — entries को फिलहाल API के ज़रिए manually publish करना होगा)

पूरी Content API के लिए Content Management देखो।

Option 2: Code-level i18n framework

UI strings के लिए — labels, buttons, error messages, dates, currencies — AI से सीधे तुम्हारे project में एक i18n framework wire up करने के लिए कहो:

Add internationalization to my app.
Support English, Spanish, French, and Arabic.
Add message catalogs in src/locales/.
Add a language switcher in the header.
Use locale-prefixed URLs like /en/about and /es/about.
Make sure RTL layout works correctly for Arabic.

AI यह करेगा:

1. Framework चुनेगा — AI i18next के साथ react-i18next (Proyecta का standard) उपयोग करता है
2. Catalog files बनाएगा src/locales/ में (हर भाषा के लिए एक JSON)
3. Text को wrap करेगा t() calls में (react-i18next के useTranslation hook से)
4. Language switcher component जोड़ेगा
5. Locale prefixes के साथ URL routing wire करेगा
6. RTL layouts (dir="rtl") को Arabic, Hebrew, आदि के लिए handle करेगा
7. Numbers, dates, और currencies को locale के अनुसार format करेगा

AI से Auto-translate करें

एक बार तुम्हारी base language तैयार हो जाए, AI बाकी catalog files बनाने में बहुत काम आता है:

• "Translate every string in src/locales/en.json into Spanish, French, German, and Japanese. Use natural, idiomatic phrasing — don't translate brand names."
• "My app is fully built in English. Add Spanish translations for everything and an es/ route prefix."

ज़्यादा महत्वपूर्ण content (legal copy, medical, finance) के लिए, ship करने से पहले किसी human translator से AI का output review करवाओ।

दोनों तरीकों को मिलाना

अधिकांश real apps दोनों का उपयोग करते हैं: UI chrome (buttons, errors, navigation) के लिए code-level i18n, और संपादकीय content (articles, product descriptions) के लिए Content API। ये साफ-सुथरे तरीके से साथ रहते हैं — तुम्हारा i18n framework build time पर catalog files handle करता है, Content API runtime पर localized entries serve करती है।

Best practices

1. पहले अपनी base language चुनो और copy finalize करो। किसी बदलते target को translate करना मुश्किल होता है।
2. Translations को batch करो। जैसे-जैसे चलते translate मत करो — किसी feature के stable होने तक रुको।
3. RTL को जल्दी test करो अगर तुम Arabic या Hebrew support करते हो। RTL bugs तब तक छिपे रहते हैं जब तक तुम actually देखो।
4. <html> पर lang और dir शामिल करो। Browsers और screen readers इन पर निर्भर होते हैं।
5. Formatting के लिए Intl उपयोग करो। Date या currency formatting खुद से मत लिखो — Intl.DateTimeFormat, Intl.NumberFormat उपयोग करो।

जल्द आ रहा है

• In-builder locale management UI — locales चुनो, translation coverage देखो, Proyecta से बाहर निकले बिना catalogs edit करो
• नई strings के लिए Auto-translate-on-save
• i18n-ready project templates जिनमें framework पहले से wire हो