더 작은 JavaScript 번들
클라이언트로 전송되는 React Context나 훅 없음
이 페이지는 서버 컴포넌트입니다 - 'use client' 지시문이 필요 없습니다!
import { headers } from "next/headers";
import { createServerTranslation, getServerLanguage } from "i18nexus/server";
import commonEn from "@/locales/common/en.json";
import commonKo from "@/locales/common/ko.json";
import serverExampleEn from "@/locales/server-example/en.json";
import serverExampleKo from "@/locales/server-example/ko.json";
const translations = {
common: { en: commonEn, ko: commonKo },
"server-example": { en: serverExampleEn, ko: serverExampleKo },
};
export default async function Page() {
const language = getServerLanguage(await headers(), {
defaultLanguage: "ko",
availableLanguages: ["en", "ko"],
});
const t = createServerTranslation(language, translations);
return (
<main>
<h1>{t("Server Component Example")}</h1>
<p>{language}</p>
</main>
);
}클라이언트로 전송되는 React Context나 훅 없음
서버에서 렌더링된 번역
올바른 언어로 완전히 렌더링된 HTML
서버와 클라이언트가 항상 동기화됨