פיתוח עוזר דיגיטלי אישי בתכנות באמצעות AI בעזרת Gemma

יכול להיות שקבלת עזרה בקוד ממודלים של בינה מלאכותית (AI) תהיה שימושית מאוד, אבל מה קורה אם אתם מוגבלים בשימוש במודלים של AI גנרטיבי שמתארחים אצל צד שלישי בגלל הגבלות על קישוריות, על עלות או על אבטחת נתונים? משפחת המודלים של Gemma מבית Google זמינה להורדה ולהפעלה בחומרה שלכם, כך שתוכלו לשמור על כל הנתונים באופן מקומי ואפילו לשפר את המודל כך שיתאים טוב יותר לבסיס הקוד שלכם.

כשמריצים מכונה משלכם של Gemma או של CodeGemma, אפשר לקבל עזרה בכתיבה של קוד AI עם זמן אחזור קצר, זמינות גבוהה, עלות נמוכה יותר ויכולת לשמור את כל נתוני הקוד ברשת שלכם. בפרויקט הזה תלמדו איך להגדיר שירות אינטרנט משלכם לאירוח Gemma ולחבר אותו לתוסף של Microsoft Visual Studio Code, כדי שיהיה נוח יותר להשתמש במודל במהלך התכנות. הפרויקט הזה כולל שני פרויקטי משנה: פרויקט אחד להגדרת שירות האינטרנט ולאריזה של Gemma לשירות אינטרנט, ופרויקט שני לתוסף VS Code שמקשר את שירות האינטרנט ומשתמש בו.

לצפייה בסרטון סקירה כללית של הפרויקט הזה והסבר על הארכתו, כולל תובנות מהאנשים שיצרו אותו, תוכלו לצפות בסרטון אסיסטנט ליצירת אימייל עסקי שמבוסס על AI מבית Google. אפשר גם לעיין בקוד של הפרויקט הזה במאגר הקוד של Gemma Cookbook. אם לא, תוכלו להתחיל להרחיב את הפרויקט לפי ההוראות הבאות.

סקירה כללית

במדריך הזה תלמדו איך להגדיר ולהרחיב שני פרויקטים: שירות אינטרנט ל-Gemma ותוסף ל-VS Code לשימוש בשירות הזה. שירות האינטרנט משתמש ב-Python, ב-Keras, ב-JAX ובספריות FastAPI כדי למלא בקשות למודל Gemma ולטיפול בבקשות. התוסף של VS Code, שנקרא Pipet, מוסיף פקודות ל-Command Palette שמאפשרות לשלוח בקשות לשירות האינטרנט של Gemma על ידי בחירת קוד, טקסט או תגובות בחלון לעריכת קוד, כפי שמוצג באיור 1.

צילום מסך של ממשק המשתמש של התוסף ל-VS Code

איור 1. ממשק המשתמש של פקודת הפרויקט להרחבה Pipet ב-Visual Studio Code

קוד המקור המלא של שני הפרויקטים זמין במאגר הקוד של Gemma Cookbook, ואפשר להרחיב את שני הפרויקטים בהתאם לצרכים ולתהליך העבודה המועדף עליכם.

הגדרת הפרויקט

בהוראות הבאות מוסבר איך להכין את הפרויקט הזה לפיתוח ולבדיקה. שלבי ההגדרה הכלליים כוללים התקנה של תוכנות נדרשות, יצירת עותקים מקוריים (cloning) של הפרויקט ממאגר הקוד, הגדרת כמה משתני סביבה, התקנה של ספריות Python ו-Node.js ובדיקה של אפליקציית האינטרנט.

התקנת התוכנה הנדרשת

בפרויקט הזה נעשה שימוש ב-Python 3, בסביבות וירטואליות (venv), ב-Node.js וב-Node Package Manager ‏ (npm) כדי לנהל את החבילות ולהריץ את שני הפרויקטים.

כדי להתקין את התוכנה הנדרשת:

  • מתקינים את Python 3, את חבילת הסביבה הווירטואלית (venv) ל-Python, ל-Node.js ולמנהל החבילות Node.js (npm):

    sudo apt update
sudo apt install git pip python3-venv nodejs npm

שכפול הפרויקט

