วิธีดาวน์โหลดและติดตั้ง Visual Studio Code

Visual Studio Code (VS Code) คือโปรแกรมสำหรับเขียนโค้ด (Code Editor) ที่พัฒนาโดยบริษัท Microsoft มีจุดเด่นคือ “ฟรี ใช้งานได้ทุกระบบปฏิบัติการ และรองรับหลายภาษาโปรแกรม” เช่น C#, Python, PHP, JavaScript, HTML, CSS, TypeScript, และอีกมากมาย

ข้อดีของ Visual Studio Code

1. รองรับหลายภาษาโปรแกรม (Multi-language Support)
   สามารถติดตั้งส่วนเสริม (Extensions) เพื่อเพิ่มการรองรับภาษาอื่น ๆ ได้ เช่น PHP, Python, C++, Java
2. มีระบบ IntelliSense (Auto Suggestion)
   ช่วยแนะนำคำสั่ง, ฟังก์ชัน, ตัวแปร ทำให้เขียนโค้ดได้เร็วและลดข้อผิดพลาด
3. ดีบัก (Debug) ในตัว
   สามารถรันและตรวจหาข้อผิดพลาดของโปรแกรมได้ทันทีภายใน VS Code
4. รองรับ Git และ GitHub
   สามารถจัดการ version control ได้โดยไม่ต้องใช้โปรแกรมภายนอก
5. ขนาดเล็ก ทำงานเร็ว
   โปรแกรมเบา เปิดไว เหมาะกับทั้งนักเรียน นักศึกษา และโปรแกรมเมอร์มืออาชีพ
6. ปรับแต่งได้สูง (Highly Customizable)
   เปลี่ยนธีม สี ฟอนต์ หรือคีย์ลัดได้ตามความชอบ

ขั้นตอนการดาวน์โหลดและติดตั้ง Visual Studio Code

• เข้าไปที่เว็บไซต์ทางการของ Visual Studio Code 👉 https://code.visualstudio.com/Download
• เลือกดาวน์โหลดตัวติดตั้งตามระบบปฏิบัติการที่ใช้
• จะได้ไฟล์ติดตั้งที่มีชื่อประมาณนี้ VSCodeUserSetup-{version}.exe
• ดับเบิ้ลคลิกไฟล์ติดตั้งที่ดาวน์โหลดมาเพื่อเริ่มติดตั้ง
• จะเข้าสู่หน้า License Agreement ให้ติ๊ก I accept the agreement แล้วคลิกปุ่ม Next

• เลือกโฟลเดอร์ที่จะติดตั้งแล้วคลิกปุ่ม Next

จะเข้าสู่หน้า Select Start Menu Folder

หน้าต่างนี้ใช้สำหรับกำหนดว่า จะให้ติดตั้งทางลัด (Shortcut) ของโปรแกรม Visual Studio Code ไว้ใน Start Menu Folder ของ Windows หรือไม่

โดยเมื่อเราเปิดเมนู Start → All apps จะสามารถเห็นโฟลเดอร์ชื่อ Visual Studio Code และภายในจะมีไอคอนสำหรับเปิดโปรแกรม

• ปุ่ม “Browse…” ใช้เลือกโฟลเดอร์อื่นในเมนู Start หากต้องการเก็บไว้ในตำแหน่งอื่น
• ตัวเลือก “Don’t create a Start Menu folder”
  • ถ้าติ๊กถูก ✅ ระบบจะไม่สร้างทางลัดใน Start Menu
  • เหมาะสำหรับผู้ที่ไม่ต้องการให้มีโฟลเดอร์เพิ่มในเมนู Start หรือจะเปิดโปรแกรมผ่าน Desktop / Command Line แทน
  • แต่ถ้าต้องการให้ระบบสร้างทางลัดใน Start Menu ก็ไม่ต้องติ๊กหัวข้อนี้

คลิกปุ่ม Next จะเข้าสู่หน้า Select Additional Tasks

หน้านี้ใช้สำหรับเลือก “งานเพิ่มเติม” ที่ตัวติดตั้งจะทำหลังการติดตั้งเสร็จ

รายละเอียดของแต่ละตัวเลือกมีดังนี้

• Create a desktop icon สร้างไอคอน VS Code บน Desktop
  • แนะนำให้ติ๊ก ✅ ถ้าต้องการเปิดโปรแกรมจากหน้า Desktop ได้ง่าย
• Add “Open with Code” action to Windows Explorer file context menu เพิ่มเมนู “Open with Code” ใน Context Menu ของไฟล์ (เช่น .html, .php, .py)
  • ตัวเลือกนี้ทำให้เมื่อคลิกขวาที่ไฟล์ใด ๆ แล้วสามารถเลือก “Open with Code” เพื่อเปิดไฟล์นั้นใน VS Code ได้ทันที
  • แนะนำให้ติ๊ก ✅ เพื่อความสะดวกในการเปิดไฟล์เดี่ยว ๆ
• Add “Open with Code” action to Windows Explorer directory context menu เพิ่มเมนู “Open with Code” ในคลิกขวาของ “โฟลเดอร์”
  • ตัวเลือกนี้ช่วยให้สามารถเปิดทั้งโฟลเดอร์เป็น Project ใน VS Code ได้โดยตรง
  • แนะนำให้ติ๊ก ✅ หากเรามักเปิดโฟลเดอร์โปรเจ็กต์เพื่อเขียนโค้ดบ่อย ๆ
• Register Code as an editor for supported file types ลงทะเบียนให้ VS Code เป็นโปรแกรมแก้ไขหลัก (Default Editor) สำหรับไฟล์ที่รองรับ เช่น .html, .css, .js, .json, .php เป็นต้น
  • ตัวเลือกนี้จะส่งผลให้ ถ้าเราดับเบิลคลิกไฟล์เหล่านี้ จะเปิดด้วย VS Code โดยอัตโนมัติ
  • แนะนำให้ติ๊ก ✅ ไว้ (ค่าเริ่มต้น)
• Add to PATH (requires shell restart) เพิ่มคำสั่ง code ลงในระบบ PATH
  • ทำให้สามารถเปิด VS Code จาก Command Prompt หรือ PowerShell ได้โดยพิมพ์คำสั่ง code . เพื่อเปิดโฟลเดอร์ปัจจุบันใน VS Code
  • แนะนำให้ติ๊ก ✅ ไว้ โดยเฉพาะสำหรับนักพัฒนา เพราะช่วยให้ใช้งานผ่าน Terminal ได้สะดวกมากขึ้น

จากนั้นคลิกปุ่ม Next เพื่อไปยังขั้นตอนสุดท้ายก่อนเริ่มติดตั้ง จะเข้าสู่หน้า Ready to Install ให้คลิกปุ่ม Install เพื่อเริ่มติดตั้ง

เมื่อติดตั้งเสร็จ สามารถเปิดโปรแกรมขึ้นมาใช้งานได้เลย เมื่อเปิดโปรแกรมขึ้นมาครั้งแรกจะเข้าสู่หน้า Get started with VS Code เราสามารถตั้งค่าเริ่มต้นต่าง ๆ ได้ที่หน้านี้ หรือปิดไปก่อนเพื่อตั้งค่าทีหลังได้