สร้างฟีเจอร์ Gen AI ที่ขับเคลื่อนโดยข้อมูลของคุณด้วย Genkit

1. ก่อนเริ่มต้น

ใน Codelab นี้ คุณจะได้เรียนรู้วิธีใช้ Genkit เพื่อผสานรวม Generative AI เข้ากับแอปของคุณ Genkit เป็นเฟรมเวิร์กโอเพนซอร์สที่จะช่วยคุณสร้าง ปรับใช้ และตรวจสอบแอปที่ทำงานด้วยระบบ AI ที่พร้อมใช้งานจริง

Genkit ออกแบบมาสำหรับนักพัฒนาแอปเพื่อช่วยให้คุณผสานรวมความสามารถของ AI ที่ทรงพลังเข้ากับแอปได้อย่างง่ายดายด้วยรูปแบบและกระบวนทัศน์ที่คุ้นเคย โดยทีม Firebase เป็นผู้สร้างเครื่องมือนี้ ซึ่งใช้ประโยชน์จากประสบการณ์ของเราในการสร้างเครื่องมือที่นักพัฒนาแอปหลายล้านคนทั่วโลกใช้

ข้อกำหนดเบื้องต้น

  • คุ้นเคยกับ Firestore, Node.js และ TypeScript

สิ่งที่คุณจะได้เรียนรู้

  • วิธีสร้างแอปที่ชาญฉลาดขึ้นด้วยความสามารถในการค้นหาความคล้ายคลึงของเวกเตอร์ขั้นสูงของ Firestore
  • วิธีนำ Generative AI ไปใช้ในแอปของคุณอย่างเป็นรูปธรรมโดยใช้ Genkit
  • เตรียมโซลูชันให้พร้อมสำหรับการติดตั้งใช้งานและการผสานรวม

สิ่งที่ต้องมี

  • เบราว์เซอร์ที่คุณเลือก เช่น Google Chrome
  • สภาพแวดล้อมในการพัฒนาซอฟต์แวร์ที่มีตัวแก้ไขโค้ดและเทอร์มินัล
  • บัญชี Google สำหรับการสร้างและการจัดการโปรเจ็กต์ Firebase

2. ตรวจสอบเว็บแอปและบริการระบบคลาวด์ที่ใช้

ในส่วนนี้ คุณจะได้ตรวจสอบเว็บแอปที่จะสร้างด้วย Codelab นี้ รวมถึงเรียนรู้เกี่ยวกับบริการระบบคลาวด์ที่จะใช้

เว็บแอป

ใน Codelab นี้ คุณจะได้ทำงานในฐานของโค้ดของแอปชื่อ Compass ซึ่งเป็นแอปวางแผนวันหยุด ผู้ใช้สามารถเลือกจุดหมายปลายทาง ดูกิจกรรมในจุดหมายปลายทาง และสร้างแผนการเดินทางสำหรับทริปของตนเองได้

ใน Codelab นี้ คุณจะได้ใช้ฟีเจอร์ใหม่ 2 อย่างซึ่งมีจุดประสงค์เพื่อเพิ่มการมีส่วนร่วมของผู้ใช้กับหน้าแรกของแอป ฟีเจอร์ทั้ง 2 รายการนี้ทำงานด้วย Generative AI

  • ปัจจุบันแอปแสดงรายการปลายทางแบบคงที่ คุณจะเปลี่ยนให้เป็นแบบไดนามิก
  • คุณจะใช้แผนการเดินทางที่ป้อนข้อมูลอัตโนมัติเพื่อหวังว่าจะเพิ่มความเหนียวหนึบ

d54f2043af908fb.png

บริการที่ใช้

ใน Codelab นี้ คุณจะได้ใช้บริการและฟีเจอร์ต่างๆ ของ Firebase และ Cloud มากมาย และเราได้เตรียมโค้ดเริ่มต้นส่วนใหญ่ไว้ให้คุณแล้ว ตารางต่อไปนี้แสดงบริการที่คุณจะได้ใช้และเหตุผลในการใช้บริการเหล่านั้น

บริการ

เหตุผลในการใช้งาน

Genkit

คุณใช้ Genkit เพื่อนำ Generative AI มาใช้ในแอปพลิเคชัน Node.js / Next.js

Cloud Firestore

คุณจัดเก็บข้อมูลใน Cloud Firestore ซึ่งจะใช้สำหรับการค้นหาความคล้ายคลึงของเวกเตอร์

Vertex AI ของ Google Cloud

คุณใช้โมเดลพื้นฐานจาก Vertex AI (เช่น Gemini) เพื่อขับเคลื่อนฟีเจอร์ AI

Firebase App Hosting

คุณเลือกใช้ Firebase App Hosting ที่ปรับปรุงใหม่เพื่อแสดงเว็บแอป Next.js แบบไดนามิก (เชื่อมต่อกับที่เก็บ GitHub) ได้

3. ตั้งค่าสภาพแวดล้อมในการพัฒนาซอฟต์แวร์

ยืนยันเวอร์ชัน Node.js

  1. ในเทอร์มินัล ให้ตรวจสอบว่าคุณได้ติดตั้ง Node.js เวอร์ชัน 20.0.0 ขึ้นไปแล้ว
    node -v
  2. หากคุณไม่มี Node.js เวอร์ชัน 20.0.0 ขึ้นไป ให้ดาวน์โหลดเวอร์ชัน LTS ล่าสุดและติดตั้ง

ดูซอร์สโค้ดสำหรับ Codelab

หากคุณมีบัญชี GitHub ให้ทำดังนี้

  1. สร้างที่เก็บใหม่โดยใช้เทมเพลตจาก github.com/FirebaseExtended/codelab-ai-genkit-rag65ef006167d600ab.png
  2. สร้างโคลนในเครื่องของที่เก็บ GitHub ของโค้ดแล็บที่คุณเพิ่งสร้าง
    git clone https://github.com/<your-github-handle>/codelab-ai-genkit-rag

หากไม่ได้ติดตั้ง git หรือไม่ต้องการสร้างที่เก็บใหม่ ให้ทำดังนี้

ดาวน์โหลดที่เก็บ GitHub เป็นไฟล์ ZIP

ตรวจสอบโครงสร้างโฟลเดอร์

ในเครื่อง ให้ค้นหารีโมตที่โคลนไว้และตรวจสอบโครงสร้างโฟลเดอร์

