VS Code shortcut command that enhances performance
Hello, programmers.
Check out the VS Code Shortcut Command Briefing Document that will enhance your productivity! Whether you're a novice or a professional with Visual Studio Code, these Shortcut commands will save your time and effort. 🙌
📂 File management
🔍 Navigation in Editor
🔄 Search and replace
✂️ Code editing
⚙️ Formatting and Restructuring Codes
From quick file opening to code formatting, this shortcut command summary covers everything!
ถ้าคุณค้นหา “คีย์ลัด Visual Studio Code จัดโค้ด” ส่วนใหญ่หมายถึงการทำให้โค้ดจัดระเบียบ/จัดรูปแบบ (format) และปรับโครงสร้าง (refactor) ให้เร็วขึ้นโดยไม่ต้องเอามือออกจากคีย์บอร์ด เราสรุปแนวทางที่ผมใช้บ่อย ๆ ให้เอาไปปรับกับงานของคุณได้เลย 1) คีย์ลัดที่ช่วย “จัดโค้ด” แบบเห็นผลทันที - Format Document: ใช้จัดโค้ดทั้งไฟล์ให้สวยตาม formatter ที่ตั้งไว้ (เช่น Prettier) เหมาะมากก่อน commit - Format Selection: เลือกบางบล็อกแล้วสั่งจัดเฉพาะส่วน ลดผลกระทบกับโค้ดทั้งไฟล์เวลารีวิว PR ทิปส่วนตัว: ถ้ากดแล้วไม่เกิดอะไร ให้เช็กว่ามี formatter ที่รองรับภาษาไฟล์นั้นหรือยัง และตั้ง Default Formatter ให้ถูกตัว 2) ตั้งค่าให้จัดโค้ดอัตโนมัติ (ช่วยลดเวลาซ้ำ ๆ) ผมชอบเปิดให้ VS Code “จัดโค้ดตอนเซฟ” เพราะทำให้โค้ดสะอาดสม่ำเสมอทั้งทีม - เปิด Format on Save - ถ้าใช้ ESLint/Prettier คู่กัน แนะนำให้เลือกตัวเดียวเป็นหลัก แล้วค่อยให้ตัวอื่นทำหน้าที่เสริม (เช่น fix lint) เพื่อเลี่ยง format ตีกัน 3) Refactor โค้ดให้ไวขึ้นด้วยคำสั่งใน Editor เวลาอยากปรับโครงสร้างโค้ดโดยไม่พัง ผมใช้เมนู refactor บ่อยมาก เช่น - Rename Symbol: เปลี่ยนชื่อฟังก์ชัน/ตัวแปร แล้วให้ VS Code ไล่แก้ reference ให้หมด - Code Actions/Quick Fix: ช่วยแก้ import หาย, แปลงโค้ดให้ตรงกฎ lint, หรือเสนอ refactor ที่เหมาะกับบริบท ทิป: ลองใช้กับการ “จัด import” จะช่วยให้ไฟล์สะอาดขึ้นทันที โดยเฉพาะโปรเจกต์ใหญ่ 4) ค้นหา-แทนที่แบบโปร (ลดความพลาด) การจัดโค้ดไม่ได้มีแค่ format บางทีคือการแทนที่ข้อความให้ถูกต้องทั้งโปรเจกต์ - Find in File / Replace - Find in Workspace: ค้นหาทั้งโปรเจกต์ เหมาะกับงานรีแฟคเตอร์หรือเปลี่ยนชื่อคอนสแตนต์ ทิป: เปิดโหมด regex เวลาจะจัด pattern ซ้ำ ๆ เช่น เปลี่ยนรูปแบบชื่อหรือจัด spacing แบบเฉพาะจุด (แต่ควรพรีวิวผลก่อนกด replace ทั้งหมด) 5) สรุป workflow ที่ผมใช้จริงเวลา “จัดโค้ด” 1) จัด import / แก้ lint ด้วย Code Actions 2) Format Selection (เฉพาะส่วนที่แก้) 3) ก่อนส่งงานค่อย Format Document ทั้งไฟล์ 4) ใช้ Find in Workspace เช็กคำที่ตกหล่น ถ้าคุณมีภาพ Cheat Sheet แยกหมวด (การจัดการไฟล์, การนำทางใน Editor, ค้นหาและแทนที่, การแก้ไขโค้ด, การจัดรูปแบบโค้ด) แนะนำให้บันทึกไว้ใกล้มือ แล้วฝึกใช้ 3–5 คีย์ลัดแรกให้คล่องก่อน รับรองความเร็วในการเขียนโค้ดดีขึ้นแบบรู้สึกได้เลย