Whatsapp

12 โปรแกรมเสริม Firefox สำหรับนักพัฒนา & นักออกแบบ

Anonim

เมื่อเร็วๆ นี้ เราได้เผยแพร่โพสต์เกี่ยวกับส่วนขยาย Google Chrome 12 รายการสำหรับนักพัฒนาและนักออกแบบ และในขณะที่ส่วนขยายบางส่วนมีอยู่ใน Firefox ตรงนี้ไม่ขอย้ำนะครับ

ในทำนองเดียวกัน ส่วนขยายบางรายการด้านล่างมีอยู่ใน Chrome ดังนั้นให้ถือว่าแอปดังกล่าวเป็นโบนัสสำหรับเบราว์เซอร์ที่เกี่ยวข้อง

1. เครื่องมือตรวจสอบ HTML

HTML Validator ทำงานผ่านโค้ดของคุณเพื่อให้แน่ใจว่าเป็นไปตามมาตรฐาน HTML โดยจะแสดงจำนวนข้อผิดพลาดที่เห็นบนไอคอนในแถบเครื่องมือ

HTML Validator Firefox Addon

2. Octotree

ในฐานะนักพัฒนา ฉันเรียกใช้โค้ดเพจหลายหน้าใน GitHub ทุกครั้งเมื่อค้นหาเพื่อดูว่านักพัฒนารายอื่นแก้ไขปัญหาบางอย่างได้อย่างไร . ถ้าคุณชอบฉันคุณจะพบว่า Octotreeมีประโยชน์

Octotree แสดงรหัส GitHub ในรูปแบบต้นไม้ ด้วยวิธีนี้ คุณสามารถเรียกดูโค้ดโดยไม่ต้องดาวน์โหลดไฟล์ต้นฉบับ

Octotree แสดงรหัส GitHub ในรูปแบบต้นไม้

3. HTTPS ทุกที่

HTTPS ทุกที่ เข้ารหัสข้อมูลที่คุณแลกเปลี่ยนกับหน้าเว็บหลักทั้งหมดแม้ว่าจะไม่ได้ใช้ HTTPS ก็ตาม

ดังนั้น หากคุณถูกนำไปยังเพจที่ไม่ใช้ https คุณมั่นใจได้ว่าการสื่อสารออนไลน์ของคุณปลอดภัย

4. ทดสอบประสิทธิภาพของเพจ

การทดสอบประสิทธิภาพของเพจ จะแสดงสถิติบนหน้าเว็บของคุณโดยการวัดความเร็วและประสิทธิภาพการโหลด คุณสามารถบันทึกผลลัพธ์ของแผนภูมิเพื่อเปรียบเทียบกับการทดสอบครั้งต่อๆ ไป

ทดสอบประสิทธิภาพของเพจ

5. Usersnap

Usersnap ช่วยให้คุณสามารถถ่ายภาพหน้าจอเว็บไซต์และใส่คำอธิบายประกอบโดยเพิ่มภาพวาดมาร์กอัปและความคิดเห็น นอกจากนี้ยังมาพร้อมกับไม้บรรทัดพิกเซลและสามารถรวมโดยตรงกับเครื่องมือการจัดการโครงการต่างๆ เช่น Slac, Trello และ JIRA

รายการนี้จะไม่สมบูรณ์หากไม่มี Usersnap เนื่องจากจะทำให้กระบวนการตอบรับมีประสิทธิภาพ เป็นบริการแบบชำระเงินพร้อมทดลองใช้ฟรี 14 วัน

Usersnap

6. ปิดใช้งาน JavaScript

ปิดใช้งาน JavaScript ตามชื่อที่แนะนำ ช่วยให้คุณสามารถปิด JavaScript บนเว็บไซต์หรือเฉพาะบางแท็บได้ คุณสามารถปรับแต่งให้มีสถานะเปิด/ปิด JS เริ่มต้น และลักษณะการปิดใช้งานเริ่มต้นตามโดเมน/แท็บ ฯลฯ