โฟลเดอร์

คำอธิบาย

load-firestore-data

เครื่องมือบรรทัดคำสั่ง Helper เพื่อป้อนข้อมูลล่วงหน้าในคอลเล็กชัน Firestore อย่างรวดเร็ว

*อื่นๆ

โค้ดเว็บแอป Next.js

โฟลเดอร์รูทมีไฟล์ README.md ซึ่งมีคำแนะนำที่กระชับเพื่อให้เริ่มต้นใช้งานเว็บแอปได้อย่างรวดเร็ว อย่างไรก็ตาม หากคุณเป็นผู้เรียนครั้งแรก คุณควรทำ Codelab นี้ให้เสร็จ (แทนที่จะเป็นคำแนะนำแบบรวดเร็ว) เนื่องจาก Codelab มีชุดคำแนะนำที่ครอบคลุมที่สุด

หากไม่แน่ใจว่าได้ใช้โค้ดอย่างถูกต้องตามที่ระบุไว้ใน Codelab นี้หรือไม่ คุณสามารถดูโค้ดโซลูชันได้ในendสาขา Git

ติดตั้ง Firebase CLI

  1. ตรวจสอบว่าคุณได้ติดตั้ง Firebase CLI และเป็นเวอร์ชัน 13.6 ขึ้นไปแล้ว
    firebase --version
  2. หากคุณติดตั้ง Firebase CLI ไว้แล้ว แต่ไม่ใช่เวอร์ชัน 13.6 ขึ้นไป ให้อัปเดตโดยทำดังนี้
    npm update -g firebase-tools
  3. หากยังไม่ได้ติดตั้ง Firebase CLI ให้ติดตั้งโดยทำดังนี้
    npm install -g firebase-tools

หากอัปเดตหรือติดตั้ง Firebase CLI ไม่ได้เนื่องจากข้อผิดพลาดเกี่ยวกับสิทธิ์ โปรดดูเอกสารประกอบของ npm หรือใช้ตัวเลือกการติดตั้งอื่น

เข้าสู่ระบบ Firebase

  1. ในเทอร์มินัล ให้เข้าสู่ระบบ Firebase โดยทำดังนี้
    firebase login
    หากเทอร์มินัลระบุว่าคุณเข้าสู่ระบบ Firebase แล้ว ให้ข้ามไปที่ส่วนตั้งค่าโปรเจ็กต์ Firebase ของโค้ดแล็บนี้
  2. ในเทอร์มินัล ให้ป้อน Y หรือ N โดยขึ้นอยู่กับว่าคุณต้องการให้ Firebase รวบรวมข้อมูลหรือไม่ (ตัวเลือกใดก็ได้สำหรับ Codelab นี้)
  3. ในเบราว์เซอร์ ให้เลือกบัญชี Google แล้วคลิกอนุญาต

ติดตั้ง gcloud CLI ของ Google Cloud

  1. ติดตั้ง gcloud CLI
  2. ในเทอร์มินัล ให้เข้าสู่ระบบ Google Cloud โดยทำดังนี้
    gcloud auth login

4. ตั้งค่าโปรเจ็กต์ Firebase

ในส่วนนี้ คุณจะได้ตั้งค่าโปรเจ็กต์ Firebase และลงทะเบียนเว็บแอป Firebase ในโปรเจ็กต์ดังกล่าว นอกจากนี้ คุณยังจะได้เปิดใช้บริการบางอย่างที่เว็บแอปตัวอย่างใช้ในโค้ดแล็บนี้ในภายหลัง

ขั้นตอนทั้งหมดในส่วนนี้จะดำเนินการในคอนโซล Firebase

สร้างโปรเจ็กต์ Firebase

  1. ลงชื่อเข้าใช้คอนโซล Firebase โดยใช้บัญชี Google เดียวกับที่คุณใช้ในขั้นตอนก่อนหน้า
  2. คลิกปุ่มเพื่อสร้างโปรเจ็กต์ใหม่ แล้วป้อนชื่อโปรเจ็กต์ (เช่น Compass Codelab)
  3. คลิกต่อไป
  4. หากได้รับแจ้ง ให้อ่านและยอมรับข้อกำหนดของ Firebase แล้วคลิกต่อไป
  5. (ไม่บังคับ) เปิดใช้ความช่วยเหลือจาก AI ในคอนโซล Firebase (เรียกว่า "Gemini ใน Firebase")
  6. สำหรับ Codelab นี้ คุณไม่จำเป็นต้องใช้ Google Analytics ดังนั้นปิดตัวเลือก Google Analytics
  7. คลิกสร้างโปรเจ็กต์ รอให้ระบบจัดสรรโปรเจ็กต์ แล้วคลิกดำเนินการต่อ

เพิ่มเว็บแอปไปยังโปรเจ็กต์ Firebase

  1. ไปที่หน้าจอภาพรวมโปรเจ็กต์ในโปรเจ็กต์ Firebase แล้วคลิก ไอคอนที่มีวงเล็บมุมเปิด เครื่องหมายทับ และวงเล็บมุมปิด ซึ่งแสดงถึงเว็บแอป เว็บปุ่มเว็บที่ด้านบนของภาพรวมโปรเจ็กต์ในคอนโซล Firebase
  2. ในกล่องข้อความชื่อเล่นของแอป ให้ป้อนชื่อเล่นของแอปที่จำง่าย เช่น My Compass Codelab App คุณไม่ต้องเลือกช่องทำเครื่องหมายสำหรับการตั้งค่าโฮสติ้งของ Firebase เนื่องจากคุณจะตั้งค่าบริการโฮสติ้งในขั้นตอนสุดท้ายของ Codelab นี้
    การลงทะเบียนเว็บแอป
  3. คลิกลงทะเบียนแอป > ดำเนินการต่อในคอนโซล

เยี่ยมเลย ตอนนี้คุณได้ลงทะเบียนเว็บแอปในโปรเจ็กต์ Firebase ใหม่แล้ว

อัปเกรดแพ็กเกจราคาของ Firebase

หากต้องการใช้ Genkit และ Vertex AI (รวมถึงบริการระบบคลาวด์ที่เกี่ยวข้อง) โปรเจ็กต์ Firebase ของคุณต้องอยู่ในแพ็กเกจราคาแบบจ่ายตามการใช้งาน (Blaze) ซึ่งหมายความว่าโปรเจ็กต์ต้องลิงก์กับบัญชีสำหรับการเรียกเก็บเงินใน Cloud

