Nâng CaoReact iconReact

i18n (đa ngôn ngữ) là gì? Triển khai multi-language trong React project thế nào?

i18n (internationalization) là kỹ thuật giúp app hỗ trợ nhiều ngôn ngữ. Cách làm:

  1. Tách tất cả text ra file JSON theo ngôn ngữ (vi.json, en.json), không hardcode text trong component
  2. Dùng thư viện react-i18next hoặc next-intl (cho Next.js) — gọi t('greeting') thay vì viết 'Xin chào' trực tiếp
  1. Lazy load file ngôn ngữ để không tải hết cùng lúc
  2. Dùng Intl API có sẵn trong browser để format ngày tháng, số, tiền tệ theo locale
  3. Next.js hỗ trợ routing theo locale: /en/about, /vi/about qua middleware

next-intl hiện là lựa chọn phổ biến nhất cho Next.js App Router.

Xem toàn bộ React cùng filter theo level & chủ đề con.

Mở danh sách React