आंतरराष्ट्रीयीकरण(i18n) मध्ये अंमलबजावणी करणे Next.js: बहुभाषिक

या विभागात, आम्ही तुम्हाला तुमच्या अर्जामध्ये आंतरराष्ट्रीयकरण(i18n) लागू करण्याच्या प्रक्रियेबद्दल मार्गदर्शन करू Next.js. i18n सह, तुम्ही वापरकर्त्यांसाठी बहुभाषिक अनुभव तयार करू शकता आणि भाषा-विशिष्ट सामग्री प्रदान करू शकता.

next-i18next लायब्ररी वापरणे

next-i18next अनुप्रयोगांमध्ये i18n लागू करण्यासाठी एक लोकप्रिय लायब्ररी आहे Next.js. तुम्ही तुमच्या अर्जात i18n कसे जोडू शकता ते येथे आहे:

स्थापित करा next-i18next:

npm install next-i18next

तुमच्या फाईलमध्ये लायब्ररी कॉन्फिगर करा next.config.js:

const { i18n } = require('./next-i18next.config');  
  
module.exports = {  
  i18n,  
};  

नावाची कॉन्फिगरेशन फाइल तयार करा next-i18next.config.js:

module.exports = {  
  i18n: {  
    locales: ['en', 'fr', 'es'],  
    defaultLocale: 'en',  
  },  
};  

तुमच्या अर्जामध्ये लायब्ररी वापरा:

import { useTranslation } from 'next-i18next';  
  
function MyComponent() {  
  const { t } = useTranslation();  
  
  return( 
    <div>  
      <p>{t('welcome')}</p>  
    </div>  
 );  
}  

बहुभाषिक सामग्री तयार करणे

स्थापित केल्यानंतर, प्रत्येक भाषेतील सामग्री प्रदान करण्यासाठी next-i18next तुम्ही en.json, fr.json, सारख्या भाषा फाइल्स तयार करू शकता: es.json

// en.json  
{  
  "welcome": "Welcome!"  
}  
  
// fr.json  
{  
  "welcome": "Bienvenue!"  
}  
  
// es.json  
{  
  "welcome": "¡Bienvenido!"  
}  

भाषा स्विचिंग

भाषा स्विचिंगला परवानगी देण्यासाठी, तुम्ही भाषा स्विचर टूल तयार करू शकता आणि i18n.changeLanguage फंक्शन वापरू शकता:

 

import { useTranslation } from 'next-i18next';  
  
function LanguageSwitcher() {  
  const { i18n } = useTranslation();  
  
  const handleChangeLanguage =(newLanguage) => {  
    i18n.changeLanguage(newLanguage);  
  };  
  
  return( 
    <div>  
      <button onClick={() => handleChangeLanguage('en')}>English</button>  
      <button onClick={() => handleChangeLanguage('fr')}>Français</button>  
      <button onClick={() => handleChangeLanguage('es')}>Español</button>  
    </div>  
 );  
}  

निष्कर्ष

Next.js या विभागात तुमची लायब्ररी वापरून तुमच्या अॅप्लिकेशनमध्ये आंतरराष्ट्रीयकरण(i18n) लागू करण्याच्या प्रक्रियेची ओळख करून दिली next-i18next. भाषा-विशिष्ट सामग्री प्रदान करून आणि वापरकर्त्यांना भाषा बदलण्यास सक्षम करून, तुम्ही तुमच्या वापरकर्त्यांसाठी एक आकर्षक बहुभाषिक अनुभव तयार करू शकता.