ถ้าคุณเป็นโปรแกรมเมอร์ที่ไม่ใช้ Chrome คุณเป็นกลุ่มน้อย
มีเหตุผลเยอะที่ชอบเบราว์เซอร์นี้สำหรับเขียนโค้ด: อิทธิพลของ Google ต่อทิศทางเว็บ ฟีเจอร์ในตัวที่ทำให้พัฒนาง่ายขึ้น และจำนวนส่วนขยายมหาศาล
จุดสุดท้ายนี้สำคัญมาก ณ กุมภาพันธ์ 2018 Chrome ครอง市场份额 เดสก์ท็อป 60% ไม่แปลกที่นักสร้างส่วนขยายโฟกัส Chrome ก่อน นี่คือส่วนขยาย Chrome ที่ดีที่สุดสำหรับนักพัฒนาทุกประเภท โดยเฉพาะเว็บดีเวลอปเปอร์
ส่วนขยายพัฒนาทั่วไป
1. Session Buddy
Chrome มีฟีเจอร์ custom user profiles สร้างชุดบุ๊กมาร์ก ตั้งค่า แท็บ ประวัติ แยกกัน ควรตั้งชุดสำหรับเขียนโค้ดเฉพาะ ถ้ายังไม่มี
แต่ Session Buddy ขึ้นอีกขั้น: บันทึก "tab sessions" เฉพาะ และสลับระหว่างกันได้ตลอดเวลา ประโยชน์มากตอนทำหลายโปรเจกต์พร้อมกัน
2. iMacros for Chrome
iMacros เป็นส่วนขยายทำให้งานซ้ำอัตโนมัติ "บันทึก" การกระทำ (คลิกเมาส์ กดปุ่ม) เซฟเป็นแมโคร รันได้คลิกเดียวเมื่อต้องการ ประหยัดเวลามากตอนกรอกฟอร์ม ทดสอบการเปลี่ยนแปลง สำหรับแมโครนอก Chrome แนะนำ AutoHotkey scripts
3. Web Timer
Web Timer ติดตามเวลาที่ใช้ (หรือเสีย) บนเว็บต่างๆ ช่วยควบคุมนิสัยเล่นโทรศัพท์ ติดตามเฉพาะตอน Chrome อยู่โฟกัส และฉลาดพอหยุดตอนคุณ idle
อยากตัวติดตามเวลาขั้นสูง แนะนำ Toggl แพลตฟอร์มข้ามได้
4. Awesome Screenshot
Awesome Screenshot ส่วนขยายอールอินวัน สำหรับจับสกรีนช็อต บันทึกวิดีโอหน้าจอ ใส่คำอธิบายและเบลอภาพ และแชร์สกรีนช็อตคลิกเดียว ฟีเจอร์น่าสนใจ: จับสกรีนช็อต หน้าเว็บทั้งหน้า และเย็บเป็นภาพยักษ์เดียว สำหรับโซลูชันที่ทำงานนอก Chrome ดูเครื่องมือสร้างสกรีนช็อตที่ดีที่สุด
5. Marmoset
Marmoset เครื่องมือเล็กสนุก สร้างสกรีนช็อต 3D ของโค้ด จับภาพแล้วหมุน บิด ขยายใน 3D ทำให้น่าสนใจตอนแชร์สนิปเพท ประโยชน์ตอนสร้าง stock images จากโค้ด หรือ peek โค้ดต้นทางบนหน้าโปรเจกต์
ส่วนขยายพัฒนาเว็บ
6. Web Developer
ถ้าติดตั้งส่วนขยายเพียงตัวเดียวช่วยพัฒนาเว็บ ให้เป็นตัวนี้ Web Developer เต็มไปด้วยฟีเจอร์สะดวก: สลับ JavaScript และปลั๊กอินคลิกเดียว ปรับขนาดหน้าต่างทดสอบ responsive design ทดสอบและดีบั๊กภาพ และอื่นๆ อีกมาก
7. User-Agent Switcher
ใน "user agent switcher" หลายตัวใน Chrome Web Store ตัวนี้ดีที่สุด ยังอัปเดตอยู่ ไม่ขโมยลิงก์ มาพร้อม user agent strings เริ่มต้นหลายตัว และสร้าง custom ได้ มันคือตัวเดียวที่ทำงานได้จริง
8. Wappalyzer
อยากรู้ว่าเว็บไหนใช้เทคโนโลยีเว็บอะไร Wappalyzer บอกได้คลิกเดียว ตรวจจับ CMS (WordPress), web frameworks (React), tools (Google Analytics), แพลตฟอร์มอีคอมเมิร์ซ (Shopify) และอื่นๆ มากมาย
9. IE Tab
ณ กุมภาพันธ์ 2018 เดสก์ท็อป 13%+ ยังใช้ Internet Explorer น่าเสียดาย IE ไกลจากมาตรฐานเว็บสมัยใหม่ นั่นคือเหตุผลต้องใช้ IE Tab จำลอง IE ในแท็บใหม่ ทดสอบเว็บใน IE6, IE7, IE8, IE9 รวม ActiveX controls มีประโยชน์มากถ้าต้องการเว็บเข้ากันได้กับทุกเบราว์เซอร์ ไม่ว่าจะเก่าแค่ไหน
10. Click&Clean
ตอนพัฒนาเว็บ ไม่มีอะไรรำคาญกว่าล้างข้อมูลท่องเว็บซ้ำๆ เพื่อโหลดการเปลี่ยนแปลงใหม่ Click&Clean ไม่ได้แค่เร็วขึ้น แต่ควบคุมได้มากขึ้น: ล้าง database และ plugin data, เก็บคุกกี้บางเว็บ ฯลฯ
11. WhatFont
WhatFont วิธีเร็วที่สุดระบุฟอนต์บนเว็บ คลิกขวา Inspect Element ดู stylesheet หา ฟอนต์ หนึ่ง แต่ WhatFont เพียง hover บน element รู้ฟอนต์ทันที และบอกว่าฟอนต์นั้นเสิร์ฟอย่างไร (Google Fonts, TypeKit ฯลฯ)
12. ColorPick Eyedropper
ColorPick Eyedropper โซมเข้าไปได้โค้ดสีที่แม่นยำของพิกเซลไหนก็ตามบนเว็บ โค้ดสีมี hex, RGB, HSL สะดวกมาก เร็วกว่าตรวจสอบ element ดูสีใน stylesheet หรือดาวน์โหลดรูปมาหาสีใน image editor
13. Lorem Ipsum Generator
ตอนพัฒนาเว็บ จะต้องการ dummy text โลเรมอิปซัมบนเว็บเยอะ แต่ Lorem Ipsum Generator พร้อมใช้ในแท็บปัจจุบันเสมอ เร็ว ปรับย่อหน้าและประโยคต่อย่อหน้าได้
14. Check My Links
จบโปรเจกต์เว็บ จะทำ final pass หน้าหลักทั้งหมด เช็คลิงก์ทำงานทั้งหมด Check My Links ทำให้ง่ายที่สุด คลิกปุ่ม มันสแกนลิงก์ทั้งหมดบนหน้านั้น แล้วไฮไลท์แต่ละอันว่าลงหรือทำงาน
15. Dimensions
Dimensions เป็นเครื่องมือสำหรับเว็บดีไซน์มากกว่าพัฒนา แต่ทั้งคู่ทับซ้อนกัน คุณอาจอยากใช้ส่วนขยายนี้ สรุป: วัดระยะห่างระหว่าง element ใดๆ บนเว็บ ทันที รวมข้อความ รูป วิดีโอ ฟิลด์ฟอร์ม วัดจากเมาส์ไป element ที่รองรับได้ด้วย
ส่วนขยาย Chrome อื่นๆ ที่อาจมีประโยชน์
นอกจากข้างต้น แนะนำส่วนขยายจัดการแท็บ Chrome และส่วนขยายเพิ่มประสิทธิภาพธุรกิจ Chrome ซึ่งเป็นสองอย่างที่อาจรำคาญนักพัฒนาที่ใช้ Chrome
ควรดูการเลือกส่วนขยาย Chrome ที่ดีที่สุดจำนวนมากของเรา ครอบคลุมทุกอย่าง: ความปลอดภัย ไปจนถึงความบันเทิง ช็อปปิ้ง ประสิทธิภาพทั่วไป และอื่นๆ อีกมาก