ดูข้อมูลเพิ่มเติมเกี่ยวกับการกำหนดราคาสำหรับ Vertex AI

หากต้องการอัปเกรดโปรเจ็กต์เป็นแพ็กเกจ Blaze ให้ทำตามขั้นตอนต่อไปนี้

  1. ในคอนโซล Firebase ให้เลือกอัปเกรดแพ็กเกจ
  2. เลือกแพ็กเกจ Blaze ทำตามวิธีการบนหน้าจอเพื่อลิงก์บัญชีสำหรับการเรียกเก็บเงินใน Cloud กับโปรเจ็กต์
    หากคุณต้องสร้างบัญชีสำหรับการเรียกเก็บเงินใน Cloud เป็นส่วนหนึ่งของการอัปเกรดนี้ คุณอาจต้องกลับไปที่ขั้นตอนการอัปเกรดในคอนโซล Firebase เพื่อทำการอัปเกรดให้เสร็จสมบูรณ์

ตั้งค่า Cloud Firestore

  1. ในแผงด้านซ้ายของคอนโซล Firebase ให้ขยายสร้าง แล้วเลือกฐานข้อมูล Firestore
  2. คลิกสร้างฐานข้อมูล
  3. เลือกรุ่นมาตรฐาน แล้วคลิกถัดไป
  4. ตั้งค่ารหัสฐานข้อมูลเป็น (default) ไว้ดังเดิม
  5. เลือกตำแหน่งสำหรับฐานข้อมูล แล้วคลิกถัดไป
    สำหรับแอปจริง คุณควรเลือกตำแหน่งที่อยู่ใกล้กับผู้ใช้
  6. คลิกเริ่มในโหมดทดสอบ อ่านข้อจำกัดความรับผิดเกี่ยวกับกฎความปลอดภัย
    อย่าเผยแพร่หรือเปิดเผยแอปต่อสาธารณะโดยไม่ได้เพิ่มกฎความปลอดภัยสำหรับฐานข้อมูล
  7. คลิกสร้าง

เปิดใช้ Vertex AI

ใช้ gcloud CLI เพื่อตั้งค่า Vertex AI สำหรับคำสั่งทั้งหมดในหน้านี้ โปรดตรวจสอบว่าได้แทนที่ YOUR_PROJECT_ID ด้วยรหัสของโปรเจ็กต์ Firebase

  1. ในเทอร์มินัล ให้ตั้งค่าโปรเจ็กต์เริ่มต้นสำหรับ Google Cloud SDK โดยทำดังนี้
    gcloud config set project YOUR_PROJECT_ID
  2. หากเห็นข้อความเตือนที่ระบุว่า "คำเตือน: โปรเจ็กต์ที่ใช้งานอยู่ไม่ตรงกับโปรเจ็กต์โควต้าในไฟล์ข้อมูลเข้าสู่ระบบเริ่มต้นของแอปพลิเคชันในเครื่อง ซึ่งอาจทำให้เกิดปัญหาโควต้าที่ไม่คาดคิด" จากนั้นเรียกใช้คำสั่งต่อไปนี้เพื่อตั้งค่าโปรเจ็กต์โควต้า
    gcloud auth application-default set-quota-project YOUR_PROJECT_ID
  3. เปิดใช้บริการ Vertex AI ในโปรเจ็กต์โดยทำดังนี้
    gcloud services enable aiplatform.googleapis.com

5. ตั้งค่าเว็บแอป

หากต้องการเรียกใช้เว็บแอป คุณจะต้องเรียกใช้คำสั่งในเทอร์มินัลและเพิ่มโค้ดภายในโปรแกรมแก้ไขโค้ด สำหรับคำสั่งทั้งหมดในหน้านี้ โปรดตรวจสอบว่าได้แทนที่ YOUR_PROJECT_ID ด้วยรหัสของโปรเจ็กต์ Firebase

กำหนดค่า Firebase CLI ให้กำหนดเป้าหมายไปยังโปรเจ็กต์

  1. ในเทอร์มินัล ให้ไปที่ไดเรกทอรีรูทของโปรเจ็กต์ Codelab
  2. หากต้องการให้ Firebase CLI เรียกใช้คำสั่งทั้งหมดกับโปรเจ็กต์ Firebase ให้เรียกใช้คำสั่งต่อไปนี้
    firebase use YOUR_PROJECT_ID

นำเข้าข้อมูลตัวอย่างไปยัง Firestore

Codelab นี้มีข้อมูลตัวอย่างที่สร้างไว้ล่วงหน้าสำหรับ Firestore เพื่อให้คุณเริ่มต้นใช้งานได้อย่างรวดเร็ว

  1. หากต้องการอนุญาตให้ฐานของโค้ดในเครื่องเรียกใช้โค้ดที่ปกติจะใช้บัญชีบริการ ให้เรียกใช้คำสั่งต่อไปนี้ในเทอร์มินัล
    gcloud auth application-default login
    ซึ่งจะเปิดแท็บใหม่ในเบราว์เซอร์ของคุณ เข้าสู่ระบบโดยใช้บัญชี Google เดียวกับที่คุณใช้ในขั้นตอนก่อนหน้า
  2. หากต้องการนำเข้าข้อมูล Firestore ตัวอย่าง ให้เรียกใช้คำสั่งต่อไปนี้
    cd load-firestore-data
npm ci
node index.js YOUR_PROJECT_ID
cd ..
  3. ตรวจสอบว่าเพิ่มข้อมูลลงในฐานข้อมูลเรียบร้อยแล้วโดยไปที่ส่วน Firestore ของโปรเจ็กต์ Firebase ในคอนโซล Firebase คุณควรเห็นสคีมาข้อมูลที่นำเข้าและเนื้อหาที่แสดงข้อมูลตัวอย่าง Compass ในคอนโซล Firebase

เชื่อมต่อเว็บแอปกับโปรเจ็กต์ Firebase

