React i18n reso semplice
Internazionalizzazione type-safe per applicazioni React con hook, context e distribuzione CDN senza interruzioni.
Get started in 3 steps
Install
Add @better-i18n/use-intl and use-intl to your project.
npm install @better-i18n/use-intl use-intl
Wrap your app with BetterI18nProvider
Place the provider at the root of your component tree. It fetches messages from the CDN and makes them available via hooks.
import { BetterI18nProvider } from '@better-i18n/use-intl';
function App() {
return (
<BetterI18nProvider project="your-org/your-project" locale="en">
<YourApp />
</BetterI18nProvider>
);
}Use translations
Call useTranslations() in any component to access your translation keys with full TypeScript support.
import { useTranslations } from '@better-i18n/use-intl';
function MyComponent() {
const t = useTranslations('common');
return <h1>{t('welcome')}</h1>;
}Funzionalità
Installation & Setup
Get started with @better-i18n/use-intl in three steps — install, wrap your app with the provider, and start translating.
# 1. Install
npm install @better-i18n/use-intl
# 2. Wrap your app
import { BetterI18nProvider } from '@better-i18n/use-intl'
function App() {
return (
<BetterI18nProvider project="org/project" locale="en">
<YourApp />
</BetterI18nProvider>
)
}
# 3. Use translations
import { useTranslations } from '@better-i18n/use-intl'
function MyComponent() {
const t = useTranslations('common')
return <h1>{t('welcome')}</h1>
}Funziona con le librerie i18n React più diffuse
Better i18n non sostituisce la tua libreria i18n preferita: è il layer di gestione traduzioni che le rende ancora più potenti.
Better i18n + react-intl
La libreria i18n per React più popolare con supporto al formato messaggi ICU. Usata da migliaia di app in produzione.
Better i18n sincronizza le tue traduzioni direttamente nel formato JSON di react-intl. Modifica nella dashboard e vedi subito i cambiamenti nell'app.
Better i18n + react-i18next
Potente framework i18n per React basato su i18next. Funzionalità integrate come namespace, interpolazione e plurali.
Esporta JSON compatibile con i18next e namespace. Better i18n gestisce il workflow di traduzione, i18next gestisce il runtime.
Better i18n + FormatJS
Una suite di librerie per l'internazionalizzazione che include react-intl. Supporta la sintassi ICU Message e i dati CLDR.
Better i18n supporta nativamente il formato messaggi ICU. Gestisci plurali e selezioni complesse in modo visuale, esporta nel formato FormatJS.
Better i18n + Lingui
Una libreria i18n leggibile, automatizzata e ottimizzata. Ottima DX con estrazione messaggi basata su macro.
Estrai i messaggi con Lingui CLI, gestisci le traduzioni in Better i18n e sincronizza automaticamente tramite integrazione GitHub.
Avvio rapido
Inizia con Better i18n nella tua app React in pochi minuti.
import { useTranslations } from '@better-i18n/use-intl';
function MyComponent() {
const t = useTranslations('common');
return (
<div>
<h1>{t('welcome')}</h1>
<p>{t('greeting', { name: 'World' })}</p>
</div>
);
}Related Articles
How to Add i18n to Shopify Hydrogen (Complete Guide)
Shopify Hydrogen is the modern way to build custom storefronts — but adding internationalization (i18n) can be challenging. You need locale-aware routing,...
Read more →Django i18n with AI Translation: Complete Setup Guide
Django i18n with AI Translation: Complete Setup Guide Django ships with a mature internationalization (i18n) framework built on GNU gettext. When you...
Read more →Better i18n vs. Crowdin: An Honest Comparison for Modern App Teams
Crowdin has been the default choice for translation management for years. It's mature, feature-rich, and most localization engineers have used it at some...
Read more →Inizia a sviluppare con React i18n
Piano gratuito disponibile. Nessuna carta di credito richiesta.