Implement Awesome Next.js 14 Internationalization (i18n) with App Router and next-intl

Показать описание

I show you how to use next-intl to translate / internationalize your webapp in nextjs in multiple languages to provide best user experience and less effort!

video specific links:

language switcher:

Chapters:
00:00 What is Internationalization
0:47 Why should u use it
1:28 Implementation
10:26 Async Components
11:37 Client Approach
13:23 Additional Informations and Tips

🙋🏼‍♂️ find me also here:

_______________________

⚡️ About me and this channel

Hello World! 👋🏼 My name is Tobi and I'm a webdeveloper from Germany ✨ On this channel you will find free educational content about everything related to the web, from frontend to backend!

Рекомендации по теме

Комментарии

The smooth transitions in the video are amazing! Loved it much!! 🔥🔥🔥

justice

I was working on a new project that needed internationalization, been working with next for a few months now but decided to give up and just use react, the whole process feels ALOT smoother and less headache

seifadel

Nice, very well explained, thank you.

CarlosEnriqueGamboa

fucking love you dude. i have to present a web TOMORROW, and i thougt translation was easy, now im facing a long nigth literally writing t everywhere in like 40 or 50 components. haha fun.

fedewoodward

Nice explanation and helpful content, keep going

sidiqcumar

Great tutorial! I was able to easily translate all the static content in my app, but I've been struggling to find a way to translate dynamic content that comes from API responses. Is there any method or best practice for translating dynamic content fetched from an API?

jaydippatel

Will this approach work well in the context of SEO (indexing)? I mean when using client-side hooks. And very well explained, thank you

OleksiiMazurenko

usage of next-intl in server components currently opts into dynamic rendering, getting this error while deploying

AmitHariyale-mc

what if i got many client sub components ? passing the t object all the way long?

libergong

how to combine this middleware with auth.js middleware?

-mahmoudadel

How to export build after Internationalization (i18n)?

msadiqsiddiqui

Can someone give me the name of the font family in this editor vscode

StrangeBird-mx

Implement Awesome Next.js 14 Internationalization (i18n) with App Router and next-intl

Implement Awesome Next.js 14 Internationalization (i18n) with App Router and next-intl

Internationalization in NextJs 14 with Next-Intl | i18n

Next.js App Router with i18next (Internationalization Tutorial)

NextJS APP Router | i18n Internationalization (i18next - next-intl) | Multiple languages (idioms)

Internationalization (i18n) with Next.js!

The basics - Internationalization with Next.js in 2024 (app router)

Building Internationalization in a Static NextJS Application Without External Libraries

Next.js App Directory & i18n - Full Tutorial

React i18next (Complete Tutorial)

Internationalization with Next.js 🗺️ Adding i18n to an existing React app! 🔴 LIVE Coding & Chill...

Next JS 13 next-intl Internationalization i18n - Add translations to your application

Choosing between third party libraries - Next.js Internationalization in 2024 with the app router

Next.js 15 is here! Does it fix Next 14?

Next.js 14 + Tailwind CSS + i18n + Headless CMS - Build and Deploy a Modern Next JS 14 App

Add Multi Language Support in Next.js 15 Project

Node.js Internationalization (i18n) Working Group

Next.js MDX is pretty awesome

Next.js + Strapi - #Internationalization (i18n)

Fastest way to add translation to your website.

Build a Multi language React and Next.js App And Deploy

Node.js Internationalization (i18n) Working Group

Internationalization in JavaScript with NodeJS

Nuxt in 100 Seconds

i18next Crash Course | the JavaScript i18n framework