ฐานโค้ดของเว็บแอปต้องเชื่อมโยงกับโปรเจ็กต์ Firebase ที่ถูกต้องเพื่อใช้บริการต่างๆ เช่น ฐานข้อมูล หากต้องการดำเนินการนี้ คุณต้องเพิ่มการกำหนดค่า Firebase ลงในฐานของโค้ดของแอป การกำหนดค่านี้รวมถึงค่าที่จำเป็น เช่น รหัสโปรเจ็กต์ คีย์ API และรหัสแอปของแอป รวมถึงค่าอื่นๆ ที่ช่วยให้แอปโต้ตอบกับ Firebase ได้

  1. รับการกำหนดค่า Firebase ของแอป
    1. ในคอนโซล Firebase ให้ไปที่โปรเจ็กต์ Firebase
    2. ในแผงด้านซ้าย ให้คลิกไอคอนรูปเฟืองข้างภาพรวมโปรเจ็กต์ แล้วเลือกการตั้งค่าโปรเจ็กต์
    3. เลือกเว็บแอปในการ์ด "แอปของคุณ"
    4. ในส่วน "การตั้งค่าและการกำหนดค่า SDK" ให้เลือกตัวเลือก Config
    5. คัดลอกข้อมูลโค้ด โดยจะเริ่มต้นด้วย const firebaseConfig ...
  2. เพิ่มการกำหนดค่า Firebase ลงในโค้ดเบสของเว็บแอป
    1. เปิดไฟล์ src/lib/genkit/genkit.config.ts ในตัวแก้ไขโค้ด
    2. แทนที่ส่วนที่เกี่ยวข้องด้วยโค้ดที่คุณคัดลอก
    3. บันทึกไฟล์

แสดงตัวอย่างเว็บแอปในเบราว์เซอร์

  1. ในเทอร์มินัล ให้ติดตั้งการอ้างอิง แล้วเรียกใช้เว็บแอปโดยใช้คำสั่งต่อไปนี้
    npm install
npm run dev:next
  2. ในเบราว์เซอร์ ให้ไปที่ URL การโฮสต์ที่โฮสต์ไว้ในเครื่องเพื่อดูเว็บแอป เช่น ในกรณีส่วนใหญ่ URL คือ http://localhost:3000/ หรือ URL ที่คล้ายกัน

หน้าจอหลักของแอปเข็มทิศ

Compass เป็นแอป Next.js ที่ใช้ React Server Components และนี่คือหน้าแรก

คลิกค้นหาทริปในฝัน คุณจะเห็นว่าระบบแสดงข้อมูลที่ฮาร์ดโค้ดไว้สำหรับปลายทางที่กำหนดบางแห่ง

ค้นหาหน้าจอทริปในฝัน

คุณสำรวจได้ตามสบาย เมื่อพร้อมที่จะดำเนินการต่อ ให้คลิกหน้าแรกปุ่มหน้าแรก (ที่มุมขวาบน)

6. เจาะลึก Generative AI ด้วย Genkit

ตอนนี้คุณพร้อมที่จะใช้ประโยชน์จากความสามารถของ Generative AI ในแอปพลิเคชันแล้ว ส่วนนี้ของ Codelab จะแนะนำวิธีติดตั้งใช้งานฟีเจอร์ที่แนะนำจุดหมายปลายทางตามแรงบันดาลใจที่ผู้ใช้ระบุ คุณจะใช้ Genkit และ Vertex AI ของ Google Cloud เป็นผู้ให้บริการโมเดล Generative (คุณจะใช้ Gemini)

Genkit สามารถจัดเก็บสถานะการติดตามและโฟลว์ (ซึ่งช่วยให้คุณตรวจสอบผลลัพธ์ของการเรียกใช้โฟลว์ Genkit ได้) ใน Codelab นี้ คุณจะได้ใช้ Firestore เพื่อจัดเก็บการติดตามเหล่านี้

ในขั้นตอนสุดท้ายของ Codelab นี้ คุณจะติดตั้งใช้งานแอป Genkit ใน Firebase App Hosting

เชื่อมต่อแอป Genkit กับโปรเจ็กต์ Firebase

เราได้เชื่อมต่อ Genkit กับโปรเจ็กต์ของคุณแล้วโดยการแก้ไข src/lib/genkit/genkit.config.ts ในขั้นตอนก่อนหน้า

เปิดใช้ UI นักพัฒนาแอป Genkit

Genkit มาพร้อมกับ UI บนเว็บที่ช่วยให้คุณโต้ตอบกับ LLM, โฟลว์ Genkit, ตัวดึงข้อมูล และคอมโพเนนต์ AI อื่นๆ ได้

ในเทอร์มินัล ให้เรียกใช้คำสั่งต่อไปนี้

npm run dev:genkit

ในเบราว์เซอร์ ให้ไปที่ URL ของ Genkit ที่โฮสต์ไว้ในเครื่อง โดยส่วนใหญ่จะเป็น http://localhost:4000/

โต้ตอบกับ Gemini

ตอนนี้คุณสามารถใช้ UI สำหรับนักพัฒนาแอปของ Genkit เพื่อโต้ตอบกับโมเดลที่รองรับหรือคอมโพเนนต์ AI อื่นๆ เช่น พรอมต์ ตัวดึงข้อมูล และโฟลว์ Genkit ได้แล้ว

เช่น ลองขอให้ Gemini แนะนำวันหยุดพักผ่อน โปรดทราบว่าคุณสามารถใช้คำสั่งของระบบเพื่อกำหนดลักษณะการทำงานของโมเดลตามความต้องการเฉพาะของคุณได้อย่างไร ซึ่งใช้ได้กับโมเดลที่ไม่รองรับคำสั่งของระบบโดยค่าเริ่มต้นด้วย

การโต้ตอบกับโมเดล Gemini ใน UI สำหรับนักพัฒนาแอป Genkit

จัดการพรอมต์

Genkit ขอแนะนำ Dotprompt ซึ่งเป็นปลั๊กอินและรูปแบบข้อความที่ออกแบบมาเพื่อเพิ่มประสิทธิภาพการสร้างและการจัดการพรอมต์ Generative AI แนวคิดหลักของ Dotprompt คือการถือว่าพรอมต์เป็นโค้ด ซึ่งช่วยให้คุณเขียน บำรุงรักษา และควบคุมเวอร์ชันของพรอมต์ควบคู่ไปกับโค้ดแอปพลิเคชันได้

