ติดตั้ง Claude Code CLI + Extension

เกริ่นนำ: Claude Code คืออะไร และทำไมต้องติดตั้ง?

สวัสดีครับน้อง ๆ ทุกคน! วันนี้เราจะมาทำความรู้จักกับเครื่องมือสุดเจ๋งที่ชื่อว่า Claude Code กันครับ ลองนึกภาพว่าเรากำลังสร้างบ้านหลังหนึ่ง แล้วมีผู้ช่วยที่ฉลาดมากๆ คอยบอกว่าควรวางอิฐตรงไหน ควรใช้ค้อนแบบไหน หรือช่วยออกแบบห้องให้สวยงามได้ นั่นแหละครับ Claude Code ก็ทำหน้าที่คล้ายๆ กัน แต่เป็นการช่วยเราเขียนโค้ดโปรแกรมแทน

Claude Code เป็นเหมือนผู้ช่วย AI อัจฉริยะจาก Anthropic ที่จะมาช่วยเราทำงานเขียนโปรแกรมให้ง่ายขึ้น เร็วขึ้น และมีคุณภาพดีขึ้น โดยมี 2 ส่วนหลักๆ คือ 1) CLI (Command Line Interface) ที่เราสั่งงานด้วยการพิมพ์ข้อความ และ 2) VS Code Extension ที่เป็นส่วนเสริมในโปรแกรมเขียนโค้ดของเรา การติดตั้ง Claude Code ก็เหมือนกับการเชิญผู้ช่วยคนเก่งคนนี้เข้ามาทำงานในคอมพิวเตอร์ของเรานั่นเองครับ

เตรียมเครื่องให้พร้อม: ติดตั้ง Node.js (เหมือนเตรียมดินปลูกต้นไม้)

ก่อนที่เราจะติดตั้ง Claude Code ได้ เราต้องเตรียมสภาพแวดล้อมให้พร้อมก่อนครับ ลองนึกภาพว่าเราอยากปลูกต้นไม้ เราก็ต้องมีดินที่ดีและเหมาะสมใช่ไหมครับ? สำหรับ Claude Code ดินที่เราต้องการก็คือ Node.js นั่นเองครับ

Node.js คือสภาพแวดล้อมที่ทำให้โปรแกรม JavaScript ทำงานนอกเว็บเบราว์เซอร์ได้ และที่สำคัญคือมันมาพร้อมกับ npm (Node Package Manager) ซึ่งเป็นเหมือนร้านค้าหรือคลังเก็บโปรแกรมเล็กๆ ที่เราจะใช้ดาวน์โหลด Claude Code มาติดตั้งนั่นเองครับ เราต้องมี Node.js เวอร์ชัน 18 ขึ้นไปนะครับ ถ้าเวอร์ชันเก่าไปหรือไม่มีเลย Claude Code อาจจะทำงานไม่ได้

1. เปิดเว็บเบราว์เซอร์ แล้วไปที่เว็บไซต์ nodejs.org
2. มองหาเวอร์ชันที่เป็น LTS (Long Term Support) ซึ่งเป็นเวอร์ชันที่แนะนำและเสถียรที่สุด แล้วคลิกดาวน์โหลดสำหรับระบบปฏิบัติการของคุณ (Mac หรือ Windows)
3. เมื่อดาวน์โหลดไฟล์ติดตั้งมาแล้ว ให้ดับเบิลคลิกเพื่อเริ่มการติดตั้ง ทำตามขั้นตอนบนหน้าจอไปเรื่อยๆ โดยส่วนใหญ่จะแค่กด Next, Accept, Next, Install และ Finish ครับ
4. หลังจากติดตั้งเสร็จ ลองเปิดโปรแกรม Terminal (สำหรับ Mac) หรือ Command Prompt / PowerShell (สำหรับ Windows) ขึ้นมา แล้วพิมพ์คำสั่ง node -v และ npm -v เพื่อตรวจสอบว่าติดตั้งสำเร็จและเป็นเวอร์ชันที่ถูกต้องหรือไม่

ติดตั้ง Claude Code CLI: ผู้ช่วย AI ตัวจริงมาแล้ว!

เมื่อเราเตรียมดินปลูกต้นไม้ (Node.js) เรียบร้อยแล้ว ขั้นตอนต่อไปก็คือการปลูกต้นไม้ของเราครับ นั่นคือการติดตั้ง Claude Code CLI นั่นเอง CLI ย่อมาจาก Command Line Interface ซึ่งหมายถึงการที่เราจะสั่งงานโปรแกรมด้วยการพิมพ์คำสั่งลงไปในหน้าจอสีดำๆ (Terminal หรือ Command Prompt) ครับ

เราจะใช้ npm (ที่เราได้มาพร้อมกับ Node.js) ในการติดตั้ง Claude Code ครับ คำสั่งที่เราจะใช้คือ npm install -g @anthropic-ai/claude-code คำว่า -g หมายถึงการติดตั้งแบบ 'Global' คือติดตั้งให้ใช้งานได้ทั่วทั้งเครื่อง ไม่ว่าจะอยู่ที่โฟลเดอร์ไหน ก็สามารถเรียกใช้ Claude Code ได้เลยครับ