מורידים את קוד הפרויקט למחשב הפיתוח. כדי לאחזר את קוד המקור של הפרויקט, צריך את תוכנת בקרת הגרסאות git.

כדי להוריד את קוד הפרויקט:

  1. משכפלים את מאגר ה-Git באמצעות הפקודה הבאה:

    git clone https://github.com/google-gemini/gemma-cookbook.git

  2. אופציונלי: מגדירים את מאגר git המקומי כך שישתמש ב-sparse checkout, כדי שיישארו רק הקבצים של הפרויקט:

    cd gemma-cookbook/
git sparse-checkout set Gemma/personal-code-assistant/
git sparse-checkout init --cone

פרויקט שירות אינטרנט של Gemma

החלק של שירות האינטרנט בפרויקט הזה (gemma-web-service) יוצר מכונה מתארחת עצמאית של Gemma 2 2B, עטופה בשירות אינטרנט בסיסי לטיפול בבקשות ובתשובות ליצירה. התוסף VS Code, שמפורט בהמשך המדריך, מתחבר לשירות הזה כדי לטפל בבקשות לעזרה בקוד.

בהוראות הבאות מוסבר איך להכין את הפרויקט הזה לפיתוח ולבדיקה. שלבי ההגדרה הכלליים כוללים התקנת תוכנה שנדרשת מראש, שכפול הפרויקט ממאגר הקודים, הגדרה של כמה משתני סביבה, התקנת ספריות Python ובדיקת שירות האינטרנט.

דרישות חומרה

מריצים את הפרויקט של שירות האינטרנט של Gemma במחשב עם מעבד גרפי (GPU) או יחידת עיבוד נתונים טילר (TPU), ועם מספיק זיכרון GPU או TPU כדי לאחסן את המודל. כדי להריץ את ההגדרה של Gemma 2 2B בפרויקט של שירות האינטרנט הזה, צריך בערך 16GB של זיכרון GPU, בערך כמות זהה של זיכרון RAM רגיל ומרחב דיסק בנפח 20GB לפחות.

אם פורסים את פרויקט שירות האינטרנט של Gemma במכונה וירטואלית של Google Cloud, צריך להגדיר את המכונה בהתאם לדרישות הבאות:

  • חומרת GPU: כדי להריץ את הפרויקט הזה נדרש NVIDIA T4 (מומלץ NVIDIA L4 ואילך)
  • מערכת הפעלה: בוחרים באפשרות למידת עומק ב-Linux, ובפרט מכונה וירטואלית ללמידת עומק עם CUDA 12.3 M124 עם מנהלי תוכנה מותקנים מראש של GPU.
  • גודל דיסק האתחול: צריך להקצות לפחות 20GB של מקום בכונן לנתונים, למודל ולתוכנה התומכת.

הגדרת הפרויקט

בפרויקט הזה נעשה שימוש ב-Python 3 ובסביבות וירטואליות (venv) לניהול החבילות ולהפעלת שירות האינטרנט. כדי לנהל את החבילות ואת יחסי התלות של Python, מתקינים את ספריות Python עם סביבת Python הווירטואלית venv מופעלת. חשוב להפעיל את הסביבה הווירטואלית של Python לפני התקנת ספריות Python באמצעות הסקריפט setup_python או באמצעות מנהל ההתקנות pip. למידע נוסף על שימוש בסביבות וירטואליות של Python, קראו את המאמר Python venv.

כדי להתקין את ספריות Python:

  1. בחלון מסוף, עוברים לספרייה gemma-web-service:

    cd Gemma/personal-code-assistant/gemma-web-service/

  2. מגדירים ומפעילים סביבה וירטואלית של Python (venv) לפרויקט הזה:

    python3 -m venv venv
source venv/bin/activate

  3. מתקינים את ספריות Python הנדרשות לפרויקט באמצעות הסקריפט setup_python:

    ./setup_python.sh

הגדרה של משתני סביבה

כדי להריץ את הפרויקט הזה, נדרשים כמה משתני סביבה, כולל שם משתמש ב-Kaggle ואסימון API של Kaggle. כדי להוריד אותם, צריך חשבון Kaggle ולבקש גישה למודלים של Gemma. בפרויקט הזה, מוסיפים את שם המשתמש ב-Kaggle ואת אסימון ה-API של Kaggle לקובץ .env, שתוכנית שירות האינטרנט משתמשת בו כדי להוריד את המודל.