หากต้องการใช้ Dotprompt ให้เริ่มต้นด้วยข้อความ "Hello World" ดังนี้

  1. เปิดไฟล์ prompts/1-hello-world.prompt ในตัวแก้ไขโค้ด
  2. ใน UI สำหรับนักพัฒนาซอฟต์แวร์ของ Genkit ให้เปิด prompts/1-hello-world
  3. ใช้ชื่อหรือรหัสภาษาที่คุณคุ้นเคย หรือปล่อยให้เป็นสตริงว่าง
  4. คลิกเรียกใช้การใช้ Dotprompt เพื่อสร้างคำทักทายในภาษาสวีเดน
  5. ลองใช้ค่าอื่น 2-3 ค่า โมเดลภาษาขนาดใหญ่มีความสามารถในการทำความเข้าใจพรอมต์ที่ย่อ พิมพ์ผิด หรือไม่สมบูรณ์ในคำค้นหาอย่างง่าย เช่น คำค้นหานี้

ปรับปรุงเอาต์พุตด้วย Structured Data

นอกเหนือจากการสร้างข้อความธรรมดาแล้ว Genkit ยังช่วยให้คุณจัดโครงสร้างเอาต์พุตเพื่อการนำเสนอและการผสานรวมที่ดียิ่งขึ้นภายใน UI ของแอปได้ด้วย การกำหนดสคีมาจะช่วยให้คุณสั่งให้ LLM สร้าง Structured Data ที่สอดคล้องกับรูปแบบที่ต้องการได้

การสำรวจสคีมาเอาต์พุต

นอกจากนี้ คุณยังระบุสคีมาเอาต์พุตของการเรียก LLM ได้ด้วย

  1. ในตัวแก้ไขโค้ด ให้ตรวจสอบไฟล์พรอมต์
    1. เปิดไฟล์ prompts/2-simple-itinerary.prompt
    2. ตรวจสอบสคีมาอินพุตและเอาต์พุตที่กำหนด
  2. โต้ตอบกับ UI
    1. ใน UI สำหรับนักพัฒนาแอป Genkit ให้ไปที่ส่วน prompts/2-simple-itinerary
    2. ระบุอินพุตโดยการป้อนข้อมูลตัวอย่างในช่อง place และ interests ดังนี้
      {
    "interests": [
        "Museums"
    ],
    "place": "Paris"
}
    3. คลิกเรียกใช้

การใช้ Dotprompt เพื่อระบุสคีมาเอาต์พุต

ทำความเข้าใจเอาต์พุตที่ขับเคลื่อนด้วยสคีมา

โปรดสังเกตว่าเอาต์พุตที่สร้างขึ้นเป็นไปตามสคีมาที่กำหนด การระบุโครงสร้างที่ต้องการเป็นการสั่งให้ LLM สร้างข้อมูลที่แยกวิเคราะห์และผสานรวมเข้ากับแอปพลิเคชันของคุณได้ง่าย Genkit จะตรวจสอบเอาต์พุตกับสคีมาโดยอัตโนมัติเพื่อให้มั่นใจว่าข้อมูลสมบูรณ์

นอกจากนี้ คุณยังกำหนดค่า Genkit ให้ลองอีกครั้งหรือพยายามแก้ไขเอาต์พุตหากไม่ตรงกับสคีมาได้ด้วย

ข้อดีหลักของสคีมาเอาต์พุต

  • การผสานรวมที่ง่ายขึ้น: ผสานรวม Structured Data เข้ากับองค์ประกอบ UI ของแอปได้อย่างง่ายดาย
  • การตรวจสอบข้อมูล: ตรวจสอบความถูกต้องและความสอดคล้องของเอาต์พุตที่สร้างขึ้น
  • การจัดการข้อผิดพลาด: ใช้กลไกเพื่อแก้ไขความไม่ตรงกันของสคีมา

การใช้ประโยชน์จากสคีมาเอาต์พุตจะช่วยยกระดับประสบการณ์การใช้งาน Genkit ทำให้คุณสร้าง Structured Data ที่ปรับแต่งแล้วเพื่อประสบการณ์ของผู้ใช้ที่สมบูรณ์และไดนามิกยิ่งขึ้นได้

ใช้ประโยชน์จากอินพุตหลายรูปแบบ

ลองนึกภาพแอปของคุณแนะนำจุดหมายปลายทางในวันหยุดที่ปรับเปลี่ยนในแบบของคุณโดยอิงตามรูปภาพที่ผู้ใช้เห็นว่าสร้างแรงบันดาลใจ Genkit เมื่อใช้ร่วมกับโมเดล Generative แบบมัลติโมดัลจะช่วยให้คุณทำให้วิสัยทัศน์นี้เป็นจริงได้

  1. ในตัวแก้ไขโค้ด ให้ตรวจสอบไฟล์พรอมต์
    1. เปิดไฟล์ prompts/imgDescription.prompt
    2. โปรดทราบว่ามี {{media url=this}} ซึ่งเป็นองค์ประกอบไวยากรณ์ของ Handlebars ที่ช่วยให้คุณรวมรูปภาพไว้ในพรอมต์ได้
  2. โต้ตอบกับ UI
    1. ใน UI สำหรับนักพัฒนาซอฟต์แวร์ของ Genkit ให้เปิดพรอมต์ prompts/imgDescription
    2. ป้อน URL ของรูปภาพในช่อง imageUrls โดยวาง URL ของรูปภาพ เช่น คุณสามารถใช้ภาพปกจาก Wikipedia ที่แสดงหอไอเฟลได้
      {
    "imageUrls": [
        "https://upload.wikimedia.org/wikipedia/commons/thumb/4/4b/La_Tour_Eiffel_vue_de_la_Tour_Saint-Jacques%2C_Paris_ao%C3%BBt_2014_%282%29.jpg/556px-La_Tour_Eiffel_vue_de_la_Tour_Saint-Jacques%2C_Paris_ao%C3%BBt_2014_%282%29.jpg"
    ]
}
    3. คลิกเรียกใช้

7. ใช้การดึงข้อมูลด้วยการค้นหาความคล้ายคลึงของเวกเตอร์

แม้ว่าการสร้างเนื้อหาครีเอทีฟด้วยโมเดล AI จะน่าประทับใจ แต่การใช้งานจริงมักต้องอิงเอาต์พุตในบริบทที่เฉพาะเจาะจง

ในกรณีของ Codelab นี้ คุณมีฐานข้อมูลของจุดหมายปลายทาง (สถานที่และกิจกรรม) และต้องการตรวจสอบว่าคำแนะนำที่โมเดล Gemini สร้างขึ้นอ้างอิงเฉพาะรายการในฐานข้อมูลนี้

