<img alt="next-intl" src="https://github.com/amannn/next-intl/raw/v4.13.1/media/logo.svg" width="600">
Internationalization for Next.js.
Internationalization (i18n) is an essential part of the user experience, therefore next-intl gives you all the parts you need to get language nuances right.
// UserProfile.tsx
import {useTranslations} from 'next-intl';
export default function UserProfile({user}) {
const t = useTranslations('UserProfile');
return (
<section>
<h1>{t('title', {firstName: user.firstName})}</h1>
{t('membership', {memberSince: user.memberSince})}
{t('followers', {count: user.numFollowers})}
</section>
);
}
// en.json
{
"UserProfile": {
"title": "{firstName}'s profile",
"membership": "Member since {memberSince, date, short}",
"followers": "{count, plural, ↵
=0 {No followers yet} ↵
=1 {One follower} ↵
other {# followers} ↵
}"
}
}
Hosted on Vercel
$ claude mcp add next-intl \
-- python -m otcore.mcp_server <graph>