เขียนเว็บสองภาษาด้วย React และ i18next

wk
2 min readFeb 21, 2020

--

ตัวอย่างเว็บที่มีสองภาษา สามารถเปลี่ยน ไทย/อังกฤษ ผ่านปุ่มสลับภาษา ตัวอย่างนี้เขียนด้วย React และใช้ Library i18next

1. สร้าง Project และติดตั้ง Package

2. เขียน UI ด้วย TypeScript

  1. ไฟล์​ src/shared/lib.ts ใช้เก็บข้อความทั้งภาษาไทยและอังกฤษ สำหรับแสดงผลในหน้าเว็บ

2. ไฟล์ src/pages/Pages.tsx เก็บ Component หน้า Home และ About

3. ไฟล์ src/Index.tsx เป็นไฟล์หลักของ React มีการประกาศ Router และเขียน Logic ต่าง ๆ ไว้ในไฟล์นี้

4. ไฟล์ src/Index.html สำหรับแสดงผล

3. Build โปรแกรมด้วย Parcel

4. ทดสอบโปรแกรมผ่าน URL http://localhost:1234

  • หน้า Home
  • หน้า About

--

--

No responses yet