คุณจะใช้ประโยชน์จากการค้นหาความคล้ายคลึงของเวกเตอร์ในการฝังที่สร้างขึ้นเพื่อเชื่อมช่องว่างระหว่างคำค้นหาที่ไม่มีโครงสร้างกับเนื้อหาที่เกี่ยวข้อง

ทำความเข้าใจการฝังและความคล้ายคลึงของเวกเตอร์

  • เวกเตอร์: เวกเตอร์คือการแสดงข้อมูลเป็นตัวเลข ซึ่งมักใช้เพื่อสร้างแบบจำลองข้อมูลที่ซับซ้อน เช่น ข้อความหรือรูปภาพ มิติข้อมูลแต่ละรายการในเวกเตอร์จะสอดคล้องกับฟีเจอร์ที่เฉพาะเจาะจงของข้อมูล
  • โมเดลการฝัง: โมเดล AI เฉพาะทางเหล่านี้จะเปลี่ยนข้อมูลอินพุต เช่น ข้อความ ให้เป็นเวกเตอร์ที่มีมิติสูง สิ่งที่น่าสนใจคืออินพุตที่คล้ายกันจะได้รับการแมปกับเวกเตอร์ที่อยู่ใกล้กันในพื้นที่ที่มีมิติสูงนี้
  • การค้นหาความคล้ายคลึงของเวกเตอร์: เทคนิคนี้ใช้ประโยชน์จากความใกล้เคียงของเวกเตอร์การฝังเพื่อระบุจุดข้อมูลที่เกี่ยวข้อง เมื่อได้รับคำค้นหาอินพุต ฟังก์ชันนี้จะค้นหารายการในฐานข้อมูลที่มีเวกเตอร์การฝังที่คล้ายกัน ซึ่งบ่งบอกถึงความเกี่ยวข้องเชิงความหมาย

ทำความเข้าใจวิธีการทำงานของกระบวนการดึงข้อมูล

  1. การฝังคำค้นหา: ระบบจะส่งอินพุตของผู้ใช้ (เช่น "อาหารค่ำสุดโรแมนติกในปารีส") ผ่านโมเดลการฝังเพื่อสร้างเวกเตอร์คำค้นหา
  2. การฝังฐานข้อมูล: คุณควรประมวลผลฐานข้อมูลของจุดหมายปลายทางล่วงหน้าเพื่อสร้างเวกเตอร์การฝังสำหรับแต่ละรายการ
  3. การคำนวณความคล้ายกัน: ระบบจะเปรียบเทียบเวกเตอร์คำค้นหากับเวกเตอร์การฝังแต่ละรายการในฐานข้อมูลโดยใช้เมตริกความคล้ายกัน (เช่น ความคล้ายกันของโคไซน์)
  4. การดึงข้อมูล: ระบบจะดึงข้อมูลรายการที่คล้ายกันมากที่สุดจากฐานข้อมูลตามความใกล้เคียงกับเวกเตอร์คำค้นหาเป็นคำแนะนำที่เกี่ยวข้อง

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

เปิดใช้การค้นหาความคล้ายกันของเวกเตอร์ใน Firestore

ในขั้นตอนก่อนหน้าของ Codelab นี้ คุณได้ป้อนข้อมูลสถานที่และกิจกรรมตัวอย่างลงในฐานข้อมูล Firestore ข้อมูลสถานที่แต่ละรายการจะมีknownForช่องข้อความที่อธิบายแอตทริบิวต์ที่โดดเด่น พร้อมด้วยembeddingฟิลด์ที่เกี่ยวข้องซึ่งมีตัวแทนเวกเตอร์ของคำอธิบายนี้

หากต้องการใช้ประโยชน์จากความสามารถในการค้นหาความคล้ายคลึงของเวกเตอร์ใน Embedding เหล่านี้ คุณจะต้องสร้างดัชนี Firestore ดัชนีนี้ช่วยให้ดึงข้อมูลสถานที่ได้อย่างมีประสิทธิภาพโดยอิงตามความคล้ายคลึงของเวกเตอร์ Embedding กับคำค้นหาที่ระบุ

  1. สร้างดัชนีโดยตรวจสอบว่าได้แทนที่ YOUR_PROJECT_ID ด้วยรหัสของโปรเจ็กต์แล้ว
    • สำหรับ macOS / Linux
    gcloud firestore indexes composite create \
--project=YOUR_PROJECT_ID \
--collection-group=places \
--query-scope=COLLECTION \
--field-config field-path=embedding,vector-config='{"dimension":"768","flat":"{}"}'
    • สำหรับ Windows (PowerShell)
    gcloud firestore indexes composite create `
--project=YOUR_PROJECT_ID `
--collection-group=places `
--query-scope=COLLECTION `
--field-config="field-path=embedding,vector-config={'dimension':'768','flat':'{}'}"
  2. ใน UI สำหรับนักพัฒนาซอฟต์แวร์ของ Genkit ให้เปิด retrievers/placesRetriever
  3. คลิกเรียกใช้ สังเกตออบเจ็กต์ที่สร้างขึ้นพร้อมข้อความตัวยึดตำแหน่ง ซึ่งระบุตำแหน่งที่คุณจะใช้ตรรกะของเครื่องมือดึงข้อมูล
  4. เปิดไฟล์ src/lib/genkit/placesRetriever.ts ในตัวแก้ไขโค้ด
  5. เลื่อนลงจนสุดแล้วแทนที่ตัวยึดตำแหน่ง placesRetriever ด้วยข้อความต่อไปนี้
    export const placesRetriever = defineFirestoreRetriever(ai, {
  name: 'placesRetriever',
  firestore,
  collection: 'places',
  contentField: 'knownFor',
  vectorField: 'embedding',
  embedder: vertexAI.embedder('text-embedding-005', {outputDimensionality: 768}),
  distanceMeasure: 'COSINE',
});

ทดสอบตัวดึงข้อมูล

  1. ใน UI สำหรับนักพัฒนาแอป Genkit ให้เปิดโปรแกรมดึงข้อมูล retrievers/placesRetriever
  2. ระบุคำค้นหาต่อไปนี้
    {
    "content": [
        {
            "text": "UNESCO"
        }
    ]
}
  3. นอกจากนี้ คุณยังระบุตัวเลือกได้ด้วย เช่น วิธีระบุจำนวนเอกสารที่ Retriever ควรแสดงผลมีดังนี้
    {
    "limit": 4
}
  4. คลิกเรียกใช้

