Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/clement-muth/nextjs-appdir-linguijs-rsc
Linguijs integration with Next.js 14 appdir and React Server Components
https://github.com/clement-muth/nextjs-appdir-linguijs-rsc
app-router-nextjs appdir i18n i18next internationalization linguijs nextjs-appdir-linguijs nextjs14 react react-server-components react-server-components-i18n rsc server-side-rendering ssr swc swc-plugin
Last synced: 3 days ago
JSON representation
Linguijs integration with Next.js 14 appdir and React Server Components
- Host: GitHub
- URL: https://github.com/clement-muth/nextjs-appdir-linguijs-rsc
- Owner: Clement-Muth
- License: mit
- Created: 2024-05-04T00:20:27.000Z (10 months ago)
- Default Branch: master
- Last Pushed: 2024-05-04T01:39:37.000Z (10 months ago)
- Last Synced: 2024-12-27T17:35:23.981Z (about 2 months ago)
- Topics: app-router-nextjs, appdir, i18n, i18next, internationalization, linguijs, nextjs-appdir-linguijs, nextjs14, react, react-server-components, react-server-components-i18n, rsc, server-side-rendering, ssr, swc, swc-plugin
- Language: TypeScript
- Homepage: https://nextjs-appdir-linguijs-rsc.vercel.app/fr
- Size: 1.94 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Linguijs Integration with Next.js 14 appdir and React Server Components
This repo showcases an example of integrating the Linguijs library with Next.js 14 appdir and React Server Components for building multilingual applications.
## Features
- [x] Full Integration of Linguijs with Next.js 14 appdir
## Frameworks
- Linguijs
- Next.js 14
- React Server Components
## Version
For this example, we use the follow versions :
```json
"dependencies": {
"@lingui/cli": "4.8.0",
"@lingui/core": "4.8.0",
"@lingui/react": "4.8.0",
"next": "14.1.0"
},
"devDependencies": {
"@lingui/cli": "4.8.0",
"@lingui/loader": "4.8.0",
"@lingui/macro": "4.8.0",
"@lingui/swc-plugin": "4.0.6"
}
```
## SWC Compatibility
SWC Plugin support is still experimental. Semver backwards compatibility between different `next-swc` versions is not guaranteed.
Therefore, you need to select an appropriate version of the Lingui plugin to match compatible `NextJs` version.
You also need to add the `@lingui/swc-plugin` dependency with strict version without a range specifier.
```json
{
"devDependencies": {
"@lingui/swc-plugin": "4.0.6"
}
}
```
For more information on compatibility, please refer to the [Compatibility section](https://github.com/lingui/swc-plugin#compatibility).
## Important Notes
- You **should not have** a babel config in the project, otherwise Next will turn off SWC compiler in favor of babel.
- The actual code is compiled with SWC + Lingui SWC plugin.
## Installation
### Prerequisites
Node.js v16 or higher
npm or yarn
### Installation
#### Clone this repo :
```Bash
git clone [email protected]:Clement-Muth/nextjs-appdir-linguijs-rsc.git
```
#### Access the project directory :
```Bash
cd nextjs-appdir-linguijs-rsc
```
#### Install dependencies - Start the development server :
```Bash
make up
```
#### Open your browser to http://localhost:3000/en.
## ⚡ Deploy Now
[](https://vercel.com/new/clone?repository-url=https://github.com/Clement-Muth/nextjs-appdir-linguijs-rsc)
## Documentation
[Documentation Linguijs](https://lingui.dev/)
[Documentation Next.js](https://nextjs.org/)
[Documentation RSC](https://vercel.com/blog/understanding-react-server-components)
## Contribution
Try this repo and share your feedback with me! I would be delighted to receive your suggestions and contributions.
## Mention
This repository is based on the [Lingui's documentation](https://github.com/fromthemills/js-lingui/blob/sc-docs-example/examples/nextjs-app/README.md)
