ห้ามพลาด!! 10 Extensions ที่ต้องใช้ใน VS Code 2022
1. Auto Rename Tag
ใช้สำหรับการแก้ไข Tag ต่างๆ เวลาเราแก้ไข tag เปิดหรือ tag ปิด มันก็จะแก้ไขให้ทั้ง tag เปิดและ tag ปิดนั้นเป็นเหมือนกันทันที
2. Bracket Pair Colorizer
ใช้สำหรับใส่สีในวงเล็บต่างๆของแต่ละบรรทัด เพื่อง่ายต่อการหาและอ่าน Code เวลาที่เราเขียน code ที่มีวงเล็บซ้อนกันหลายๆชั้น จะได้ไม่งง
3. Code Spell Checker
ใช้ในการตรวจสอบคำผิดต่าง เช่น เขียนผิด สะกดผิด ซึ่งการใช้งานสามารถใช้ shortcut ได้ หรือสามารถคลิกที่สัญลักษณ์รูป หลอดไฟสีเหลืองด้านหน้าของบรรทัดนั้นๆได้ หรืออาจใช้ shortcut key ตามแต่ละ os ได้เลย
| Windows | Macbook |
|---|---|
| Ctrl + . | Cmd + . |
4. SonarLint
ใช้สำหรับตรวจเช็คคุณภาพของ Source Code มีความถูกต้องตามหลักการได้ดีมากน้อยขนาดไหน ซึ่งกฎต่างๆที่กำหนดขึ้นมา จะอยู่ใน www.rule.sonarsource.com สามารถเข้าไปอ่านศึกษาเพิ่มเติมได้
ถ้า Code ที่เขียนมีข้อผิดพลาดเกิดขึ้น จะมีการแจ้งเตือนเป็นไฮไลท์สีขึ้นที่คำนั้นๆในบรรทัดนั้น และจะมีการแสดงข้อความเตือน ที่เป็นคำชี้แนะว่าเราจะต้องแก้ไขอย่างไร (การใช้ SonarLint จะต้องมี Java ในเครื่องก่อนนะครับ เพราะใช้การ Run ผ่าน Java) สำหรับภาษาที่ SonarLint Support ได้แก่ JavaScript TypeScript Python Java HTML และ PHP
5. Path Intellisense
ใช้เพื่อแสดงรายการ Path เพื่อไม่ให้เกิดความผิดพลาดในการพิมพิ์ชื่อfolder โดย plugins ตัวนี้จะไปทำการดึงชื่อ folder ต่างๆที่มีขึ้นมาให้เราเลือก m
6. CSS peek
ใช้ดู CSS โดยที่เราสามารถกดปุ่ม Ctl ค้างไว้และเอา mouse ไปวางไว้บนชื่อ class นั้นๆ คุณจะเห็นว่าใน class นั้นเขียน style sheet ไว้ยังไงบ้าง หรือคุณอาจกด F12 เพื่อที่จะให้ VS Code วิ่งไปยังไฟล์ CSS และ บรรทัดที่เขียน class นั้นไว้ได้เลย
7. Live Server
ใช้เป็น Server เล็กๆ เพื่อดูผลลัพธ์การแสดงผลของการเขียน Code ได้ทันที โดยที่เราไม่จำเป็นต้องไปเปิด webserver เพียงแค่เรา save file เราก็จะเห็นการเปลี่ยนแปลงที่เกิดขึ้นได้ในทันที
8. Docker
ถือได้ว่าเป็น plugin ที่ต้องมีติดตั้งไว้ในเครื่องเลยทีเดียว เพราะยังไงก็ตามเราจำเป็นต้องใช้งาน container ไม่ทางใดก็ทางหนึ่ง ซึ่ง plugin ตัวนี้จะใช้ในการจัดการทั้ง image และ container แถมยัง connect ไปยัง registry อื่นๆ นอกจาก docker hub ได้อีกด้วย
9. GitLens
เหมาะสำหรับการทำงานเป็นทีม สามารถ Tag ดูการ commited ได้ รวมถึงดูรายละเอียดว่าใครเป็นคน Commited Code ส่วนไหนขึ้นมาได้ เวลาค้นหาว่า Code ชุดนี้มีข้อผิดพลาดมาจากใครจะได้สามารถทำความเข้าใจให้ตรงกันได้
10. Thunder Client
เป็นตัวแทนของ Postman ได้เลย ใช้เพื่อช่วยในเรื่องการทดสอบ API หรือการทดสอบ Request ไปยัง Server จะมี Features พื้นฐานที่คล้ายๆกับ Postman รวมถึงการกำหนด environment ได้ด้วย