คุณสามารถกรองข้อมูลเพิ่มเติมนอกเหนือจากความคล้ายคลึงได้โดยเพิ่มwhereลงในตัวเลือก

8. การสร้างที่เพิ่มประสิทธิภาพการดึงข้อมูล (RAG) ด้วย Genkit

ในส่วนก่อนหน้า คุณได้สร้างพรอมต์แต่ละรายการที่สามารถจัดการข้อความ, JSON และรูปภาพ สร้างจุดหมายปลายทางในวันหยุดและเนื้อหาที่น่าสนใจอื่นๆ สำหรับผู้ใช้ นอกจากนี้ คุณยังได้ใช้พรอมต์ที่ดึงจุดหมายปลายทางที่เกี่ยวข้องจากฐานข้อมูล Firestore ด้วย ตอนนี้ก็ถึงเวลาที่จะประสานงานคอมโพเนนต์เหล่านี้ให้เป็นโฟลว์การสร้างที่เพิ่มประสิทธิภาพการดึงข้อมูล (RAG) ที่สอดคล้องกัน

ส่วนนี้จะแนะนำแนวคิดสำคัญของ Genkit ที่เรียกว่าโฟลว์ โฟลว์เป็นฟังก์ชันที่สตรีมได้และมีการกำหนดประเภทอย่างเข้มงวด ซึ่งเรียกใช้ได้ทั้งในเครื่องและจากระยะไกล พร้อมความสามารถในการสังเกตอย่างเต็มรูปแบบ คุณสามารถจัดการและเรียกใช้โฟลว์ได้ทั้งจาก CLI ของ Genkit และ UI สำหรับนักพัฒนาซอฟต์แวร์ของ Genkit

  1. ในตัวแก้ไขโค้ด ให้ตรวจสอบพรอมต์แผนการเดินทาง
    1. เปิดไฟล์ prompts/itineraryGen.prompt
    2. โปรดสังเกตว่ามีการขยายพรอมต์เพื่อรับอินพุตเพิ่มเติม โดยเฉพาะข้อมูลกิจกรรมที่ได้จากตัวดึงข้อมูล
  2. ใน UI สำหรับนักพัฒนาซอฟต์แวร์ของ Genkit ให้ดูโฟลว์ Genkit ในsrc/lib/genkit/itineraryFlow.tsไฟล์
    เคล็ดลับ: หากต้องการเพิ่มประสิทธิภาพการแก้ไขข้อบกพร่อง ให้ลองแบ่งโฟลว์ที่ยาวออกเป็นขั้นตอนที่สั้นลงและจัดการได้ง่ายขึ้น
  3. ปรับปรุงโฟลว์โดยผสานรวมขั้นตอน "คำอธิบายรูปภาพ" ดังนี้
    1. ค้นหาTODO: 2ความคิดเห็น (ประมาณบรรทัดที่ 81) ซึ่งจะทำเครื่องหมายจุดที่คุณจะปรับปรุงโฟลว์
    2. แทนที่ตัวยึดตำแหน่ง imgDescription ที่ว่างเปล่าด้วยบล็อก ai.run('imgDescription', ...) ที่สร้างคำอธิบายจาก tripDetails.imageUrls
  4. ทดสอบโฟลว์
    1. ไปที่flows/itineraryFlow
    2. ใช้ข้อมูลต่อไปนี้เพื่อทดสอบการดำเนินการ itineraryFlow ที่สำเร็จด้วยขั้นตอนที่คุณเพิ่งเพิ่ม
      {
    "request": "Sightseeing in Paris",
    "imageUrls": [
        "https://upload.wikimedia.org/wikipedia/commons/thumb/4/4b/La_Tour_Eiffel_vue_de_la_Tour_Saint-Jacques%2C_Paris_ao%C3%BBt_2014_%282%29.jpg/500px-La_Tour_Eiffel_vue_de_la_Tour_Saint-Jacques%2C_Paris_ao%C3%BBt_2014_%282%29.jpg"
    ]
}
    3. คลิกเรียกใช้
    4. สังเกตเอาต์พุตที่สร้างขึ้น ซึ่งควรจะรวมคำอธิบายรูปภาพไว้ในคำแนะนำแผนการเดินทาง
  5. หากพบข้อผิดพลาดหรือลักษณะการทำงานที่ไม่คาดคิด ให้คลิกดูการติดตามเพื่อดูรายละเอียด นอกจากนี้ คุณยังใช้แท็บนี้เพื่อตรวจสอบประวัติการดำเนินการจากที่เก็บร่องรอยได้ด้วย

RAG สำหรับเว็บแอปพลิเคชัน

  1. ตรวจสอบว่าเว็บแอปยังทำงานอยู่โดยไปที่ http://localhost:3000/ ในเบราว์เซอร์
  2. หากเว็บแอปไม่ได้ทำงานแล้ว ให้เรียกใช้คำสั่งต่อไปนี้ในเทอร์มินัล
    npm install
