
How I Added 6 Languages to a Next.js App in One Day
I decided to ship my AI fortune-telling app to 6 countries. Korea, US, Japan, China, Vietnam, India. Will Korean fortune-telling (saju — four-pillar destiny analysis based on birth date and time) work outside East Asia? No idea. But tarot and astrology are global. "AI analyzes your destiny" probably gets clicks everywhere. The problem: hardcoded Korean strings were scattered across every page. Why next-intl For Next.js 15 App Router, next-intl was the cleanest option. Native App Router support with [locale] dynamic segments. Middleware auto-redirects based on browser language. Same useTranslations() hook works in both Server and Client Components. apps/web/ ├── app/ │ ├── [locale]/ ← all pages live here now │ │ ├── page.tsx │ │ ├── result/page.tsx │ │ └── layout.tsx ← html lang={locale} here │ └── layout.tsx ← empty pass-through ├── i18n/ │ ├── config.ts ← locales, defaultLocale │ ├── routing.ts ← localePrefix: "as-needed" │ └── navigation.ts ← i18n-aware Link, useRouter ├── messages/
Continue reading on Dev.to Webdev
Opens in a new tab


