next-intl-translations

Standardize translation keys across Next.js locales with scoped providers.

Updated Feb 3, 2026
One-click install
npx skills add https://github.com/eKoh951/hytale-gg --skill next-intl-translations
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: next-intl-translations
Source: https://github.com/eKoh951/hytale-gg/tree/main/.windsurf/skills/next-intl-translations
Command: npx skills add https://github.com/eKoh951/hytale-gg --skill next-intl-translations

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This pattern simplifies managing Next.js translations across locales for hytale.GG, ensuring consistent keys and scalable workflows.

Core Features & Use Cases

  • Architecture overview for locales, messages, and merges with scoped providers.
  • Server components with useTranslations and the donut pattern for components requiring interactivity.
  • How to apply i18n patterns when adding new pages, components, or debugging locale issues.
  • Quick practical example: creating new domain message files and wiring locale loading.

Quick Start

Set up locales and messages, then run the i18n-check to verify translations.

Frequently Asked Questions about next-intl-translations

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I standardize Next.js i18n translation keys to prevent drift across locales?

Standardize i18n translation keys by applying a centralized message structure with scoped providers across Next.js projects. This ensures consistent key usage when adding new pages or debugging locale issues across multiple locales.

What is the donut pattern for Next.js server components using useTranslations?

The donut pattern enables Next.js server components to use useTranslations while maintaining interactivity. It wraps interactive client components within server-rendered layouts using scoped providers for seamless locale loading.

How do I add new pages with scoped providers for locale messages in Next.js?

Add new pages with scoped providers by creating domain message files and wiring locale loading into your Next.js architecture. This organizes translations efficiently and ensures server and client components receive the correct locale data.

Does next-intl support debugging locale issues across multiple locales like en and es?

Debugging locale issues across multiple locales like en and es is supported through a centralized message structure and i18n tooling integration. You can run i18n-check to verify translations and identify inconsistencies after loading locales.

Can I use this i18n architecture for both server and client components in Next.js?

This i18n architecture applies to both server and client components in Next.js. It provides patterns for using useTranslations in server components and wiring scoped providers for client-side interactivity without causing key drift.

What is the best way to organize locale messages and merges in a Next.js i18n setup?

The best way to organize locale messages and merges is adopting a centralized message structure with scoped providers. This architecture standardizes translation loading and prevents friction when scaling i18n implementation across new domains.