npm run dev
  3. ดูหน้าเว็บแอป Dream Your Vacation (http://localhost:3000/gemini)
  4. ดูซอร์สโค้ด (src/app/gemini/page.tsx) เพื่อดูตัวอย่างการผสานรวม Next.js

1e626124e09e04e9.pngb059decb53c249a1.pnge31f6acf87a98cb2.png19c0c9459d5e1601.png

9. ติดตั้งใช้งานแอปพลิเคชันด้วย Firebase App Hosting

ขั้นตอนสุดท้ายในเส้นทางนี้คือการทำให้เว็บแอปของคุณใช้งานได้ คุณจะใช้ประโยชน์จาก Firebase App Hosting ซึ่งเป็นโซลูชันการโฮสต์ที่รับรู้เฟรมเวิร์กซึ่งออกแบบมาเพื่อลดความซับซ้อนในการทำให้แอป Next.js และ Angular ใช้งานได้กับแบ็กเอนด์แบบ Serverless

  1. คอมมิตการเปลี่ยนแปลงไปยังที่เก็บ Git ในเครื่อง แล้วพุชไปยัง GitHub
  2. ในคอนโซล Firebase ให้ไปที่ App Hosting ภายในโปรเจ็กต์ Firebase
  3. คลิกเริ่มต้นใช้งาน > เชื่อมต่อกับ GitHub
  4. เลือกบัญชี GitHub และที่เก็บ คลิกถัดไป
  5. ในการตั้งค่าการติดตั้งใช้งาน > ไดเรกทอรีราก ให้ใช้ค่าเริ่มต้น หากต้องการใช้การเปิดตัวอัตโนมัติ ให้เปิดใช้ตัวเลือกการเปิดตัวอัตโนมัติ
  6. สำหรับกิ่งก้านสด ให้เลือกกิ่งก้าน main ของที่เก็บ GitHub คลิกถัดไป
  7. ป้อนรหัสสำหรับแบ็กเอนด์ (เช่น compass)
  8. เมื่อระบบถามว่าต้องการสร้างหรือเชื่อมโยงเว็บแอป Firebase หรือไม่ ให้เลือกเลือกเว็บแอป Firebase ที่มีอยู่ แล้วเลือกแอปที่คุณสร้างในขั้นตอนก่อนหน้าในโค้ดแล็บนี้
  9. คลิกเสร็จสิ้นและทำให้ใช้งานได้

การตรวจสอบสถานะการติดตั้งใช้งาน

กระบวนการติดตั้งใช้งานจะใช้เวลาสักครู่ คุณติดตามความคืบหน้าได้ในส่วน App Hosting ของคอนโซล Firebase

ให้สิทธิ์แก่บัญชีบริการ

หากต้องการให้แบ็กเอนด์ Node.js เข้าถึงทรัพยากร Vertex AI ได้ คุณต้องกำหนดบทบาท aiplatform.user ให้กับบัญชีบริการของแอปโดยทำดังนี้

gcloud projects add-iam-policy-binding YOUR_PROJECT_ID \
--member "serviceAccount:firebase-app-hosting-compute@YOUR_PROJECT_ID.iam.gserviceaccount.com" \
--role "roles/aiplatform.user"

เมื่อเสร็จสมบูรณ์แล้ว ผู้ใช้จะเข้าถึงเว็บแอปได้

การนำไปใช้งานอีกครั้งโดยอัตโนมัติ

Firebase App Hosting ช่วยให้การอัปเดตในอนาคตเป็นไปอย่างราบรื่น เมื่อใดก็ตามที่คุณพุชการเปลี่ยนแปลงไปยังกิ่งหลักของที่เก็บ GitHub Firebase App Hosting จะสร้างและติดตั้งใช้งานแอปของคุณอีกครั้งโดยอัตโนมัติ เพื่อให้มั่นใจว่าผู้ใช้จะได้รับประสบการณ์การใช้งานเวอร์ชันล่าสุดอยู่เสมอ

10. บทสรุป

ขอแสดงความยินดีที่ทำ Codelab ที่ครอบคลุมนี้เสร็จสมบูรณ์

คุณใช้ประโยชน์จาก Genkit, Firestore และ Vertex AI ได้สำเร็จเพื่อสร้าง "โฟลว์" ที่ซับซ้อนซึ่งสร้างคำแนะนำเกี่ยวกับวันหยุดที่ปรับเปลี่ยนตามความต้องการของผู้ใช้และแรงบันดาลใจ พร้อมทั้งอิงคำแนะนำตามข้อมูลของแอปพลิเคชัน

ตลอดเส้นทางนี้ คุณได้รับประสบการณ์จริงเกี่ยวกับรูปแบบวิศวกรรมซอฟต์แวร์ที่จำเป็น ซึ่งมีความสำคัญต่อการสร้างแอปพลิเคชัน Generative AI ที่มีประสิทธิภาพ รูปแบบเหล่านี้ ได้แก่

  • การจัดการพรอมต์: จัดระเบียบและดูแลพรอมต์เป็นโค้ดเพื่อการทำงานร่วมกันและการควบคุมเวอร์ชันที่ดีขึ้น
  • เนื้อหาแบบหลายรูปแบบ: การผสานรวมข้อมูลประเภทต่างๆ เช่น รูปภาพและข้อความ เพื่อเพิ่มประสิทธิภาพการโต้ตอบกับ AI
  • สคีมาอินพุต/เอาต์พุต: จัดโครงสร้างข้อมูลเพื่อการผสานรวมที่ราบรื่นและการตรวจสอบในแอปพลิเคชัน
  • Vector Store: ใช้ประโยชน์จากการฝังเวกเตอร์เพื่อการค้นหาความคล้ายคลึงและการดึงข้อมูลที่เกี่ยวข้องอย่างมีประสิทธิภาพ
  • การดึงข้อมูล: การใช้กลไกเพื่อดึงและรวมข้อมูลจากฐานข้อมูลลงในเนื้อหาที่ AI สร้างขึ้น
  • การสร้างผลลัพธ์ที่เสริมด้วยการดึงข้อมูล (RAG): การรวมเทคนิคการดึงข้อมูลเข้ากับ Generative AI เพื่อให้ได้ผลลัพธ์ที่เกี่ยวข้องตามบริบทและถูกต้อง
  • การวัดประสิทธิภาพโฟลว์: สร้างและจัดระเบียบเวิร์กโฟลว์ AI ที่ซับซ้อนเพื่อให้การดำเนินการเป็นไปอย่างราบรื่นและสังเกตได้

การฝึกฝนแนวคิดเหล่านี้ให้ชำนาญและนำไปใช้ภายในระบบนิเวศของ Firebase จะช่วยให้คุณพร้อมออกผจญภัยในโลกของ GenAI ได้ สำรวจความเป็นไปได้อันกว้างใหญ่ สร้างแอปพลิเคชันที่เป็นนวัตกรรมใหม่ และก้าวข้ามขีดจำกัดของสิ่งที่ทำได้ด้วย Generative AI ต่อไป

การสำรวจตัวเลือกการติดตั้งใช้งานอื่นๆ

Genkit มีตัวเลือกการติดตั้งใช้งานที่หลากหลายเพื่อให้เหมาะกับความต้องการเฉพาะของคุณ ซึ่งรวมถึงตัวเลือกต่อไปนี้

เพียงเลือกวิธีที่เหมาะกับคุณที่สุดโดยเรียกใช้คำสั่งต่อไปนี้ภายในโฟลเดอร์โหนด (package.json)

npx genkit start

ขั้นตอนถัดไป