next.js-localized

KO | EN

gitlite — search

#javascript #ai #typescript #llm #golang #android #machine-learning #rust #macos #windows #cli #vue #pytorch #mcp

next.js-localized

(★ 11)

A starting point for performant localization in Next.js.

next.js-localized 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Faire's Next.js Localization Starter Kit

> [!NOTE]
> This starter kit is based off of our blog post [Zero-runtime localization in Next.js](https://craft.faire.com/zero-runtime-localization-in-next-js-864e252e387d). Please note that it is not maintained.

This repo is designed as a starting point for performant localization
in Next.js.

## Features

- **Build-time splitting of translations**: Translations are split into
	separate files at build time, so that only the necessary translations
	are shipped to the browser.
- **Server and client side formatting**: Translations can occur both in server and client components.
- **Fully customizable locale structure**: You can define your own list of locales in [`locale.ts`](src/lib/locale.ts) and the [`dictionaries`](dictionaries) directory, and the build script will automatically generate the necessary files.

## Getting Started

First, run the development server:

```bash
yarn dev # to run the native Next.js dev server (recommended)
# or
yarn dev:server # to run the custom express server that handles localizing chunk output (slower)
```

Open [`http://localhost:3000`](http://localhost:3000) with your browser to see the result!
Note that localization does not work in development mode, as the build script is not run. For more information, see the [FAQs](#faqs).

## Production build

To enable localization for the app, it must be run as a production build. To do this, run:

```bash
yarn build
yarn start
```

## FAQs

### Why doesn't localization work in development mode?

Localization is a build-time process, and the build script is not run in development mode. This is because Next.js automatically recreates the .next folder in development mode, so running the script to create the localized chunks would not work.

In theory, localization would still work for server-rendered translations as they read
directly from the dictionaries, but this is omitted to prevent confusion as to why some
messages are not translated.

### How can I add or change the accepted locales?

You can define your own list of locales in [`locale.ts`](src/lib/locale.ts), along with a default locale. Once you have done so, be sure to include all of your dictionary JSON files in the [`dictionaries`](dictionaries) directory (except for your default locale), and the build script will automatically generate the necessary files.

### Do I need to use `LocaleSwitchLink` for every link in my app?

No, you only need to use LocaleSwitchLink when you want to change between locales (for instance, redirecting from /en-US to /fr-FR). For links that should stay within the same locale, you can use Next.js's built-in `Link` component.

### How can I access the current locale in my components?

In server components, you can use [`getLocaleHeader`](src/lib/headers.ts). For client components, you can use the `useIntl` hook from react-intl.

next.js-localized

next.js-localized 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

next.js-localized

next.js-localized 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README