כדי להגדיר את משתני הסביבה:

  1. כדי לקבל את שם המשתמש ואת טוקן ה-API ב-Kaggle, פועלים לפי ההוראות שמפורטות במסמכי התיעוד של Kaggle.
  2. כדי לקבל גישה למודל Gemma, פועלים לפי ההוראות במאמר קבלת גישה ל-Gemma שבדף הגדרת Gemma.

  3. כדי ליצור קובץ של משתני סביבה לפרויקט, יוצרים קובץ טקסט .env במיקום הזה בשכפול של הפרויקט:

    personal-code-assistant/gemma-web-service/.env

  4. לאחר יצירת קובץ הטקסט .env, מוסיפים לו את ההגדרות הבאות:

    KAGGLE_USERNAME=<YOUR_KAGGLE_USERNAME_HERE>
KAGGLE_KEY=<YOUR_KAGGLE_KEY_HERE>

הפעלה ובדיקה של שירות האינטרנט

אחרי שתסיימו את ההתקנה וההגדרה של הפרויקט, כדאי להריץ את אפליקציית האינטרנט כדי לוודא שהגדרתם אותה בצורה נכונה. כדאי לעשות זאת כבדיקה בסיסית לפני שעורכים את הפרויקט לשימוש עצמי.

כדי להריץ ולבדוק את הפרויקט:

  1. בחלון מסוף, עוברים לספרייה gemma-web-service:

    cd personal-code-assistant/gemma-web-service/

  2. מריצים את האפליקציה באמצעות הסקריפט run_service:

    ./run_service.sh

  3. אחרי שמפעילים את שירות האינטרנט, בקוד התוכנית מופיעה כתובת URL שבה אפשר לגשת לשירות. בדרך כלל הכתובת הזו היא:

    http://localhost:8000/

  4. כדי לבדוק את השירות, מריצים את הסקריפט test_post:

    ./test/test_post.sh

אחרי שתפעילו את השירות ותבדקו אותו באמצעות הסקריפט הזה, תוכלו להתחבר אליו באמצעות התוסף של VS Code בקטע הבא במדריך.

פרויקט של תוסף ל-VS Code

התוסף VS Code של הפרויקט הזה (pipet-code-agent-2) יוצר תוסף תוכנה של אפליקציית Microsoft Visual Studio Code, שמיועד להוסיף פקודות חדשות לקידוד באמצעות AI. התוסף הזה מתקשר עם שירות האינטרנט של Gemma שמתואר למעלה במדריך הזה. התוסף מתקשר עם שירותי האינטרנט דרך HTTP באמצעות הודעות בפורמט JSON.

הגדרת הפרויקט

בהוראות האלה מוסבר איך מגדירים את הפרויקט של Pipet Code Agent v2 לפיתוח ובדיקה. השלבים הכלליים הם התקנת התוכנה הנדרשת, הפעלת התקנת התצורה, הגדרת הגדרת התוסף ובדיקה של התוסף.

התקנת התוכנה הנדרשת

הפרויקט Pipet Code Agent פועל כתוסף ל-Visual Studio Code של Microsoft, ומשתמש ב-Node.js ובכלי Node Package Manager‏ (npm) כדי לנהל את החבילות ולהפעיל את האפליקציה.

כדי להתקין את התוכנה הנדרשת:

  1. מורידים ומתקינים את Visual Studio Code לפלטפורמה שלכם.
  2. מוודאים ש-Node.js מותקן לפי הוראות ההתקנה של הפלטפורמה.

הגדרה של ספריות הפרויקט

משתמשים בכלי שורת הפקודה npm כדי להוריד את יחסי התלות הנדרשים ולהגדיר את הפרויקט.

כדי להגדיר את קוד הפרויקט:

  1. עוברים לספריית השורש של פרויקט Pipet Code Agent.

    cd Gemma/personal-code-assistant/pipet-code-agent-2/

  2. מריצים את פקודת ההתקנה כדי להוריד את יחסי התלות ולהגדיר את הפרויקט:

    npm install

הגדרת התוסף

