Asked thg 3 13, 2021 1:25 SA 273 0 2
  • 273 0 2
+2

Chức năng đa ngôn ngữ trong web/app

Share
  • 273 0 2

Chào các a/c và toàn thể các bạn.

Gần đây mình có đang tìm hiểu về cách làm web/app đa ngôn ngữ. Làm quen với React nên mình tìm thấy có thư viện react-i18n hay được sử dụng để phục vụ cv này. Nhưng theo suy nghĩ thông thường của mình, nếu để làm đa ngôn ngữ mình sẽ định nghĩa các loại ngôn ngữ ra các file và đặt tên theo biến.

Trong compoent mình import chúng vào và check xem người dùng đang chọn loại ngôn ngữ nào ( cái này có thể quản lý bằng state hoặc lưu dưới local-storage) sau đó sẽ hiển thị các nội dung của titile, heading, table vvv... theo ngôn ngữ tương ứng.

Với dữ liệu data từ api thì mình nghĩ khi gửi req lên sẽ thêm cả param kiểu như language="en"/"vi" để BE trả về dữ liệu phù hợp và client chỉ việc hiển thị ra thôi.

Vậy cho mình hỏi như vậy liệu chưa đủ để có thể làm được một web đa ngôn ngữ mà không cần đến sự trợ giúp của các thư viện như react-i18.

Hay còn trường hợp nào mình chưa nghĩ đến không, mong mọi người chỉ giáo mình với ạ

2 ANSWERS


Answered thg 3 13, 2021 1:56 SA
+3

Theo mình thì cách của bạn không cần sử dụng thư viện ngoài. React-i18next chỉ hữu ích khi các bước localize bạn thực hiện hoàn toàn trên phía client (+ quen với hệ sinh thái i18next), còn sử dụng dữ liệu đa ngữ từ BE thì có thể áp dụng các cách đơn giản, truyền thống như của bạn.

Nhìn chung thì nên nghiêng về giải pháp đơn giản và ko lệ thuộc thư viện ngoài nếu có thể 👍

Share
Avatar Anh Tran @thanh_tuan
thg 3 13, 2021 8:34 SA

nhưng mình nghĩ ngoài để làm nhanh ra thì môt thư viện được viết ra chắc chắn nó phải có điểm gì vượt trội hơn code thuần, chỉ có điều m vẫn chưa biết khai thác trong tình huống nào

0
| Reply
Share
Avatar Khang @khangnd
thg 3 14, 2021 1:00 SA

Thường thì fw hay lib nào cũng vậy, trên trang chủ sẽ có vài ba dòng giới thiệu về tính năng, bạn có thể xem nếu phù hợp với mục đích sử dụng của dự án thì xài. Vd như cái react-i18next này, trên trang chủ có để là:

  • Dành cho dự án React / React Native
  • Cung cấp nhiều component tiện ích, vd như kiểm tra khi ngôn ngữ đc load, thay đổi và nội dung cần render lại v.v...
  • Tối ưu cho SSR như Next.js
  • Dựa trên i18next -> nếu đã quen với i18next thì sẽ thích nghi nhanh hơn

Có thể sử dụng fw/lib sẽ nhanh hơn trong nhiều trường hợp, nhưng cũng có trường hợp bạn phải đi đọc doc, tìm hiểu hệ sinh thái của fw/lib đó mà deadline ko cho phép thì giải pháp đơn giản, truyền thống vẫn sẽ tốt hơn.

+1
| Reply
Share
Answered thg 3 13, 2021 1:28 SA
+2

Theo mình còn trường hợp text trên file jsx nữa chứ nhỉ? mấy cái text trên view mà ko thông qua api

Share
Avatar Anh Tran @thanh_tuan
thg 3 13, 2021 1:30 SA

Text thì như trên mình nói là mình định nghĩa ra từng file constant như kiểu biến xong gọi vào ấy bạn

0
| Reply
Share
Avatar Tun Tun @TuanLinhChi
thg 3 13, 2021 4:18 SA

@thanh_tuan thì đó nó giống với việc bạn code thuần ngôn ngữ và sử dụng framework hỗ trợ. Nếu bạn thích thì có thể code thuần bằng ngôn ngữ bạn chọn. Hoặc sử dụng hỗ trợ từ những người đã từng ở trong tình huống bạn, người ta mỗ hình hóa lên sử dụng dễ hơn. ✌️

0
| Reply
Share
Avatar Anh Tran @thanh_tuan
thg 3 13, 2021 8:33 SA

@TuanLinhChi nhưng mình nghĩ ngoài để làm nhanh ra thì môt thư viện được viết ra chắc chắn nó phải có điểm gì vượt trội hơn code thuần, chỉ có điều m vẫn chưa biết khai thác trong tình huống nào

0
| Reply
Share
Viblo
Let's register a Viblo Account to get more interesting posts.