เมื่อกำหนดค่าอย่างเหมาะสม Firefox จะกลายเป็นสุดยอดเครื่องมือพัฒนาเว็บไซต์ช่วยให้คุณเข้าถึงหน้าเว็บที่คุณกำลังทำงานอยู่โดยตรงเพื่อให้คุณสามารถจัดรูปแบบหน้าเว็บของคุณในแบบเรียลไทม์ดีบักจาวาสคริปต์หรือแม้แต่แก้ไข html
สร้างโปรไฟล์แยกต่างหากสำหรับการพัฒนาเว็บ
การติดตั้งเครื่องมือพัฒนาเหล่านี้ทั้งหมดจะทำให้ Firefox กลายเป็นเบราว์เซอร์ที่มีขนาดใหญ่มากดังนั้นเราควรสร้างโปรไฟล์ใหม่สำหรับ Firefox ก่อน
คุณสามารถเปิดโปรไฟล์แยกต่างหากได้ในเวลาเดียวกันเวลาเป็นโปรไฟล์ปกติของคุณด้วยการสร้างทางลัดใหม่ด้วยข้อโต้แย้งเหล่านี้แทนที่ WebDev ด้วยชื่อโปรไฟล์ของคุณ นอกจากนี้ยังมีคำอธิบายโดยละเอียดเพิ่มเติมเกี่ยวกับวิธีการทำเช่นนี้
firefox.exe -P WebDev -no-remote
ตอนนี้คุณได้กำหนดค่า Firefox ด้วยโปรไฟล์แยกต่างหากสำหรับการพัฒนาเว็บมาดูที่ส่วนขยายที่เราสามารถใช้เพื่อทำให้ Firefox เป็นเครื่องมือพัฒนาเว็บขั้นสูงสุด
ต้องมี Web Dev Extensions
นี่คือส่วนขยายทั้งหมดที่ฉันใช้เป็นประจำเพื่อการพัฒนาเว็บ
Firebug
Firebug เป็นส่วนเสริมที่ทรงพลังที่สุดสำหรับแก้ไขข้อบกพร่องจาวาสคริปต์ดู CSS และ html คุณสามารถทำการเปลี่ยนแปลงแบบไดนามิกกับรหัสและ CSS และใช้เพื่อแก้ไขข้อบกพร่องรหัส Ajax ของคุณ เป็นส่วนขยายที่ดีที่สุดอย่างแท้จริง
ส่วนขยายนักพัฒนาเว็บ
หนึ่งในส่วนขยายที่ดีที่สุดสำหรับการทำงาน x ปี นี่เป็นสิ่งที่ต้องมีสำหรับนักพัฒนา แต่คุณเคยได้ยินมาแล้ว
ส่วนขยาย Aardvark
ส่วนขยายนี้เป็นส่วนขยายที่มีน้ำหนักเบามากที่จะแสดงองค์ประกอบต่างๆในหน้าและคลาส / รหัสที่ได้รับมอบหมายอย่างง่ายดาย การใช้งานนั้นง่ายกว่าส่วนขยายนักพัฒนาเว็บสำหรับช่วงเวลานั้นเมื่อคุณต้องการข้อมูลแบบย่อสำหรับองค์ประกอบ คุณสามารถใช้มันเพื่อลบองค์ประกอบออกจากหน้า
ColorZilla
เลือกสีได้อย่างง่ายดาย ไม่มีความเจ็บปวดจากการค้นหาสีที่ฝังอยู่ที่ไหนสักแห่งในสไตล์ชีท
ดูแหล่งที่มาด้วย
คุณสามารถตั้งค่าโปรไฟล์แหล่งที่มาของมุมมองหลายรายการเพื่อเปิดแหล่งที่มาในแอปพลิเคชันต่างๆ
เครื่องมือตรวจสอบ HTML
ส่วนขยายนี้ช่วยให้คุณตรวจสอบความถูกต้องของหน้า HTML และติดตั้งลงในพาเนลดูแหล่งที่มา
ลิงเกรส
มันไม่ใช่ส่วนขยายนักพัฒนาเว็บอย่างแท้จริง แต่ Greasemonkey ยอดเยี่ยมไม่น้อยสำหรับความสามารถในการดำเนินการอัตโนมัติที่ดำเนินการโดยทั่วไปซึ่งเป็นวิธีประหยัดเวลาที่ยอดเยี่ยมสำหรับนักพัฒนาเว็บ
วัดมัน
วัดระยะทางบนหน้าจอได้อย่างง่ายดายด้วยส่วนขยายนี้ เมื่อคุณวัดพื้นที่แล้วคุณสามารถลากสี่เหลี่ยมไปรอบ ๆ หน้าจอเพื่อใช้ในการเปรียบเทียบ
ดู IE / แท็บ IE / OperaView / FirefoxView / มุมมอง Safari / IE View Lite
ส่วนขยายเหล่านี้ (รับของคุณ) ช่วยให้คุณสามารถดูหน้าปัจจุบันในเบราว์เซอร์ที่แตกต่างกันได้อย่างง่ายดาย แท็บ IE จะทำให้คุณเรียกใช้ IE ภายในแท็บได้หากคุณเอียงมาก
ล้างปุ่มแคช
ล้างแคช มีประโยชน์อย่างยิ่งสำหรับการตรวจสอบการเปลี่ยนแปลง CSS ใหม่
รีสตาร์ท Firefox
ส่วนขยายรีสตาร์ท Firefox มีประโยชน์อย่างมากสำหรับการปิดและเริ่ม Firefox ใหม่โดยมีแท็บและเซสชันทั้งหมดไม่เปลี่ยนแปลง
Tab Mix Plus
ส่วนขยาย Tab Mix Plus เป็นส่วนขยายที่ยอดเยี่ยมโดยทั่วไป แต่มีคุณสมบัติที่มีประโยชน์สำหรับนักพัฒนาเว็บ: แท็บที่ซ้ำกันและคัดลอก URL ของแท็บ
YSlow
ส่วนขยาย YSlow เป็นส่วนขยายใหม่จาก Yahooที่จะวิเคราะห์หน้าของคุณและบอกคุณว่าคุณทำผิด มันจะให้คะแนนกับประสิทธิภาพการทำงานไซต์ของคุณด้วย คุณจะสังเกตเห็นมาตรวัดเล็ก ๆ ที่มุมขวาล่าง ... มันจะบอกคุณถึงขนาดทั้งหมดของหน้าเว็บของคุณรวมถึงความเร็วในการโหลด ส่วนขยายที่มีประโยชน์มาก แต่ไม่จำเป็นต้องใช้ส่วนขยาย Firebug
หุ่นจำลอง Lorem Ipsum
ส่วนขยายตัวสร้าง Dummy Lipsum จะสร้างเนื้อหาจำลองให้คุณตามข้อความ Lorem Ipsum ที่มีชื่อเสียงซึ่งมีประโยชน์มากสำหรับการวางเนื้อหาปลอมในเว็บไซต์ของคุณ
Screengrab!
ส่วนขยาย Screengrab จะช่วยให้คุณสามารถจับภาพหน้าจอของหน้าเว็บได้ แต่สามารถทำบางสิ่งที่เครื่องมือสกรีนช็อตทั่วไปไม่สามารถทำได้ - สามารถถ่ายภาพหน้าทั้งหน้าไม่ใช่เฉพาะส่วนที่ดูได้
มีส่วนขยายอื่น ๆ อีกมากมายที่คุณสามารถใช้ได้ แต่สิ่งเหล่านี้เป็นส่วนขยายที่ดีที่สุดจากทั้งหมดที่ฉันเคยเห็น หากคุณมีส่วนขยายอื่นที่คุณใช้เป็นประจำให้พูดถึงในความคิดเห็น
ณ จุดนี้คุณได้เปลี่ยน Firefox เป็นเครื่องมือพัฒนาเว็บขั้นสุดยอดแล้ว ใช้เวลาในการเรียนรู้วิธีใช้ Firebug โดยเฉพาะ
