COOL IT IDEAS AND STUFF

See the original english version Click here!

เชื่อว่า Developers หลายคนคงเคยใช้งาน VSCode มาบ้าง และไม่ว่าคุณจะเป็น Front-end หรือ Back-end Developer จะเป็นมือใหม่หรือมีประสบการณ์ทำงานมาแล้ว บทความนี้น่าจะมีประโยชน์กับคุณ เพราะนี่เป็น 9 VSCode Extensions ที่ Developer ไม่ควรมองข้าม

1. CodeTour

ลองนึกภาพดูว่า มันจะดีแค่ไหน ถ้าคุณสามารถสำรวจ Code ที่ซับซ้อนได้ราวกับว่า กำลังทัวร์พิพิธภัณฑ์พร้อมไกด์ นั่นคือสิ่งที่ CodeTour ทำให้คุณได้ ซึ่ง Extension ที่ยอดเยี่ยมนี้ จะช่วยให้คุณสามารถบันทึกและ Play Guide ทีละขั้นตอนสำหรับ Codebase ของคุณได้ มันเหมือนกับการมีไกด์นำเที่ยวส่วนตัว ที่จะช่วยนำทางไปยัง Code ของคุณ

CodeTour ไม่เพียงแต่เป็นเครื่องมือที่น่าทึ่งสำหรับมือใหม่ ที่พยายามเข้าใจโครงสร้างของ Codebase เท่านั้น แต่ยังเป็นเครื่องเตือนใจที่มีประโยชน์สำหรับการเขียน Code ในอนาคตของคุณด้วย

2. GitHub Copilot

พบกับ GitHub Copilot ที่เป็นผู้ช่วยเขียน Code คนใหม่ของคุณ สำหรับเครื่องมือที่ขับเคลื่อนด้วย AI นี้ จะช่วยเสนอคำแนะนำสำหรับ Code (ไม่ว่าจะเป็น Block หรือบรรทัด) ในขณะที่คุณกำลังพิมพ์ Code อยู่ สิ่งที่ทำให้มันพิเศษก็คือความสามารถในการเรียนรู้จาก Code ที่คุณกำลังทำงานอยู่ และช่วยปรับคำแนะนำให้เหมาะสม

มันเหมือนกับการมีครูที่ช่วยสอนเขียน Code ที่มีความสามารถด้าน AI อีกทั้ง GitHub Copilot ยังช่วยตรวจจับ Bugs, ปรับปรุงกระบวนการเขียน Code ของคุณ และเรียนรู้ไปพร้อมกันด้วย สำหรับผู้ที่เป็นมือใหม่ในเส้นทางการเขียน Code เครื่องมือนี้จะให้คำแนะนำที่มีประโยชน์กับคุณ

3. Turbo Console Log

การ Debug อาจทำให้รู้สึกเหมือนเป็นการไขปริศนา และ Turbo Console Log ก็เป็นเพื่อนคู่ใจของคุณในภารกิจนี้ Extension นี้จะช่วยลดความยุ่งยากในกระบวนการสร้าง console.log() Statements ซึ่งทำให้ทุกอย่างง่ายขึ้นเพียงคลิกเดียว

ด้วยการใช้ Turbo Console Log คุณสามารถบันทึกทั้ง Variable, Object หรือ Function ได้อย่างรวดเร็ว สิ่งนี้จะช่วยเร่งความเร็วในการ Debug และช่วยลดความกังวลของผู้ที่เริ่มต้นเขียน Code ให้น้อยลง Turbo Console Log จะทำให้คุณสามารถบอกลากระบวนการที่ยุ่งยากในการพิมพ์ Log Statement แต่ละรายการได้

4. Live Share

การทำงานร่วมกัน ถือเป็นสิ่งสำคัญเมื่อคุณเริ่มต้นเส้นทางการเขียน Code และ Live Share จะนำการเขียน Code ร่วมกันขึ้นไปสู่อีกระดับหนึ่ง Extension นี้จะช่วยเปิดใช้งานการทำงานร่วมกันแบบสองทิศทางแบบ Real-Time บน Code ของคุณ มันเหมือนกับ Google Docs แต่สำหรับการเขียน Code 

คุณสามารถแชร์ VSCode Environment ของคุณกับผู้อื่น เพื่อให้พวกเขาสามารถแก้ไขและ Debug Code ร่วมกับคุณได้ นี่อาจเป็นเครื่องมือที่มีค่าสำหรับการเรียนรู้จากผู้อื่น, Pair Programming หรือแม้แต่ขอความช่วยเหลือเมื่อคุณติดขัด มันเป็นประสบการณ์การเขียน Code ที่ใช้ร่วมกันได้จาก Editor ของคุณ

5. Todo Tree

