msb-public
/
Web-Dev-For-Beginners
mirror of https://github.com/microsoft/Web-Dev-For-Beginners.git
1
0
Code Issues Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'cf2cc32760'
${ noResults }
Web-Dev-For-Beginners/translations/he/8-code-editor/1-using-a-code-editor/README.md

8.9 KiB
Raw Blame History Escape

שימוש בעורך קוד: שליטה ב-VSCode.dev

ברוכים הבאים!
השיעור הזה ייקח אתכם מהבסיס ועד לשימוש מתקדם ב-VSCode.dev—עורך קוד עוצמתי מבוסס דפדפן. תלמדו לערוך קוד בביטחון, לנהל פרויקטים, לעקוב אחר שינויים, להתקין הרחבות ולשתף פעולה כמו מקצוענים—הכול מתוך הדפדפן, ללא צורך בהתקנה.

מטרות למידה

בסיום השיעור, תוכלו:

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

דרישות מוקדמות

כדי להתחיל, הירשמו לחשבון חינמי ב-GitHub, שמאפשר לכם לנהל מאגרי קוד ולשתף פעולה ברחבי העולם. אם עדיין אין לכם חשבון, צרו אחד כאן.

למה להשתמש בעורך קוד מבוסס דפדפן?

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

  • לערוך פרויקטים מכל מכשיר
  • להימנע מהטרחה של התקנות
  • לשתף פעולה ולתרום באופן מיידי

ברגע שתהיו נוחים עם VSCode.dev, תהיו מוכנים להתמודד עם משימות קוד מכל מקום ובכל זמן.

התחלת עבודה עם VSCode.dev

גשו ל-VSCode.dev—ללא התקנה, ללא הורדות. כניסה עם GitHub פותחת גישה מלאה, כולל סנכרון ההגדרות, ההרחבות והמאגרי הקוד שלכם. אם תתבקשו, חברו את חשבון GitHub שלכם.

לאחר הטעינה, סביבת העבודה שלכם תיראה כך:

