คัมภีร์เทพ IT เคล็คลับการใช้ Visual Studio Code ให้มีประสิทธิภาพ

เคล็คลับการใช้ Visual Studio Code ให้มีประสิทธิภาพ

12-ก.ย.-18

คัมภีร์เทพ IT

เคล็คลับการใช้ Visual Studio Code ให้มีประสิทธิภาพ

ช่วงไม่กี่ปีที่ผ่านมา Visual Studio Code ได้รับความนิยมอย่างมากในตลาด Open-Source IDE โดย VS Code ได้รับการเผยแพร่ตั้งแต่ปี 2015 และมี Developer ใช้งานถึง 35% จากการสำรวจ 2018 Stack Overflow survey ในบทความนี้จะบอกถึงเคล็คลับการใช้ Visual Studio Code ให้มีประสิทธิภาพ ซึ่งน่าจะเป็นประโยชน์กับ Developer ไม่น้อย

- Git and Gitlens

Git เป็น Software ยอดนิยมที่ Developer ใช้ การจัดการ Git จาก IDE ของคุณสามารถทำได้ง่ายกว่าใช้ Command Line โดย Git panel ช่วยให้คุณสามารถ Stage, Commit, Stash และ Undo changes ได้ ส่วน GitLens extension สำหรับ VS Code ยิ่งช่วยคุณมากขึ้นอีก สำหรับ Feature ที่มีประโยชน์มากที่สุดของ GitLens คือ มันจะแสดงให้คุณเห็นว่าใครเป็น Commit อะไรและเมื่อไหร่ในทุกบรรทัดของ Code ใน Project

- Live Share

VS Code Live Share เป็น Feature ใหม่ที่ยังอยู่ในช่วงการ Preview มันช่วยให้คุณสามารถ Share Workspace ของคุณแบบ Realtime, live editing, pin user ให้ follow ตาม cursor, group debugging และอื่นๆ อีกมากมาย และมันยิ่งเป็นประโยชน์อย่างมากถ้าคุณทำงานแบบ Remote หรือเมื่อคุณต้องการทำงานร่วมกับคนที่ทำงานอยู่ที่อื่น

- JSON to Code

หากคุณเคยใช้งาน API ใน TypeScript และหวังว่า Response จะสามารถใช้ได้กับภาษา Strong-typed ที่ใช้อยู่ใน Project ของคุณ ซึ่ง "Paste JSON as Code" สามารถทำได้ โดยการ Convert JSON ให้เป็น Interface ในภาษา Strong-type ต่างๆ ที่คุณต้องการได้ในคำสั่งเดียว

- Rename All Occurrences

Refactoring เป็นสิ่งที่จำเป็นในการเขียนและ Maintain Clean Code แต่มันอาจเป็นเรื่องน่าปวดหัว โดยเฉพาะเมื่อคุณกำลัง Refactor Module ขนาดใหญ่หรือ Code ปริมาณเยอะๆ ดังนั้น แทนที่จะไล่เปลี่ยนชื่อ Variable หรือ Method จากไฟล์เป็นโหลๆ คุณก็ให้ VS Code ทำแทนคุณสิ

ถ้าคุณเลือก Variable/Method และกด F2 คุณจะสามารถแก้ไขชื่อได้ โดยมันจะเปลี่ยนทุก Instance ของชื่อ Variable ทั้งหมดใน Project ที่คุณกำลังทำงานอยู่

File ปัจจุบัน คุณสามารถใช้ Keyboard Shortcut โดยกด Command + F2 (บน Mac) หรือ Ctrl + F2 (บน Windows) และ VS Code จะวาง Cursor ไว้ทั่วทั้ง File ปัจจุบัน

- Go to Definition

เมื่อคุณเขียน Program หรือเขียน Script บ่อยครั้งที่คุณจะพบกับ Variable หรือ Method ที่คุณไม่รู้จัก แล้วคุณจะทำอย่างไร? คุณอาจต้องใช้เวลา(หลายนาที)ในการค้นหา File ที่ถูกต้อง หรือกด Command (บน Mac) หรือ Ctrl (บน Windows) และคลิกที่ Variable/Method เหล่านั้น แล้ว VS Code จะแสดง Definition ของมันให้คุณได้รู้ หรือคุณสามารถเลื่อน Cursor ไปที่ Variable/Method พร้อมกับกด Command (บน Mac) หรือ Ctrl (บน Windows) มันจะแสดง Definition ที่คุณต้องการในบรรทัดที่มี Cursor ของคุณอยู่

- Edit Multiple Lines at Once

ถ้าคุณต้องการ Insert หรือ Delete หลายๆ Instance ของ Text ใน Document แล้วละก็ สิ่งที่คุณควรทำ ก็คือ การสร้าง Cursor หลายตัว โดยคุณสามารถทำสิ่งนี้ได้ด้วยการกด Option (บน Mac) หรือ Alt (บน Windows) แล้วคลิกไปที่ Text ที่คุณต้องการ ซึ่งการคลิกแต่ละครั้ง จะเป็นการสร้าง Cursor ใหม่ วิธีนี้มีประโยชน์มากสำหรับการใช้งานใน HTML เช่นกรณีที่คุณต้องการเพิ่มหลายๆ Instance ภายใน Class เดียวกันหรือต้องการเปลี่ยน Format ของหลายๆ Hyperlink เป็นต้น

- Debugger

สำหรับเรื่อง Debugger คุณสามารถดูได้จาก Video ด้านบน ต้องขอบคุณ VS Code ที่รองรับเรื่องนี้

- Keybindings and the Command Pallette

ถ้าคุณต้องการทำสิ่งต่างๆ ให้เสร็จเร็วขึ้น คุณควรจดจำ Hot keys ให้ได้ คุณสามารถดูได้จาก cheat sheet นี้ หรือเปิดไปที่ Keybindings Page จะว่าไปแล้ว Command Pallette เป็นเพื่อนที่ดีที่สุดของคุณ คุณสามารถเปิดด้วย Command + P (บน Mac) หรือ Ctrl + P (บน Windows) เมื่อคุณเป็น Developer คุณอาจทำงานพร้อมกันทีละหลาย File คุณสามารถพิมพ์ชื่อ File แล้วดูผล Search Result ใน Workspace ได้เลย ซึ่งวิธีนี้เร็วกว่าการคลิกผ่าน Directory Tree

คุณสามารถพิมพ์ เริ่มต้นด้วย > เพื่อดู List ของงานที่มีอยู่
หรือพิมพ์ เริ่มต้นด้วย @ เพื่อดู List ของ Symbols ใน File ปัจจุบัน

- Custom Keybindings

หนึ่งใน Keybinding ที่มีประโยชน์ ซึ่งมันหายไปจาก VS Code ก็คือ การบันทึกทั้งหมด (Save All) นั่นเอง คุณสามารถสร้าง Keybinding เป็นของตัวเองเพื่อที่จะบันทึก File ที่แก้ไขทั้งหมดใน Workspace ได้ด้วยการกด Command + Shift + S (บน Mac) หรือ Ctrl + Shift + S (บน Windows)

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

ที่มา: https://medium.com/

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

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

บทความที่เกี่ยวข้อง

บทความ IT เจ๋งๆ

เคล็คลับการใช้ Visual Studio Code ให้มีประสิทธิภาพ

ประเภทบทความ