การติดตาม TODO Comments เป็นจำนวนมาก ๆ อาจทำให้คุณรู้สึกหนักใจถ้าคุณยังเป็นมือใหม่ จะว่าไปแล้ว Todo Tree ก็เปรียบเหมือน Organizer ส่วนตัวของคุณภายใน VSCode โดย Extension นี้จะช่วยให้คุณเห็น TODO Comments ทั้งหมดใน Workspace ของคุณ โดยจะนำเสนอภาพรวมที่ครอบคลุมเกี่ยวกับสิ่งที่คุณกำลังให้ความสนใจ

Todo Tree เป็นมากกว่าเครื่องมือในการจดจำสิ่งที่คุณทำ มันยังเกี่ยวกับการจัดการขั้นตอนการทำงานของคุณอย่างมีประสิทธิภาพ ด้วยการให้ภาพรวมที่ชัดเจนเกี่ยวกับงานที่ค้างอยู่ทั้งหมด Todo Tree จะช่วยให้คุณสามารถจัดระเบียบพวกมันได้

6. Rest Client

การใช้งานข้ามไปมา ระหว่าง VSCode และเครื่องมืออย่าง Postman อาจรบกวนขั้นตอนการทำงานของคุณได้ แต่จะดีไหมถ้าคุณสามารถส่ง HTTP Requests จาก Editor ของคุณได้โดยตรง นั่นคือสิ่งที่ Rest Client เข้ามาช่วย ด้วย Extension นี้ คุณสามารถส่ง HTTP Requests และดู Responses ได้โดยที่ไม่ต้องออกไปจาก VSCode

Rest Client ไม่เพียงจะช่วยทำให้กระบวนการของคุณง่ายขึ้น แต่ยังช่วยให้คุณมุ่งความสนใจไปยังงานที่ทำอยู่ได้อีกด้วย ด้วยการขจัดการสลับการทำงานระหว่าง Apps, Rest Client จะทำให้ VSCode Environment ของคุณเป็นศูนย์กลางของการทำงานอีกด้วย

7. CSS Peek

การ Navigate ระหว่าง HTML และ CSS Files อาจทำให้เกิดความสับสนสำหรับมือใหม่ ซึ่ง CSS Peek จะเข้ามาช่วยเหลือในเรื่องนี้ด้วยการอนุญาตให้คุณดู CSS ID และ Class Definitions ได้จาก HTML File ของคุณ มันเหมือนกับการมีแว่นขยายที่สามารถมองผ่าน HTML ของคุณไปยัง CSS ของคุณได้

CSS Peek สามารถช่วยให้คุณไม่ต้องสลับการทำงานไปมา เพราะมันจะขจัดการสลับการทำงานข้ามไปมาระหว่าง Files ได้เป็นอย่างดี

8. Import Cost

เคยสงสัยเกี่ยวกับขนาดของ Packages ที่คุณกำลัง Import อยู่หรือไม่ ซึ่ง Import Cost จะช่วยให้คุณไม่ต้องคาดเดาอีกต่อไป Extension นี้จะแสดงขนาดของ Packages ที่ถูก Import พร้อมกับ Import Statement ของคุณ

การคำนึงถึงขนาดของ Libraries ที่คุณกำลังเพิ่มเข้าไป ถือเป็นสิ่งสำคัญในการรักษาประสิทธิภาพของ Application ของคุณ Import Cost เป็นเครื่องมือที่ยอดเยี่ยมในการเริ่มพัฒนาความตระหนักรู้นี้ตั้งแต่เริ่มต้น

9. Thunder Client

Thunder Client เป็นเครื่องมือที่จำเป็นสำหรับการทดสอบ API ด้วย Extension ที่มีน้ำหนักเบาและใช้งานง่าย จึงทำให้ Thunder Client เป็นเครื่องมือทางเลือกที่ยอดเยี่ยมเหมือนอย่าง Postman มันรองรับ HTTP Methods ทั้งหมด, การจัดรูปแบบ JSON และ XML โดยอัตโนมัติ และอื่น ๆ อีกมากมาย

Thunder Client ช่วยทำให้การทดสอบ API มีความคล่องตัวและมีประสิทธิภาพมากขึ้น มันเป็นเครื่องมือที่ต้องมีสำหรับ Developer ที่เริ่มต้นการเดินทางสู่การเขียน Code

ที่มา: https://javascript.plainenglish.io/

รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert

อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ

บทความล่าสุด

• 5 Data Engineering Projects ที่คุณสามารถใช้ศึกษาเรียนรู้ได้ฟรี
• 10 Python Itertools ที่ช่วยให้ Code ของคุณ Clean ขึ้นกว่าเดิม
• 5+ HTML Elements มีประโยชน์ แต่ไม่ค่อยถูกพูดถึง