עכשיו אמורה להיות אפשרות לבדוק את ההתקנה על ידי הרצה של Pipet Code Agent כתוסף פיתוח ב-VS Code במכשיר. הבדיקה פותחת חלון נפרד של Extension Development Host ב-VS Code, שבו התוסף החדש זמין. בחלון החדש הזה מגדירים את ההגדרות של התוסף לצורך הגישה לשירות האינטרנט האישי של Gemma.

Pipet Code Agent פועל בחלון של מארח הפיתוח של התוסף איור 2. חלון המארח לפיתוח תוספים ב-VS Code עם ההגדרות של התוסף Pipet.

כדי להגדיר ולבדוק את ההגדרה:

  1. מפעילים את האפליקציה VS Code.
  2. ב-VS Code, יוצרים חלון חדש על ידי בחירה באפשרות File (קובץ) > New Window (חלון חדש).
  3. פותחים את הפרויקט Pipet Code Agent על ידי בחירה באפשרות File > Open Folder (קובץ > פתיחת תיקייה) ובחירה בתיקייה personal-code-assistant/pipet-code-agent-2/.
  4. פותחים את הקובץ pipet-code-agent-2/src/extension.ts.
  5. מריצים את התוסף במצב ניפוי באגים על ידי בחירה באפשרות הפעלה > התחלת ניפוי באגים, ואם צריך, בוחרים באפשרות VS Code Extension Development Host. השלב הזה פותח חלון נפרד של מארח פיתוח תוספים.
  6. בחלון החדש של VS Code, פותחים את ההגדרות של VS Code על ידי בחירה באפשרות Code > Settings > Settings.

  7. מגדירים את כתובת המארח של שרת שירות האינטרנט של Gemma בתור הגדרת תצורה. בשדה Search Settings, מקלידים Gemma, בוחרים בכרטיסייה User ובהגדרה Gemma > Service: Host, לוחצים על הקישור Edit in settings.json ומוסיפים את כתובת המארח, למשל 127.0.0.1, localhost או my-server.my-local-domain.com:

    "gemma.service.host": "your-host-address-here"

  8. שומרים את השינויים בקובץ settings.json וסוגרים את כרטיסיות ההגדרות.

בדיקת התוסף

עכשיו אמורה להיות לך אפשרות לבדוק את ההתקנה על ידי הפעלת Pipet Code Agent בתור תוסף פיתוח ב-VS Code במכשיר. הבדיקה פותחת חלון נפרד של Extension Development Host ב-VS Code, שבו התוסף החדש זמין.

כדי לבדוק את פקודות התוסף:

  1. בחלון Extension Development Host ב-VS Code, בוחרים קוד כלשהו בחלון העריכה.
  2. כדי לפתוח את לוח הפקודות, בוחרים באפשרות תצוגה > לוח פקודות.
  3. בלוח הפקודות, מקלידים Pipet ובוחרים באחת מהפקודות עם הקידומת הזו.

שינוי פקודות קיימות

שינוי הפקודות שסופקו ב-Pipet Code Agent היא הדרך הפשוטה ביותר לשנות את ההתנהגות והיכולות של התוסף. המידע הזה על ההקשר של ההנחיה מנחה את המודל הגנרטיבי של Gemma ביצירת התשובה. שינוי ההוראות של ההנחיה בפקודות הקיימות של Pipet מאפשר לשנות את האופן שבו כל אחת מהפקודות פועלת.

כאן מוסבר איך לשנות את הפקודה review.ts על ידי שינוי הטקסט של ההנחיה של הפקודה.

כדי לערוך את הפקודה review.ts:

  1. מפעילים את אפליקציית VS Code.
  2. ב-VS Code, יוצרים חלון חדש על ידי בחירה באפשרות File (קובץ) > New Window (חלון חדש).
  3. פותחים את הפרויקט Pipet Code Agent על ידי בחירה באפשרות File > Open Folder (קובץ > פתיחת תיקייה) ובחירה בתיקייה pipet-code-agent/.
  4. פותחים את הקובץ pipet-code-agent/src/review.ts.

כדי לשנות את ההתנהגות של הפקודה review.ts:

  1. בקובץ review.ts, משנים את השורה השנייה מאחרונה של הקבוע PROMPT_INSTRUCTIONS כך שתכלול את Also note potential performance improvements.

    const PROMPT_INSTRUCTIONS = `
Reviewing code involves finding bugs and increasing code quality. Examples of
bugs are syntax errors or typos, out of memory errors, and boundary value
errors. Increasing code quality entails reducing complexity of code, eliminating
duplicate code, and ensuring other developers are able to understand the code.
Also note potential performance improvements.

Write a review of the following code:
`;

  2. שומרים את השינויים בקובץ review.ts.

