[FEAT] next-intl 기반 다국어(영어/한국어) 지원 세팅

apps/timo-web/app/[locale]/layout.tsx

@@ -0,0 +1,51 @@
+import "./globals.css";
+import localFont from "next/font/local";
+import { notFound } from "next/navigation";
+import { hasLocale, NextIntlClientProvider } from "next-intl";
+
+import type { Metadata } from "next";
+
+import { routing } from "@/i18n/routing";
+import { QueryProvider } from "@/providers/QueryProvider";
+
+const pretendard = localFont({
+  src: "./fonts/PretendardVariable.woff2",
+  variable: "--font-family-pretendard",
+  weight: "45 920",
+  display: "swap",
+});
+
+export const metadata: Metadata = {
+  title: "Timo",
+  description: "Timo web",
+};
+
+interface RootLayoutProps {
+  children: React.ReactNode;
+  params: Promise<{ locale: string }>;
+}
+
+export function generateStaticParams() {
+  return routing.locales.map((locale) => ({ locale }));
+}
+
+export default async function RootLayout({
+  children,
+  params,
+}: Readonly<RootLayoutProps>) {
+  const { locale } = await params;
+
+  if (!hasLocale(routing.locales, locale)) {
+    notFound();
+  }
+
+  return (
+    <html lang={locale} className={pretendard.variable}>
+      <body>
+        <NextIntlClientProvider>
+          <QueryProvider>{children}</QueryProvider>
+        </NextIntlClientProvider>
+      </body>
+    </html>
+  );
+}

apps/timo-web/app/[locale]/page.tsx

@@ -0,0 +1,7 @@
+import { useTranslations } from "next-intl";
+
+export default function Home() {
+  const t = useTranslations("HomePage");
+
+  return <>{t("title")}</>;
+}

apps/timo-web/i18n/navigation.ts

@@ -0,0 +1,6 @@
+import { createNavigation } from "next-intl/navigation";
+
+import { routing } from "./routing";
+
+export const { Link, redirect, usePathname, useRouter, getPathname } =
+  createNavigation(routing);

apps/timo-web/i18n/request.ts

@@ -0,0 +1,16 @@
+import { hasLocale } from "next-intl";
+import { getRequestConfig } from "next-intl/server";
+
+import { routing } from "./routing";
+
+export default getRequestConfig(async ({ requestLocale }) => {
+  const requested = await requestLocale;
+  const locale = hasLocale(routing.locales, requested)
+    ? requested
+    : routing.defaultLocale;
+
+  return {
+    locale,
+    messages: (await import(`../messages/${locale}.json`)).default,
+  };
+});

apps/timo-web/i18n/routing.ts

@@ -0,0 +1,7 @@
+import { defineRouting } from "next-intl/routing";
+
+export const routing = defineRouting({
+  locales: ["en", "ko"],
+  defaultLocale: "en",
+  localePrefix: "as-needed",
+});

apps/timo-web/messages/en.json

@@ -0,0 +1,5 @@
+{
+  "HomePage": {
+    "title": "Hi Timo"
+  }
+}

apps/timo-web/messages/ko.json

@@ -0,0 +1,5 @@
+{
+  "HomePage": {
+    "title": "안녕 티모"
+  }
+}

apps/timo-web/next.config.js

@@ -1,12 +1,15 @@
 /* global process */
 import { withSentryConfig } from "@sentry/nextjs";
+import createNextIntlPlugin from "next-intl/plugin";
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   transpilePackages: ["@repo/timo-design-system"],
 };
 
-export default withSentryConfig(nextConfig, {
+const withNextIntl = createNextIntlPlugin();
+
+export default withSentryConfig(withNextIntl(nextConfig), {
   org: "timo-client",
   project: "timo-web",
   authToken: process.env["SENTRY_AUTH_TOKEN"],

apps/timo-web/package.json

@@ -17,6 +17,7 @@
     "@tanstack/react-query-devtools": "^5.101.1",
     "axios": "^1.18.1",
     "next": "16.2.0",
+    "next-intl": "^4.13.1",
     "react": "^19.2.0",
     "react-dom": "^19.2.0",
     "zod": "^4.4.3"

apps/timo-web/proxy.ts

@@ -0,0 +1,9 @@
+import createMiddleware from "next-intl/middleware";
+
+import { routing } from "./i18n/routing";
+
+export default createMiddleware(routing);
+
+export const config = {
+  matcher: ["/((?!api|_next|.*\\..*).*)"],
+};