נעבור מהניסויים לפרויקט השנתי: נבחר אתר עובד, נשמור את גרסאותיו במאגר פרטי בשם שלנו ונאשר שלמורה יש גישה. מכאן נמשיך לפתח את אותו אתר לאורך השנה.
הפרק הקודם: 05 — אתר שנראה טוב עם Bootstrap · הפרק הבא: 07 — מקום לשיעור נוסף
במסך מגע אפשר להחליק ימינה לפרק הבא ושמאלה לפרק הקודם.
רושמים את הפרויקט השנתי ומשתפים את המורה
מהשיעור הזה ממשיכים בפרויקט שנתי אחד ובמאגר GitHub פרטי אחד. שם המאגר יהיה בתבנית FirstNameLastNameRazor: השם הפרטי ושם המשפחה שלכם באנגלית, ללא רווחים, ואחריהם Razor. למשל: NoaCohenRazor. כך המורה יוכל לזהות את הפרויקט שלכם כשהוא מוריד אותו למחשב שלו באמצעות Clone.
שתפו את המורה כ־Collaborator כדי שיוכל להוריד את הקוד, להריץ את האתר, לבדוק את עבודתכם ולעזור כשמשהו מתקלקל. כדי שהמורה יראה את העבודה האחרונה, צריך לבצע Push; Commit שנשאר במחשב שלכם אינו מגיע אליו.
המורה יעריך את המאמץ וההשקעה המתמשכים לאורך השנה, באמצעות תאריכי העבודה, תוכן השינויים והודעות Commit ברורות, יחד עם ההסברים שלכם וביצוע שינוי עצמאי. כתבו בכל הודעה מה שיניתם; כך תוכלו גם אתם וגם המורה לעקוב אחר ההתקדמות ולאתר מתי הופיעה תקלה. העלאת פרויקט שלם ברגע האחרון, גם אם נוצר בעזרת סוכן AI, אינה מדגימה תהליך עבודה שנתי או הבנה של הקוד.
בוחרים את האתר שנמשיך לפתח
פתחו את האתר שעיצבתם והריצו אותו. בחרו את הפרויקט שאת התוכן והעיצוב שלו תרצו להמשיך לפתח.
אם ניסוי קודם כבר אינו פועל ואתם רוצים להתחיל מחדש, צרו פרויקט Razor Pages בתיקייה חדשה בעזרת מסלול VS Code או מסלול Visual Studio, או בעזרת מסלול Rider. העבירו אליו בהדרגה את הטקסטים, התמונות והעיצוב שתרצו לשמור ובדקו כל שינוי. אפשר להשאיר את תיקיות הניסוי הקודמות במחשב.
מתחילים לשמור גרסאות כשיש אתר שנפתח, עם התוכן והעיצוב שבחרתם. ממשיכים מכאן באותו פרויקט; אין צורך לשחזר את כל הניסויים בהיסטוריה.
אם אתם יוצרים עכשיו פרויקט חדש, תנו גם לפרויקט ולפתרון את השם FirstNameLastNameRazor עם הפרטים שלכם, לפי מסלול ההקמה. במדריכי הניסוי השם חופשי; ביצירה בשלב הזה השתמשו בשם האישי המחייב. אם הפרויקט הקיים כבר עובד בשם אחר, אין צורך לשנות ידנית שמות קבצים או מחלקות; שם מאגר GitHub יהיה בתבנית האישית שנקבעה.
אם הפרויקט כבר מנוהל ב־Git, השתמשו במאגר הקיים. אם הוא כבר מחובר ל־GitHub, דלגו על יצירת מאגר חדש ובצעו את בדיקת ההעלאה שבהמשך.
לאחר רישום הפרויקט ממשיכים באותו מאגר ושומרים את ההיסטוריה. אפשר להתנסות בצד בפרויקט נפרד, אך העבודה השנתית נשארת במאגר הרשום. אם רוצים להחליף את הפרויקט השנתי או אם הוא מתקלקל, פונים למורה לפני מעבר למאגר אחר; אין למחוק את ההיסטוריה או להחליף אותה בהעלאה חדשה של כל האתר.
חלק ראשון: שומרים גרסאות במחשב עם Git
Git שומר היסטוריה בתוך תיקיית הפרויקט במחשב. GitHub הוא שירות ברשת שאליו נעלה את ההיסטוריה בחלק השני. אפשר לבצע Commit ולהשוות גרסאות גם בלי חיבור לאינטרנט.
| פעולה | מה נשמר או מוצג? |
|---|---|
| Save | תוכן הקובץ הנוכחי נשמר בדיסק |
| Diff | ההבדל בין הגרסה שב־Git לבין השינוי שעשיתם |
| Stage | בחירת השינויים שייכללו בגרסה הבאה |
| Commit | גרסה עם הודעה נשמרת בהיסטוריה המקומית |
בוחרים את תיקיית המאגר
ב־Visual Studio בחרו בתיקיית הפתרון החיצונית, שמכילה את קובץ ה־.sln או .slnx ואת תיקיית הפרויקט. ב־VS Code בחרו בתיקייה שמכילה את כל קובצי האתר; אם יש פתרון ותיקיית פרויקט פנימית, בחרו בתיקיית הפתרון החיצונית.
זו תיקיית האתר האחד שלכם. אל תבחרו את source/repos שמכילה גם פרויקטים אחרים, ואל תיצרו מאגר נוסף בתוך Pages.
אם Git אינו מותקן או שהפקודה git אינה מזוהה בטרמינל, פנו למורה לעזרה בהתקנתו לפני שממשיכים.
הגדרה ראשונה: שם ודוא״ל ב־Git
לפני הקומיט הראשון, הגדירו מי אתם ב־Git. התחברות ל־GitHub אינה מחליפה את ההגדרה הזאת.
ב־VS Code בחרו Terminal → New Terminal; ב־Visual Studio בחרו View → Terminal. בחלון שנפתח בתחתית המסך הריצו את שתי הפקודות הבאות, כל אחת בנפרד ואחריה Enter. החליפו את השם ואת כתובת הדוא״ל בדוגמאות בפרטים שלכם, והשאירו את המירכאות:
git config --global user.name "Your Name"
git config --global user.email "yourname@gmail.com"
בשורה הראשונה כתבו את שמכם. בשנייה כתבו את כתובת ה־Gmail האישית שתשתמשו בה ב־GitHub בחלק השני. בדרך כלל הפקודות מסתיימות בלי להציג הודעה — זה תקין.
ההגדרה נשמרת לכל הפרויקטים תחת משתמש מערכת ההפעלה הנוכחי במחשב הזה. במחשב אישי מבצעים אותה פעם אחת; אם כמה תלמידים עובדים תחת אותו משתמש מחשב, כל תלמיד צריך להגדיר את פרטיו לפני העבודה.
אם Git מציג Please tell me who you are או מבקש להגדיר user.name ו־user.email, הריצו את שתי הפקודות וחזרו לפעולת הקומיט. אם הפקודה git אינה מזוהה, פנו למורה לעזרה בהתקנת Git.
מכינים את הקבצים לשמירת גרסאות
בתיקייה שבחרתם כשורש המאגר פתחו את .gitignore בעורך. אם אינו קיים, צרו אותו באמצעות New File בשם המדויק .gitignore. הוסיפו את השורות הבאות ושמרו, כדי שקובצי בנייה, מסדי נתונים מקומיים וקובצי סביבה יישארו במחשב:
**/bin/
**/obj/
.vs/
artifacts/
*.db
*.db-*
*.sqlite
*.sqlite3
.env
.env.*
**/appsettings.Local.json
**/secrets.json
node_modules/
.DS_Store
אל תשמרו סיסמאות או מפתחות בקוד. .gitignore עוזר להשאיר קבצים מקומיים מחוץ לקומיטים חדשים, אך אינו מוציא מההיסטוריה קובץ שכבר נשמר ב־Commit. אם קובץ פרטי כבר מופיע בהיסטוריה, עצרו לפני Push והראו למורה.
יוצרים מאגר מקומי — בוחרים את העורך שלכם
VS Code
פתחו את תיקיית המאגר דרך File → Open Folder. ב־Source Control לחצו Initialize Repository. לחצו + לצד Changes, כתבו הודעה כמו Save my styled website ולחצו Commit.
Visual Studio
פתחו את הפתרון ובחרו Git → Create Git Repository. תחת Other בחרו Local only או Local, בדקו את הנתיב ואשרו את יצירת המאגר המקומי.
פתחו View → Git Changes. אם נותרו קבצים ב־Changes, הוסיפו אותם עם +, כתבו הודעה כמו Save my styled website ובחרו Commit Staged. אם האשף כבר יצר Commit, בדקו שהוא כולל את האתר.
לפני הקומיט בדקו שקובצי האתר ו־.gitignore כלולים, ושקובצי בנייה מתוך bin ו־obj אינם ברשימה. ב־Visual Studio שמרו גם את קובץ הפתרון.
עזרה: מאגר מקומי ב־Visual Studio · Stage ו־Commit ב־VS Code
רואים מה השתנה ושומרים גרסה נוספת
- שנו משפט בדף הבית, שמרו והריצו.
- פתחו Source Control ב־VS Code או Git Changes ב־Visual Studio ולחצו על הקובץ כדי לראות את ה־Diff.
- הסבירו איזו שורה השתנתה. בצעו Stage ו־Commit עם הודעה שמתארת את השינוי.
- ב־VS Code פתחו את Source Control Graph; ב־Visual Studio פתחו Git → View Branch History. מצאו את הגרסאות ששמרתם.
- לסיום התרגול, החזירו בעורך את המשפט לנוסח שהיה לפני הניסוי. שמרו, בצעו Stage ו־Commit עם הודעה כמו
Restore text after Git practice. בהיסטוריה נשארות גם גרסת הניסוי וגם גרסת החזרה, ובאתר שוב מופיע התוכן שבחרתם בתחילת השיעור.
ניסוי קטן: חוזרים לגרסה ששמרנו
מבצעים את הניסוי רק אחרי שהעבודה הרצויה שמורה ב־Commit ואין שינויים ממתינים. ביטול השינוי הבא יסיר את העריכה הניסיונית מהקובץ; אל תבחרו ביטול של כל הקבצים.
- החליפו מילה אחת בכותרת ב־
Pages/Index.cshtml, שמרו וראו אותה בדפדפן. הפעם אל תבצעו Stage או Commit. - פתחו את ה־Diff של הקובץ ובדקו שהוא מכיל רק את שינוי הניסוי.
- ב־VS Code לחצו עליו בכפתור הימני ובחרו Discard Changes. ב־Visual Studio בחרו Undo Changes על אותו קובץ ב־Git Changes. אשרו את ביטול השינוי בקובץ הזה בלבד.
- הריצו שוב ובדקו שהכותרת חזרה לגרסה האחרונה ששמרתם ב־Commit.
עזרה: ביטול עריכה ב־VS Code · ביטול שינויים ב־Visual Studio
יש לכם גרסאות במחשב, ואתם יודעים לבדוק שינוי ולחזור מהניסוי לגרסה האחרונה. עכשיו נעלה אותן ל־GitHub.
חלק שני: מעלים את הגרסאות ל־GitHub
Commit שומר במחשב; Push מעלה ל־GitHub. הפרסום הראשון יוצר מאגר ברשת ומחבר אליו את המאגר המקומי. לאחר מכן מעלים גרסאות נוספות באמצעות Push.
יוצרים חשבון ומתחברים
פתחו GitHub והירשמו עם כתובת ה־Gmail האישית שלכם. השלימו את אימות הדוא״ל. אם כבר יש לכם חשבון, השתמשו בו. אין צורך ליצור מאגר באתר לפני הפרסום מהעורך.
ב־Visual Studio אפשר להתחבר דרך File → Account Settings ולהוסיף את חשבון GitHub שלכם. ב־VS Code תתבקשו להתחבר במהלך הפרסום. בדקו שאתם משתמשים בחשבון האישי הנכון.
מפרסמים מאגר פרטי — בוחרים את העורך שלכם
בשדה שם המאגר הקלידו את השם האישי בתבנית FirstNameLastNameRazor, למשל NoaCohenRazor. אם כבר יש לכם מאגר מחובר בשם אחר, פנו למורה כדי להתאים את שמו ואת החיבור המקומי בלי לאבד היסטוריה; אין ליצור מאגר חלופי.
VS Code
פתחו View → Command Palette → Publish to GitHub. התחברו אם תתבקשו, הקלידו את שם המאגר האישי ובחרו Publish to GitHub private repository. המתינו לסיום ההעלאה.
Visual Studio
בחלון Git Changes לחצו Push (החץ כלפי מעלה). כשאין מאגר מרוחק, המשיכו לפרסום ב־GitHub. בדקו את החשבון ואת שם המאגר, בחרו Private ואשרו Create and Push.
אם המאגר כבר מחובר, Push מעלה אליו את הגרסאות; אין ליצור מאגר נוסף.
אם מופיע Repository already exists או שההעלאה נכשלת, הציגו למורה את ההודעה. אל תנסו שוב ליצור מאגר באותו שם ואל תמחקו את העבודה.
עזרה: פרסום מ־VS Code · העלאה מ־Visual Studio
בודקים שהגרסאות הגיעו ומשתפים את המורה
- פתחו את המאגר ב־GitHub ובדקו שמופיעה התווית Private.
- פתחו את
Pages/Index.cshtmlבתוך הפרויקט ובדקו שהתוכן האחרון נמצא שם. פתחו את רשימת ה־Commits וראו את הודעות הגרסאות ששמרתם. - בתוך המאגר בחרו Settings → Collaborators → Add people. אם GitHub מבקש אימות נוסף, השלימו אותו.
- חפשו
3strategy@gmail.com, בחרו את החשבון3strategyואשרו את שליחת ההזמנה. Collaborator הוא שותף שמקבל גישה למאגר הפרטי; שליחת כתובת המאגר לבדה אינה מעניקה גישה. - שלחו את כתובת המאגר במקום שהמורה ביקש וציינו את שמכם המלא. הגישה למורה תופעל לאחר שיקבל את ההזמנה.
- בדקו עם המורה שההזמנה התקבלה ושהוא יכול לפתוח את המאגר ולבצע Clone. אם ההזמנה עדיין ממתינה, עדכנו אותו; רישום הפרויקט יושלם לאחר אישור הגישה.
העלאת הקוד אינה מפעילה את האתר באינטרנט. ממשיכים להריץ אותו במחשב מתוך העורך.
מעלים שינוי נוסף
שנו פסקה, שמרו ובדקו בדפדפן. בדקו Diff, בצעו Stage ו־Commit. לאחר מכן בחרו Source Control → … → Push ב־VS Code או Git → Push ב־Visual Studio. רעננו את המאגר ב־GitHub וודאו שגם השינוי החדש הגיע.
בסיום בדיקת ההעלאה, החזירו בעורך את הפסקה לנוסח שבחרתם לפני הניסוי. שמרו, בצעו Stage ו־Commit, ואז Push. בדקו ב־GitHub שגם גרסת החזרה נמצאת בהיסטוריה. כך נמשיך לשיעור הבא עם אותו תוכן ועיצוב, אחרי שהתנסינו בשמירה ובהעלאה של שינויים.
ממשיכים במחשב הזה או במחשב נוסף
Pull מקבל את הגרסאות שהועלו ל־GitHub. Clone יוצר במחשב נוסף עותק של המאגר ושל ההיסטוריה שלו.
עוברים למחשב נוסף? מבצעים Clone פעם אחת
אחרי שהעליתם את העבודה מהמחשב הראשון, התחברו לאותו חשבון GitHub במחשב הנוסף. Clone מוריד את המאגר ואת ההיסטוריה שלו לתיקייה מקומית; אין ליצור שם פרויקט חדש.
- ב־VS Code: בחרו View → Command Palette → Git: Clone, הדביקו את כתובת המאגר הפרטי שלכם, בחרו תיקיית אב כגון
WebProjects, ואז פתחו את התיקייה שנוצרה. - ב־Visual Studio: במסך הפתיחה בחרו Clone a repository, הדביקו את הכתובת, בחרו מקום לשמירה ולחצו Clone. פתחו את קובץ הפתרון שבמאגר.
התקינו גם במחשב הזה את כלי הפיתוח מהמסלול שלכם. לאחר מכן, בכל מפגש פותחים את אותו עותק ומבצעים Pull; אין צורך ב־Clone נוסף.
שגרת העבודה מהשיעור הבא
- בתחילת מפגש, לאחר שהעבודה הקודמת שמורה ב־Commit: פתחו את המאגר הנכון ובצעו Pull. ב־VS Code: Source Control → … → Pull; ב־Visual Studio: Git → Pull.
- לאחר שינוי משמעותי: שמרו, הריצו, בדקו Diff, בצעו Stage ו־Commit עם הודעה ברורה שמתארת מה השתנה.
- בסיום: בצעו Push ובדקו ב־GitHub שהשינוי הגיע, גם כשעובדים תמיד באותו מחשב נייד.
- אם מופיעה התנגשות או שגיאת סנכרון, פנו למורה בלי למחוק עבודה ובלי Force Push.
לאורך השנה נדרשים לפחות 50 commits משמעותיים. מתחילים לצבור אותם עכשיו; אין צורך ליצור בדיעבד גרסאות לניסויים הקודמים או לפצל שינוי חסר ערך כדי להגדיל מונה.
כותבים הודעות Commit שעוזרות להבין את ההתקדמות
כתבו הודעה קצרה בעברית או באנגלית שמתארת את השינוי שביצעתם. למשל: Add navigation links to home page או Fix missing image on home page. הודעות כמו update, stuff או final אינן מסבירות מה השתנה. לפני Commit קראו את ה־Diff ובדקו שההודעה מתאימה לשינויים שבחרתם.
המורה יבחן את רצף ההשקעה לאורך השנה ואת בהירות הודעות ה־Commit, לצד תוכן השינויים והיכולת שלכם להסביר אותם. מכסת commits לבדה אינה מספיקה: שמרו שינויים משמעותיים בזמן העבודה ובצעו Push באופן קבוע.
בדיקת הבנה
לפני המעבר לשיעור הבא בדקו שתוכן האתר והעיצוב חזרו למצב שבחרתם בתחילת השיעור, שקובץ .gitignore שמור במאגר, ושאין שינויים ממתינים ב־Source Control או ב־Git Changes. ההיסטוריה נשארת ומציגה את הניסויים ואת החזרה מהם.
הראו גרסה ששמרתם במחשב ואת אותה גרסה ב־GitHub. הסבירו מה ההבדל בין Save, Commit ו־Push, ואיזו פעולה החזירה את הכותרת אחרי הניסוי.
רישום הפרויקט הושלם כשיש לכם אתר עובד, מאגר פרטי בשם FirstNameLastNameRazor עם הפרטים שלכם, קוד מעודכן והיסטוריית commits עם הודעות ברורות, וכשהמורה אישר שהוא יכול לגשת למאגר ולבצע Clone. מכאן ממשיכים באותו מאגר לאורך השנה.