כדי לבדוק את הפקודה ששונתה:

  1. בחלון של פרויקט התוסף VS Code Pipet, פותחים את הקובץ src/extension.ts.
  2. כדי ליצור את הקוד המעודכן, בוחרים באפשרות Terminal > Run Build Task… ואז באפשרות npm: compile.
  3. כדי להפעיל מחדש את הכלי לניפוי באגים, בוחרים באפשרות הפעלה > הפעלה מחדש של ניפוי הבאגים.
  4. בחלון Extension Development Host של VS Code, בוחרים קוד כלשהו בחלון העריכה.
  5. כדי לפתוח את לוח הפקודות, בוחרים באפשרות תצוגה > לוח פקודות.
  6. ב-Command Palette, מקלידים Pipet ובוחרים בפקודה Pipet: Review the selected code.

יצירת פקודות חדשות

אפשר להרחיב את Pipet על ידי יצירת פקודות חדשות שמבצעות משימות חדשות לגמרי באמצעות המודל Gemma. כל קובץ פקודה, כמו comment.ts או review.ts, הוא בעיקר עצמאי, וכולל קוד לאיסוף טקסט מהעורך הפעיל, ליצירת הנחיה, לחיבור לשירות האינטרנט של Gemma, לשליחת הנחיה ולטיפול בתגובה.

בהוראות הבאות מוסבר איך ליצור פקודה חדשה באמצעות הקוד של פקודה קיימת, question.ts, בתור תבנית.

כדי ליצור פקודה שממליצות על שמות לפונקציות:

  1. יוצרים עותק של הקובץ pipet-code-agent-2/src/question.ts בשם new-service.ts בספרייה src/.
  2. פותחים את הקובץ src/new-service.ts ב-VS Code.

  3. משנים את ההוראות של ההנחיה בקובץ החדש על ידי עריכת הערך PROMPT_INSTRUCTIONS.

    // Provide instructions for the AI model