1. เปิดโปรแกรม Terminal (Mac) หรือ Command Prompt / PowerShell (Windows) ขึ้นมาอีกครั้ง
2. พิมพ์คำสั่งนี้ลงไปให้ถูกต้องทุกตัวอักษร: npm install -g @anthropic-ai/claude-code แล้วกด Enter
3. รอให้โปรแกรมทำการดาวน์โหลดและติดตั้ง อาจจะใช้เวลาสักครู่ ขึ้นอยู่กับความเร็วอินเทอร์เน็ตของคุณครับ ถ้าทุกอย่างเรียบร้อย คุณจะเห็นข้อความแจ้งว่าติดตั้งสำเร็จ

เริ่มต้นใช้งาน Claude Code CLI: ทักทาย AI ครั้งแรก

ตอนนี้ Claude Code CLI ได้ถูกติดตั้งลงในเครื่องของเราเรียบร้อยแล้วครับ เหมือนเรามีผู้ช่วย AI พร้อมทำงานแล้ว แต่ก่อนอื่น เราต้องแนะนำตัวกับผู้ช่วยของเราก่อน เพื่อให้เขารู้ว่าเราคือเจ้าของบัญชีที่จะใช้งานเขาครับ

การแนะนำตัวนี้จะเกิดขึ้นแค่ครั้งแรกเท่านั้นครับ หลังจากนั้น Claude Code ก็จะจำเราได้และพร้อมทำงานให้เราได้ทันที

1. เปิดโปรแกรม Terminal หรือ Command Prompt ขึ้นมา
2. ใช้คำสั่ง cd เพื่อเข้าไปยังโฟลเดอร์โปรเจกต์งานที่เราต้องการให้ Claude Code ช่วย เช่น ถ้าโปรเจกต์ของคุณอยู่ใน C:\MyProjects\AwesomeApp ก็พิมพ์ cd C:\MyProjects\AwesomeApp หรือถ้าอยู่บน Mac ใน ~/Documents/MyCode ก็พิมพ์ cd ~/Documents/MyCode
3. เมื่ออยู่ในโฟลเดอร์โปรเจกต์แล้ว ให้พิมพ์คำสั่ง: claude แล้วกด Enter
4. ครั้งแรกที่รันคำสั่งนี้ Claude Code จะเปิดหน้าต่างเว็บเบราว์เซอร์ขึ้นมา เพื่อให้คุณทำการ Login ด้วยบัญชี Anthropic ของคุณ (ถ้ายังไม่มี ก็สามารถสมัครใหม่ได้ครับ)
5. เมื่อ Login สำเร็จ เว็บเบราว์เซอร์จะแจ้งว่าคุณสามารถปิดหน้าต่างนี้ได้ และ Claude Code CLI ใน Terminal ของคุณก็จะพร้อมใช้งานครับ

เสริมพลังด้วย VS Code Extension: AI ใน Editor คู่ใจ

การใช้งาน Claude Code ผ่าน CLI นั้นยอดเยี่ยมแล้วครับ แต่เราจะทำให้มันสะดวกสบายยิ่งขึ้นไปอีก ด้วยการติดตั้งส่วนเสริม (Extension) ในโปรแกรม VS Code ครับ VS Code เป็นโปรแกรมเขียนโค้ดยอดนิยมที่นักพัฒนาส่วนใหญ่ใช้กัน เหมือนเป็นสมุดจดบันทึกและเครื่องมือช่างคู่ใจของเรานั่นเองครับ

ส่วนเสริม Claude Code Extension จะช่วยให้เราสามารถสั่งงาน Claude ได้โดยตรงจากใน VS Code เลยครับ ไม่ต้องสลับไปมาระหว่างโปรแกรมเขียนโค้ดกับ Terminal อีกต่อไป เราจะเห็นคำแนะนำการแก้ไขโค้ด หรือส่วนที่เปลี่ยนแปลง (diff) ได้อย่างสวยงามและชัดเจน ทำให้การทำงานราบรื่นและมีประสิทธิภาพมากขึ้นครับ

1. เปิดโปรแกรม VS Code ขึ้นมา
2. มองหาไอคอนสี่เหลี่ยมซ้อนกันทางด้านซ้ายมือของจอ (หรือกด Ctrl+Shift+X บน Windows/Linux หรือ Cmd+Shift+X บน Mac) นั่นคือเมนู Extensions ครับ
3. ในช่องค้นหา (Search Extensions in Marketplace) ให้พิมพ์คำว่า: Claude Code
4. เมื่อเจอ Extension ที่ชื่อ 'Claude Code' ที่มีผู้พัฒนาเป็น Anthropic ให้คลิกที่ชื่อ Extension นั้น แล้วกดปุ่ม Install
5. รอสักครู่จนกว่าการติดตั้งจะเสร็จสิ้น เมื่อติดตั้งเรียบร้อยแล้ว Claude Code Extension ก็พร้อมใช้งานใน VS Code ของคุณทันทีครับ