คุณแชร์เซิร์ฟเวอร์ dev ในเครื่องกับใครก็ได้บนอินเทอร์เน็ตได้โดยเปิดผ่าน URL HTTPS สาธารณะ tunnel localhost เปลี่ยนงานที่กำลังทำให้เป็นลิงก์พรีวิวสดในไม่กี่วินาที — ไม่ต้อง deploy staging ไม่ต้อง VPN และไม่ต้องแชร์หน้าจอ
ทำไมแชร์ localhost แทนการ deploy ไป staging?
การ deploy staging ใช้ได้สำหรับการตรวจ integration ขั้นสุดท้าย แต่ช้าสำหรับการทำงานร่วมรายวัน เมื่อดีไซเนอร์ต้องรีวิวการปรับ UI, PM อยากทดสอบ flow ใหม่ หรือลูกค้าขอเดโม การรอ pipeline CI/CD เพิ่มแรงเสียดทานที่ไม่จำเป็น
tunnel localhost ให้ลูปฟีดแบ็กทันที: เปลี่ยนโค้ดในเครื่อง รีเฟรช URL ที่แชร์ และผู้ร่วมงานเห็นการอัปเดตทันที
ใครได้ประโยชน์จากพรีวิวในเครื่องที่แชร์?
- ดีไซเนอร์: รีวิว layout responsive และการโต้ตอบบน URL จริง
- Product manager: ตรวจ flow ฟีเจอร์ก่อน merge code review
- วิศวกร QA: ทดสอบ edge case บน branch ที่แท้จริงของนักพัฒนา
- ลูกค้าและผู้มีส่วนได้ส่วนเสีย: เห็นงานที่กำลังทำโดยไม่เข้าถึงโครงสร้างภายในของคุณ
- เพื่อนร่วมงานทางไกล: ทำงานร่วมข้ามเขตเวลาโดยไม่ต้องแชร์ VPN
แชร์เซิร์ฟเวอร์ dev ในเครื่องด้วยคำสั่งเดียว
- เริ่มแอปในเครื่อง (เช่นพอร์ต 3000)
- รัน
npx portpreview 3000เพื่อสร้าง URL HTTPS สาธารณะ - คัดลอก URL และส่งให้ผู้ร่วมงานผ่าน Slack, อีเมล หรือเครื่องมือโปรเจกต์
- พวกเขาเปิดลิงก์ในเบราว์เซอร์ใดก็ได้ — ไม่ต้องมีซอฟต์แวร์พิเศษ
- เปิด tunnel ไว้ขณะเซสชันรีวิวทำงาน แล้วหยุดเมื่อเสร็จ
แนวปฏิบัติที่ดีในการแชร์พรีวิวในเครื่อง
ใช้ข้อมูลทดสอบ ไม่ใช่ production
พรีวิวที่แชร์ควรใช้ credential sandbox และข้อมูลทดสอบที่ไม่ระบุตัวตน อย่าเปิดเผยฐานข้อมูล production หรือข้อมูลลูกค้าจริงผ่าน tunnel การพัฒนา
ตั้งความคาดหวังเรื่อง uptime
URL tunnel ทำงานเฉพาะขณะเซสชัน CLI ทำงาน บอกผู้ร่วมงานว่าลิงก์หมดอายุเมื่อคุณปิดแล็ปท็อปหรือหยุด tunnel
ทดสอบบนอุปกรณ์จริง
URL ที่แชร์ทำงานบนโทรศัพท์และแท็บเล็ตด้วย สำหรับรีวิวเฉพาะมือถือ ดูคู่มือของเราเรื่อง การทดสอบมือถือด้วย tunnel localhost
ป้องกันฟีเจอร์ที่ละเอียดอ่อน
หากพรีวิวมีแผง admin หรือฟีเจอร์ที่ยังไม่เปิดตัว เพิ่ม basic auth หรือ feature flag แทนการแชร์ URL tunnel ที่ไม่ป้องกันอย่างกว้าง
พรีวิวในเครื่อง vs staging vs แชร์หน้าจอ
- แชร์หน้าจอ: เร็วแต่เฉื่อย — ผู้รีวิวโต้ตอบเองไม่ได้
- deploy staging: สภาพแวดล้อมสมจริงแต่วนซ้ำช้า (นาทีถึงชั่วโมง)
- tunnel localhost: ทันที โต้ตอบได้ และผูกกับ branch ปัจจุบันของคุณ
กรณีใช้งานทั่วไป
เซสชันรีวิวดีไซน์ เดโม sprint การพาลูกค้าชม การทดสอบ flow OAuth กับผู้ให้บริการภายนอก และ QA ข้ามเบราว์เซอร์ ล้วนได้ประโยชน์จาก URL ในเครื่องที่แชร์ได้ สำหรับการตั้งค่าเฉพาะ OAuth อ่าน วิธีทดสอบ callback OAuth ในเครื่อง
เริ่มใช้ PortPreview ฟรี เพื่อแชร์พรีวิวในเครื่องพร้อมการมองเห็นคำขอในตัว