ส่วนขยาย Chrome ที่ช่วยค้นหาซอร์สโค้ดของคอมโพเนนต์ React
(chromewebstore.google.com)นี่คือ Chrome Extension ที่ช่วยให้ค้นหาซอร์สโค้ดของคอมโพเนนต์ React ได้อย่างรวดเร็วผ่านองค์ประกอบที่ถูกเรนเดอร์อยู่บนเบราว์เซอร์
ส่วนขยายนี้ถูกสร้างขึ้นระหว่างการทำสตัดดี้ภายในบริษัทเกี่ยวกับการเจาะดูซอร์สโค้ด React ภายใต้คอนเซปต์ว่า "ถ้าอ่านซอร์สโค้ด React ก็ทำแบบนี้ได้เหมือนกัน" เดิมทีไม่ได้โปรโมตหรือแนะนำอย่างเป็นทางการมาก่อน แต่มีนักพัฒนาจากสหรัฐอเมริกาและอินเดียจำนวนไม่น้อยที่ใช้งานกันแบบปากต่อปาก เลยขอนำมาแนะนำครับ
หลังติดตั้งส่วนขยายแล้ว หากเปิดแท็บ React Code Finder ในเครื่องมือนักพัฒนา คุณจะสามารถค้นหาโค้ดคอมโพเนนต์ในสภาพแวดล้อมการพัฒนาได้อย่างรวดเร็ว แล้วเปิดด้วย IDE หรือแก้ไขได้ทันที
น่าจะเป็นประโยชน์สำหรับคนที่เมื่อแอปมีขนาดใหญ่ขึ้นแล้วค้นหาซอร์สโค้ดจากองค์ประกอบที่เรนเดอร์อยู่ได้ยาก คนที่รู้สึกว่าการใช้งานของส่วนขยาย react-devtools ยังไม่ตอบโจทย์ และคนที่อยากแก้โค้ดแบบเรียลไทม์พร้อมตรวจสอบการเปลี่ยนแปลงบนเบราว์เซอร์
วิธีใช้งานอย่างละเอียดดูได้ที่ README.md ด้านล่างครับ~!
https://github.com/Jonghakseo/react-code-finder-extension/…
ลิงก์ Github
https://github.com/Jonghakseo/react-code-finder-extension
https://github.com/Jonghakseo/react-code-finder-server
1 ความคิดเห็น
ขอเสริมว่า พอเผยแพร่ส่วนขยายไปแล้วก็พบว่ามีผลิตภัณฑ์ที่เป็นส่วนขยาย/ไลบรารีคล้ายกันอยู่ก่อนแล้วในชื่อ Locatorjs!
จากประสบการณ์การใช้งานส่วนตัว ผมรู้สึกว่าส่วนขยายของผมใช้งานสะดวกกว่านิดหน่อย แต่ก็คิดว่าอาจเป็นเพราะผมคุ้นเคยกับมันมากกว่าก็ได้ ฮ่าๆๆ
ถ้าใครสนใจฟีเจอร์ลักษณะนี้ ลองดูผลิตภัณฑ์ดังกล่าวประกอบกันได้เลยครับ
https://www.locatorjs.com/