แบบฝึกหัด - ตั้งค่า GitHub Copilot ให้ทํางานกับ Visual Studio Code

  • 5 นาที

ในแบบฝึกหัดนี้ เราจะสร้างที่เก็บใหม่โดยใช้เทมเพลต GitHub สําหรับเว็บแอปพลิเคชันฟรอนต์เอนด์ของพอร์ตโครงการส่วนบุคคล JavaScript

วิธีการตั้งค่า GitHub Copilot

หากต้องการใช้ GitHub Copilot คุณจําเป็นต้องทําตามขั้นตอนต่อไปนี้:

  1. บัญชี GitHub:

    • สร้างบัญชี GitHub เนื่องจาก Copilot เป็นบริการ GitHub อย่างหนึ่ง คุณจึงต้องมีบัญชี GitHub เพื่อใช้งาน ถ้าคุณยังไม่มีบัญชีผู้ใช้ โปรดเยี่ยมชม เว็บเพจ GitHub เพื่อสร้างบัญชีฟรี

  2. ลงทะเบียนและเปิดใช้งาน GitHub Copilot:

    • คุณสามารถตั้งค่าบัญชี GitHub Copilot ฟรี หรือลงทะเบียนสําหรับการสมัครใช้งาน GitHub Copilot Pro รุ่นทดลองใช้ฟรี 30 วันแบบครั้งเดียวได้ สําหรับวัตถุประสงค์การเรียนรู้ตัวเลือก Copilot ฟรีพร้อมขีดจํากัดการใช้งานควรเพียงพอ
    • สิ่งสําคัญคือต้องระวังเงื่อนไขการทดลองใช้ฟรีของ GitHub Copilot: หากคุณเลือกข้อเสนอการทดลองใช้ฟรีสําหรับ GitHub Copilot จะมีการขอชําระเงินเมื่อลงทะเบียน จะไม่มีการเรียกเก็บเงินจนกว่าการทดลองใช้จะสิ้นสุดลง เว้นแต่ว่าคุณยกเลิกก่อนสรุประยะเวลา 30 วัน

เคล็ดลับ

GitHub Copilot เสนอระดับฟรีด้วยการกรอกข้อมูลรหัสอัตโนมัติ 2,000 รายการและข้อความแชท 50 ข้อความต่อเดือน เมื่อต้องเริ่มต้นใช้งาน เปิด Visual Studio Code คลิกที่ไอคอน GitHub Copilot แล้วคลิก "ลงชื่อเข้าใช้เพื่อใช้ GitHub Copilot สําหรับฟรี" ลงชื่อเข้าใช้บัญชี GitHub ของคุณในหน้าต่างที่เปิดขึ้นในเบราว์เซอร์ เรียนรู้เพิ่มเติม นักการศึกษา นักเรียน และผู้ดูแลโอเพ่นซอร์สที่เลือกสามารถรับ Copilot Pro ได้ฟรี เรียนรู้วิธีการที่: https://aka.ms/Copilot4Students.

  1. ติดตั้งส่วนขยาย:
    • GitHub Copilot พร้อมใช้งานเป็นส่วนขยายสําหรับ IDE หลัก ๆ รวมถึง Visual Studio, Visual Studio Code, JetBrains IDEs, VIM และ XCode
    • หากต้องการติดตั้ง ให้ค้นหา "GitHub Copilot" ใน Marketplace ส่วนขยายของ IDE ของคุณและทําตามคําแนะนําในการติดตั้ง ตัวอย่างเช่น ในตลาด VS Code คุณจะพบ GitHub Copilot, GitHub Copilot Chat และ GitHub Copilot สําหรับ Azure เป็นตัวเลือกในการติดตั้ง

การตั้งค่าสภาพแวดล้อม

ก่อนอื่นคุณต้องเปิดใช้งานสภาพแวดล้อม Codespace ซึ่งได้รับการกําหนดค่าล่วงหน้าด้วยส่วนขยาย GitHub Copilot

  1. เลือกปุ่มต่อไปนี้เพื่อเปิด Codespace ด้วยสภาพแวดล้อมที่กําหนดไว้ล่วงหน้า

    เปิดใน GitHub Codespace

  2. ในหน้าสร้าง Codespace ให้ตรวจสอบการตั้งค่าการกําหนดค่า Codespace จากนั้นเลือกสร้าง Codespace ใหม่

  3. รอให้ Codespace เริ่มต้น กระบวนการเริ่มต้นนี้อาจใช้เวลาสักครู่

  4. แบบฝึกหัดที่เหลือในโครงการนี้จะเกี่ยวข้องกับบริบทของคอนเทนเนอร์การพัฒนานี้

สำคัญ

บัญชี GitHub ทั้งหมดสามารถใช้ Codespaces ได้ฟรีสูงสุด 60 ชั่วโมงต่อเดือนพร้อมอินสแตนซ์หลักสองอินสแตนซ์ ดูข้อมูลเพิ่มเติมได้ที่ GitHub Codespace รวมพื้นที่เก็บข้อมูลและชั่วโมงการทำงานหลักรายเดือน

พอร์ตโครงการ JavaScript

เมื่อเสร็จแล้ว Codespace จะมีส่วนเทอร์มินัลที่ด้านล่าง Codespace จะติดตั้งส่วนขยายที่จําเป็นทั้งหมดและการขึ้นต่อกันในคอนเทนเนอร์ของคุณ เมื่อเสร็จสมบูรณ์ เทมเพลตนี้จะถูกกําหนดค่าให้ใช้ npm start เพื่อเริ่มต้นเว็บแอปพลิเคชันภายใน Codespace ของคุณ

เมื่อเว็บแอปพลิเคชันเริ่มต้นใช้งานเสร็จเรียบร้อยแล้ว ข้อความในเทอร์มินัลจะแสดงให้เห็นว่าเซิร์ฟเวอร์กําลังทํางานอยู่บนพอร์ต 1234 ภายใน Codespace ของคุณ