const PROMPT_INSTRUCTIONS = `
Build a Python web API service using FastAPI and uvicorn.
- Just output the code, DO NOT include any explanations.
- Do not include an 'if __name__ == "__main__":' statement.
- Do not include a '@app.get("/")' statement
- Do not include a '@app.get("/info")' statement
`;

  4. מוסיפים את התבנית הקבועה של השירות על ידי יצירת קבוע BOILERPLATE_CODE חדש.

    const BOILERPLATE_CODE = `
# the following code for testing and diagnosis:
@app.get("/")
async def root():
    return "Server: OK"

@app.get("/info")
async def info():
    return "Service using FastAPI version: " + fastapi.__version__

# Run the service
if __name__ == "__main__":
    # host setting makes service available to other devices
    uvicorn.run(app, host="0.0.0.0", port=8000)
`;

  5. משנים את השם של פונקציית הפקודה ל-newService() ומעדכנים את הודעת המידע שלה.

    export async function newService() {
  vscode.window.showInformationMessage('Building new service from template...');
...

  6. מעדכנים את הקוד של הרכבת ההנחיות כך שיכלול את הטקסט שנבחר בכלי העריכה ואת PROMPT_INSTRUCTIONS.

    // Build the full prompt using the template.
  const promptText = `${selectedCode}${PROMPT_INSTRUCTIONS}`;

  7. משנים את קוד ההוספה של התשובה כך שיכלול את התשובה ואת קוד ה-boilerplate.

    // Insert answer after selection.
editor.edit((editBuilder) => {
    editBuilder.insert(selection.end, "\n\n" + responseText);
    editBuilder.insert(selection.end, "\n" + BOILERPLATE_CODE);
});

  8. שומרים את השינויים בקובץ new-service.ts.

שילוב הפקודה החדשה

אחרי שמסיימים לכתוב את הקוד של הפקודה החדשה, צריך לשלב אותו עם שאר התוסף. מעדכנים את הקבצים extension.ts ו-package.json כדי להפוך את הפקודה החדשה לחלק של התוסף, ולאפשר ל-VS Code להפעיל את הפקודה החדשה.

כדי לשלב את הפקודה new-service עם קוד התוסף:

  1. פותחים את הקובץ pipet-code-agent-2/src/extension.ts ב-VS Code.

  2. מוסיפים את קובץ הקוד החדש לתוסף באמצעות הצהרת ייבוא חדשה.

    import { newService } from './new-service';

  3. כדי לרשום את הפקודה החדשה, מוסיפים את הקוד הבא לפונקציה activate().

    export function activate(context: vscode.ExtensionContext) {
    ...
    vscode.commands.registerCommand('pipet-code-agent.newService', newService);
}

  4. שומרים את השינויים בקובץ extension.ts.

כדי לשלב את הפקודה name עם חבילת התוסף:

  1. פותחים את הקובץ pipet-code-agent/package.json ב-VS Code.

  2. מוסיפים את הפקודה החדשה לקטע commands בקובץ החבילה.

    "contributes": {
  "commands": [
    ...
    {
      "command": "pipet-code-agent.newService",
      "title": "Pipet: Generate a FastAPI service."
    }
  ],

  3. שומרים את השינויים בקובץ package.json.

בדיקת הפקודה החדשה

אחרי שתסיימו לתכנת את הפקודה ותשלבו אותה עם התוסף, תוכלו לבדוק אותה. הפקודה החדשה זמינה רק בחלון Extension Development Host ב-VS Code, ולא בחלון של VS Code שבו ערכתם את הקוד של התוסף.

כדי לבדוק את הפקודה ששונתה:

  1. בחלון של פרויקט התוסף VS Code Pipet, פותחים את הקובץ src/extension.ts.
  2. כדי ליצור את הקוד המעודכן, בוחרים באפשרות Terminal > Run Build Task… ואז באפשרות npm: compile.
  3. בחלון הפרויקט של תוסף Pipet ב-VS Code, מפעילים מחדש את מנתח הבאגים על ידי בחירה באפשרות הפעלה > הפעלה מחדש של ניפוי הבאגים. הפעולה הזו תפעיל מחדש את החלון הנפרד Extension Development Host.
  4. בחלון Extension Development Host של VS Code, בוחרים קוד כלשהו בחלון העריכה.
  5. כדי לפתוח את לוח הפקודות, בוחרים באפשרות תצוגה > לוח פקודות.
  6. ב-Command Palette, מקלידים Pipet ובוחרים בפקודה Pipet: Generate a QuickAPI service.

עכשיו יש לכם פקודה של תוסף VS Code שפועלת עם מודל AI של Gemma. כדי ליצור תהליך עבודה של פיתוח קוד בעזרת AI שמתאים לכם, כדאי לנסות פקודות שונות והוראות שונות.

איך מארזים ומתקינים את התוסף

אפשר לארוז את התוסף כקובץ .vsix להתקנה מקומית במכונה של VS Code. משתמשים בכלי שורת הפקודה vsce כדי ליצור קובץ חבילת .vsix מפרויקט התוסף, שאותו אפשר להתקין במכונה של VS Code. לפרטים על אריזה של התוסף, קראו את המאמר פרסום תוספים ב-VS Code. אחרי שמסיימים לארוז את התוסף כקובץ VSIX, אפשר להתקין אותו באופן ידני ב-VS Code.

כדי להתקין את התוסף באריזת VSIX:

  1. במכונה של VS Code, פותחים את החלונית Extensions (תוספים) על ידי בחירה באפשרות File > Extensions (קובץ > תוספים).
  2. בחלונית Extensions, לוחצים על תפריט שלוש הנקודות בפינה השמאלית העליונה ואז על Install from VSIX.
  3. פותחים את קובץ החבילה .vsix שיצרתם מפרויקט התוסף כדי להתקין אותו.

מקורות מידע נוספים

פרטים נוספים על הקוד של הפרויקט הזה זמינים במאגר הקוד של Gemma Cookbook. אם אתם צריכים עזרה בפיתוח האפליקציה או רוצים לשתף פעולה עם מפתחים אחרים, תוכלו להיכנס לשרת Google Developers Community Discord. פלייליסט הסרטונים שלנו מכיל פרויקטים נוספים של Build with Google AI.