i18n-nextjs-rules

What problem does it solve?

This Skill provides clear, production-oriented guidance to implement internationalization in Next.js App Router projects, removing uncertainty around locale routing, message organization, pluralization, date/number formatting, RTL layout, and middleware-based locale detection.

Core Features & Use Cases

• next-intl setup: Configure routing, locale list, and re-export typed message bundles for Server and Client Components.
• Translation APIs: Use useTranslations in components and getTranslations in Server Actions to load scoped messages.
• ICU MessageFormat & formatting: Use ICU for plurals/select and useFormatter for dates, numbers, currency, relative time and lists.
• File organization: Split translations by feature for large apps and merge at runtime.
• RTL & accessibility: Detect RTL locales to set html dir and prefer logical CSS properties to adapt UI.
• Middleware locale detection: Implement URL → Cookie → Accept-Language → default fallback using next-intl middleware matcher.
• Use Case: Build a multi-locale storefront that shows localized product counts, currency formatting, and RTL layouts while automatically detecting the user's locale.

Quick Start

Configure next-intl routing and a messages directory, add middleware that detects locale by URL then cookie then Accept-Language with a default fallback, and use useTranslations/getTranslations and useFormatter in your components.