8.9 KiB
שימוש בעורך קוד: שליטה ב-VSCode.dev
ברוכים הבאים!
השיעור הזה ייקח אתכם מהבסיס ועד לשימוש מתקדם ב-VSCode.dev—עורך קוד עוצמתי מבוסס דפדפן. תלמדו לערוך קוד בביטחון, לנהל פרויקטים, לעקוב אחר שינויים, להתקין הרחבות ולשתף פעולה כמו מקצוענים—הכול מתוך הדפדפן, ללא צורך בהתקנה.
מטרות למידה
בסיום השיעור, תוכלו:
- להשתמש בעורך קוד בצורה יעילה בכל פרויקט, מכל מקום
- לעקוב אחר העבודה שלכם באמצעות בקרת גרסאות מובנית
- להתאים אישית ולשפר את תהליך הפיתוח שלכם עם התאמות והרחבות לעורך
דרישות מוקדמות
כדי להתחיל, הירשמו לחשבון חינמי ב-GitHub, שמאפשר לכם לנהל מאגרי קוד ולשתף פעולה ברחבי העולם. אם עדיין אין לכם חשבון, צרו אחד כאן.
למה להשתמש בעורך קוד מבוסס דפדפן?
עורך קוד כמו VSCode.dev הוא מרכז הפיקוד שלכם לכתיבה, עריכה וניהול קוד. עם ממשק אינטואיטיבי, מגוון רחב של תכונות וגישה מיידית דרך הדפדפן, תוכלו:
- לערוך פרויקטים מכל מכשיר
- להימנע מהטרחה של התקנות
- לשתף פעולה ולתרום באופן מיידי
ברגע שתהיו נוחים עם VSCode.dev, תהיו מוכנים להתמודד עם משימות קוד מכל מקום ובכל זמן.
התחלת עבודה עם VSCode.dev
גשו ל-VSCode.dev—ללא התקנה, ללא הורדות. כניסה עם GitHub פותחת גישה מלאה, כולל סנכרון ההגדרות, ההרחבות והמאגרי הקוד שלכם. אם תתבקשו, חברו את חשבון GitHub שלכם.
לאחר הטעינה, סביבת העבודה שלכם תיראה כך:
, ⚙️ (הגדרות), קבצים, בקרת מקור וכו'.
- סרגל צדדי: משתנה בהתאם לאייקון שנבחר בסרגל הפעילות (ברירת המחדל היא Explorer להצגת קבצים).
- אזור העריכה/קוד: האזור הגדול ביותר מימין—שם תערכו ותצפו בקוד.
לחצו על האייקונים כדי לחקור תכונות, אך חזרו ל-Explorer כדי לשמור על המקום שלכם.
פתיחת מאגר GitHub
שיטה 1: מתוך העורך
-
גשו ל-VSCode.dev. לחצו על "Open Remote Repository."
.
 ולחצו 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, והקובץ יופיע מיד.
 ומחיקות (אדום).
![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 Web.
- חקרו תכונות מתקדמות של סביבת העבודה, קיצורי מקלדת והגדרות.
עכשיו אתם מוכנים לקודד, ליצור ולשתף פעולה—מכל מקום, בכל מכשיר, באמצעות VSCode.dev!
כתב ויתור:
מסמך זה תורגם באמצעות שירות תרגום מבוסס בינה מלאכותית Co-op Translator. למרות שאנו שואפים לדיוק, יש לקחת בחשבון שתרגומים אוטומטיים עשויים להכיל שגיאות או אי דיוקים. המסמך המקורי בשפתו המקורית צריך להיחשב כמקור הסמכותי. עבור מידע קריטי, מומלץ להשתמש בתרגום מקצועי על ידי אדם. אנו לא נושאים באחריות לאי הבנות או לפרשנויות שגויות הנובעות משימוש בתרגום זה.