รูปแบบ localization ที่สะอาดสำหรับ route แบบ Next.js
บันทึกการจัดโครง route, metadata และ content files สำหรับหน้าแบบหลายภาษาให้ขยายจาก portfolio ไปสู่ product surface ที่ใหญ่ขึ้นได้
- เผยแพร่
- 2026-06-12
- เวลาอ่าน
- 7 นาที
route หลายภาษาจะเริ่มยุ่งเมื่อ content, metadata และ navigation โตแยกกัน วิธีที่สะอาดกว่าคือทำให้ route files บาง โหลด dictionary ใกล้ route และรวม structured content ไว้ในจุดที่นำกลับมาใช้ซ้ำได้อย่างปลอดภัย
ทำให้ route files รับผิดชอบเท่าที่จำเป็น
ผมชอบให้ route page ทำไม่กี่อย่าง: validate locale, โหลด dictionary หรือ content และส่งต่อให้ presentational component วิธีนี้ช่วยให้ metadata generation กับ page rendering เดินไปด้วยกัน
ใช้ structured content กับส่วนที่มีรูปแบบซ้ำ
ถ้า content มี field ซ้ำๆ อย่าง title, summary, tags และ body sections การย้ายไปเป็น typed data file จะลด duplication และลดความเสี่ยงเวลาแปลภาษา อีกทั้งยังกลายเป็น source เดียวสำหรับหน้า cards และ sitemap ได้ด้วย
มอง metadata ว่าเป็นส่วนหนึ่งของฟีเจอร์
หน้า localized ไม่ควรจบแค่ข้อความที่แปลแล้ว canonical URLs, alternate language links และ Open Graph content ก็ควรถูกดูแลด้วยระดับความตั้งใจเดียวกันถ้าหน้านั้นถูกออกแบบมาให้แชร์สู่สาธารณะ