pre

ECE203 การวิเคราะห์และ ออกแบบระบบ

2 รายชอื่ สมาชกิ กลมุ่ นายวรวฒุ ิ แสวงศริ ผิ ล รหัส62003126012 นายอภิเดช เจรญิ ศรีนคิ ม รหสั 62003126014 นายอทิ ธพิ ล ขาเหม รหัส62003126030

3 กล่มุ ท่ี 5 เร่อื ง code Generate Tools

4 โปรแกรม : Visual Studio Code

5 Visual Studio Code Visual Studio Code หรือ VSCode เป็นโปรแกรม Code Editor ท่ใี ชใ้ นการแก้ไขและปรบั แต่งโคด้ จากคา่ ย ไมโครซอฟท์ มกี ารพฒั นาออกมาในรูปแบบของ OpenSource จึงสามารถนามาใชง้ านไดแ้ บบฟรี ๆ ท่ีตอ้ งการความเปน็ มอื อาชพี ซึ่ง Visual Studio Code นัน้ เหมาะสาหรับนักพฒั นาโปรแกรมท่ีตอ้ งการใชง้ านข้ามแพลตฟอรม์ รองรับการใชง้ าน ทง้ั บน Windows, macOS และ Linux สนับสนุนทง้ั ภาษา JavaScript, TypeScript และ Node.js สามารถเช่อื มตอ่ กบั Git ได้ นามาใชง้ านไดง้ ่ายไม่ซบั ซ้อน มเี ครอ่ื งมอื สว่ นขยายตา่ ง ๆ ใหเ้ ลอื กใช้อย่างมากมาก ไมว่ ่าจะเป็น 1.การเปิดใชง้ านภาษาอ่ืน ๆ ทง้ั ภาษา C++, C#, Java, Python, PHP หรือ Go 2.Themes 3.Debugger 4.Commands เปน็ ตน้ .

6

7 วิธีการใชง้ าน Visual Studio Code เบื้องตน้ 1. เปดิ โปรแกรม Visual Studio Code ขึน้ มา

8 วธิ กี ารใช้งาน Visual Studio Code เบือ้ งต้น 2.สิ่งแรกที่ตอ้ งก็ ทาคอื ติดตั้ง Plugin ไปที่ Search

9 วธิ ีการใช้งาน Visual Studio Code เบ้อื งตน้ 3. แลว้ ค้นหาคาว่า vscode icon หลังจาน้นั ติดตัง้ ได้เลย

10 วธิ ีการใช้งาน Visual Studio Code เบือ้ งตน้ 4.การเปดิ ใชง้ าน Code > Preferences . File Icon Theme

11 วธิ ีการใชง้ าน Visual Studio Code เบื้องต้น 5. แลว้ กดเลอื ก VSCode Icons

12 วิธีการใชง้ าน Visual Studio Code เบือ้ งต้น 6. Plugin ตัวตอ่ ไป Snippet ทีจ่ ะช่วยทา Auto Complete

13 วิธีการใช้งาน Visual Studio Code เบือ้ งต้น 7. ตอ่ ไปเรามาลองทดสอบ โดยการนา VS code ไปเปดิ โปรเจค Angular

14 วิธกี ารใชง้ าน Visual Studio Code เบ้อื งต้น 8. จะได้หนา้ ตา่ งใชง้ านดงั ภาพน้ี

15 ขอ้ ดี 1. Meet IntelliSense รองรบั การใส่สเี พ่อื ให้อา่ นโคด้ ง่ายขึ้น (Syntax Highlighting) รวมถงึ การคาดเดาท่สี ิง่ Dev กาลงั จะพมิ พ์ (Autocomplete) 2. Debugging รองรบั การ Debug โคด้ ภายในตัวโปรแกรมสามารถ Launch โปรเจคข้ึน มาแล้ว debug ด้วย breakpoint, call stacks และทส่ี าคญั มี Command/Console Prompt ภายในตัวอกี ดว้ ย 3. Git นค่ี อื ข้อดีทถ่ี อื วา่ เบ็ดเสร็จไดใ้ นโปรแกรมเดยี วกนั มี Version Control ภายในตัวเองเลย จากท่ผี มดกู ็ถอื ว่าครบเครอ่ื งเรือ่ ง git 4. นอกเหนอื ไปจากน้ี dev ท่านใดใช้ git-flow กย็ ังสามารถตดิ ต้ัง extension เพม่ิ เติมได้ท่ี marketplace

16 ข้อเสยี 1. ยงั ไมพ่ บ

17 อา้ งองิ จาก 1. https://www.mindphp.com/%E0%B8%9A%E0%B8%97%E0%B8%84%E0%B8 %A7%E0%B8%B2%E0%B8%A1/microsoft/4829-visual-studio-code.html 2. http://cs.bru.ac.th/%E0%B8%AA%E0%B8%AD%E0%B8%99%E0%B8%A7%E 0%B8%B4%E0%B8%98%E0%B8%B5%E0%B8%81%E0%B8%B2%E0%B8%A 3%E0%B9%83%E0%B8%8A%E0%B9%89-visual-studio-code-2/ 3. https://th.wikipedia.org/wiki/%E0%B8%A7%E0%B8%B4%E0%B8%8A%E0%B 8%A7%E0%B8%A5%E0%B8%AA%E0%B8%95%E0%B8%B9%E0%B8%94%E 0%B8%B4%E0%B9%82%E0%B8%AD%E0%B9%82%E0%B8%84%E0%B9%8 9%E0%B8%94

18 ขอจบการนาเสนอ ขอบคณุ ครบั