ปิดใช้งาน JavaScript

7. รายการตรวจสอบสำหรับนักพัฒนาเว็บ

ส่วนขยายรายการตรวจสอบสำหรับนักพัฒนาเว็บช่วยให้คุณเห็นภาพรวมว่าไซต์ของคุณใช้งานได้เพียงใดตามแนวทางการออกแบบและการพัฒนาที่ดีที่สุด

การคลิกไอคอนจะแจ้งให้คุณทราบเกี่ยวกับ SEO ของเว็บไซต์, URL ที่จำง่าย, favicon ฯลฯ พร้อมเครื่องหมายถูกข้างๆ เพื่อระบุว่าผ่าน

รายการตรวจสอบสำหรับนักพัฒนาเว็บ

8. เครื่องมือสำหรับนักพัฒนาตอบโต้

ด้วยความนิยมที่เพิ่มขึ้นอย่างไม่สิ้นสุดของ React นักพัฒนา React เกิดขึ้นเกือบทุกวันและทีม React ก็ครอบคลุม

React Developer Tools ช่วยให้คุณสามารถตรวจสอบแผนผัง React พร้อมกับสถานะ อุปกรณ์ประกอบฉาก ลำดับชั้น ฯลฯ ในการเปิดใช้งาน เปิด Firefox devtools และสลับไปที่แท็บ React

นอกจากนี้ยังมีเวอร์ชันสำหรับนักพัฒนา Vue ในรูปแบบของ Vue.js devtools

เครื่องมือสำหรับนักพัฒนา React

9. ColorZilla

ColorZilla เป็นเครื่องมือที่ยอดเยี่ยมสำหรับนักพัฒนาและนักออกแบบกราฟิกในการเลือกสีจากหน้าเว็บต่างๆ

นอกจากนี้ยังประกอบด้วย eyedropper เครื่องมือสร้างการไล่ระดับสี เบราเซอร์จานสี และประวัติสี

ColorZilla

10. เครื่องมือตัดเว็บ Evernote

Evernote Web Clipper ช่วยให้คุณสามารถถ่ายภาพหน้าจอของหน้าเว็บและบันทึกลงใน Evernote ของคุณโดยอัตโนมัติบัญชีที่คุณสามารถสร้างคำอธิบายประกอบและแบ่งปันกับสมาชิกในทีม

Evernote Web Clipper

11. ตัวจัดการคุกกี้

Cookie Manager เป็นส่วนเสริมที่คำนึงถึงความปลอดภัยซึ่งช่วยให้คุณสามารถดู เพิ่ม แก้ไข ลบ และค้นหาคุกกี้ในรูปแบบใดก็ได้ โดเมน.

สิ่งที่เจ๋งยิ่งกว่าเกี่ยวกับ Cookie Manager คือคุณสามารถส่งออกและนำเข้าคุกกี้ระหว่างโดเมนได้

ผู้จัดการคุกกี้

12. โปรแกรมแก้ไขสดสำหรับ CSS และ LESS

Live Editor สำหรับ CSS และ LESS ช่วยให้คุณสามารถเขียนโค้ด CSS/LESS ลงในเบราว์เซอร์ของคุณได้โดยตรง รหัสของคุณจะมีผลทันทีและจะถูกบันทึกไว้ที่ระดับไซต์ในที่จัดเก็บในเครื่องของเบราว์เซอร์ของคุณ

เครื่องมือแก้ไขในหน้ามีคุณสมบัติเติมข้อความอัตโนมัติ ทำให้สวยงาม ลบรอย และอื่นๆ คุณควรลองดู

ตัวแก้ไขสดสำหรับ CSS

คุณนึกถึงส่วนขยายใด ๆ ในรายการหรือคุณมีรายการที่เราสามารถใช้ได้หรือไม่? ส่วนความคิดเห็นอยู่ด้านล่าง