10 điểm bởi unqocn 2024-11-16 | 1 bình luận | Chia sẻ qua WhatsApp

Đây là một tiện ích mở rộng Chrome cho phép nhanh chóng tìm mã nguồn của component React thông qua phần tử đã được render trên trình duyệt.

Trong lúc tham gia một buổi study nội bộ về việc đào sâu mã nguồn React, tôi đã tạo ra tiện ích này với ý tưởng "đọc mã nguồn React thì còn có thể làm được những việc như thế này". Tôi chưa từng quảng bá hay giới thiệu chính thức, nhưng khá nhiều lập trình viên ở Mỹ và Ấn Độ đã truyền tai nhau sử dụng nên nay xin giới thiệu.

Sau khi cài đặt tiện ích, hãy mở tab React Code Finder trong DevTools, bạn có thể nhanh chóng tìm mã component trong môi trường phát triển để mở bằng IDE hoặc chỉnh sửa.

Nó có thể sẽ hữu ích cho những ai gặp khó khăn trong việc nhanh chóng tìm mã nguồn dựa trên phần tử đã render khi quy mô ứng dụng ngày càng lớn, những ai chưa hài lòng với trải nghiệm sử dụng của tiện ích react-devtools, hoặc những ai muốn chỉnh sửa mã theo thời gian thực và kiểm tra thay đổi ngay trên trình duyệt.

Vui lòng tham khảo README.md bên dưới để biết cách sử dụng chi tiết!

https://github.com/Jonghakseo/react-code-finder-extension/…

Liên kết Github

https://github.com/Jonghakseo/react-code-finder-extension
https://github.com/Jonghakseo/react-code-finder-server

1 bình luận

 
unqocn 2024-11-16

Nhân tiện, sau khi phát hành extension thì mình mới thấy đã có một sản phẩm với tên Locatorjs như một extension/thư viện tương tự rồi!

Theo trải nghiệm sử dụng cá nhân, extension của mình tiện hơn một chút, nhưng mình cũng nghĩ có thể đơn giản là vì mình đã quen dùng nó thôi haha

Nếu bạn quan tâm đến kiểu tính năng này, có lẽ cũng nên tham khảo sản phẩm đó.

https://www.locatorjs.com/