![Default VSCode.dev](../images/default-vscode-dev יש שלושה אזורים מרכזיים משמאל לימין:

  • סרגל הפעילות: האייקונים כמו 🔎 (חיפוש), ⚙️ (הגדרות), קבצים, בקרת מקור וכו'.
  • סרגל צדדי: משתנה בהתאם לאייקון שנבחר בסרגל הפעילות (ברירת המחדל היא Explorer להצגת קבצים).
  • אזור העריכה/קוד: האזור הגדול ביותר מימין—שם תערכו ותצפו בקוד.

לחצו על האייקונים כדי לחקור תכונות, אך חזרו ל-Explorer כדי לשמור על המקום שלכם.

פתיחת מאגר GitHub

שיטה 1: מתוך העורך

  1. גשו ל-VSCode.dev. לחצו על "Open Remote Repository."

    ![Open remote repository](../../../../8-code-editor/images/open-remote-repository השתמשו ב-Command Palette (Ctrl-Shift-P, או Cmd-Shift-P במק).

    ![Palette Menu](../images/palette-menu.pngopen remote repository.”

    • בחרו באפשרות.
    • הדביקו את כתובת ה-URL של מאגר GitHub שלכם (לדוגמה, https://github.com/microsoft/Web-Dev-For-Beginners) ולחצו Enter.

אם הצלחתם, תראו את כל הפרויקט טעון ומוכן לעריכה!

שיטה 2: גישה מיידית דרך URL

הפכו כל כתובת URL של מאגר GitHub לפתיחה ישירה ב-VSCode.dev על ידי החלפת github.com ב-vscode.dev/github.
לדוגמה:

  • GitHub: https://github.com/microsoft/Web-Dev-For-Beginners
  • VSCode.dev: https://vscode.dev/github/microsoft/Web-Dev-For-Beginners

תכונה זו מאפשרת גישה מהירה לכל פרויקט.

עריכת קבצים בפרויקט שלכם

לאחר שהמאגר שלכם פתוח, תוכלו:

1. ליצור קובץ חדש

  • בסרגל הצד Explorer, נווטו לתיקייה הרצויה או השתמשו בשורש.
  • לחצו על אייקון ‘New file ...’.
  • תנו שם לקובץ, לחצו Enter, והקובץ יופיע מיד.

![Create a new file](../images/create-new-file 2. עריכה ושמירת קבצים

  • לחצו על קובץ ב-Explorer כדי לפתוח אותו באזור הקוד.
  • בצעו את השינויים הדרושים.
  • VSCode.dev שומר את השינויים שלכם באופן אוטומטי, אך תוכלו ללחוץ Ctrl+S לשמירה ידנית.

![Edit a file](../images/edit-a-file.png. מעקב והתחייבות לשינויים עם בקרת גרסאות

ל-VSCode.dev יש בקרת גרסאות Git מובנית!

  • לחצו על אייקון 'Source Control' כדי לצפות בכל השינויים שבוצעו.
  • קבצים בתיקיית Changes מציגים תוספות (ירוק) ומחיקות (אדום).
    ![View changes](../images/working-tree.png שינויים על ידי לחיצה על + ליד קבצים כדי להכין להתחייבות.
  • בטלו שינויים לא רצויים על ידי לחיצה על אייקון הביטול.
  • כתבו הודעת התחייבות ברורה, ואז לחצו על סימן הביקורת להתחייב ולדחוף.

כדי לחזור למאגר שלכם ב-GitHub, בחרו בתפריט ההמבורגר בפינה השמאלית העליונה.

![Stage & commit changes](../images/edit-vscode.dev Up with Extensions

הרחבות מאפשרות לכם להוסיף שפות, ערכות נושא, כלים לניפוי שגיאות וכלי פרודוקטיביות ל-VSCode.dev—מה שהופך את חיי הקידוד שלכם לקלים ומהנים יותר.

חיפוש וניהול הרחבות

  • לחצו על אייקון ההרחבות בסרגל הפעילות.

  • חפשו הרחבה בתיבת 'Search Extensions in Marketplace'.

    ![Extension details](../images/extension-details:

    • Installed: כל ההרחבות שהוספתם
    • Popular: המועדפות בתעשייה
    • Recommended: מותאמות לתהליך העבודה שלכם

    ![View extensions](

1. התקנת הרחבות

  • הכניסו את שם ההרחבה בחיפוש, לחצו עליה, ועיינו בפרטים בעורך.

  • לחצו על כפתור ההתקנה הכחול בסרגל הצד או באזור הקוד הראשי.

    ![Install extensions](../images/install-extension 2. התאמת הרחבות

  • מצאו את ההרחבה שהתקנתם.

  • לחצו על אייקון ההגדרות → בחרו Extension Settings כדי לכוונן את ההתנהגות לפי רצונכם.

    ![Modify extension settings](../images/extension-settings 3. ניהול הרחבות תוכלו:

  • להשבית: לכבות זמנית הרחבה תוך שמירה על התקנתה

  • להסיר: להסיר אותה לצמיתות אם אינה נחוצה יותר

    מצאו את ההרחבה, לחצו על אייקון ההגדרות, ובחרו ‘Disable’ או ‘Uninstall,’ או השתמשו בכפתורים הכחולים באזור הקוד.

משימה

בדקו את הכישורים שלכם: צרו אתר קורות חיים באמצעות vscode.dev

חקר נוסף ולימוד עצמי

עכשיו אתם מוכנים לקודד, ליצור ולשתף פעולה—מכל מקום, בכל מכשיר, באמצעות VSCode.dev!

כתב ויתור:
מסמך זה תורגם באמצעות שירות תרגום מבוסס בינה מלאכותית Co-op Translator. למרות שאנו שואפים לדיוק, יש לקחת בחשבון שתרגומים אוטומטיים עשויים להכיל שגיאות או אי דיוקים. המסמך המקורי בשפתו המקורית צריך להיחשב כמקור הסמכותי. עבור מידע קריטי, מומלץ להשתמש בתרגום מקצועי על ידי אדם. אנו לא נושאים באחריות לאי הבנות או לפרשנויות שגויות הנובעות משימוש בתרגום זה.