02 — מתחילים ב־Visual Studio: פרויקט Razor לניסוי

יוצרים אתר מתבנית, מריצים אותו ומתרגלים יצירה חוזרת

ניצור אתר Razor Pages דרך הממשק של Visual Studio ב־Windows ונריץ אותו. אפשר לחזור למדריך וליצור ניסוי נוסף בשם חדש.

02 — חזרה: סביבת הפיתוח: מריצים ומשנים אתר

1. מתקינים את כלי הפיתוח

  1. התקינו Visual Studio Community בגרסה שתומכת ב־.NET 10. אם Visual Studio כבר מותקן, פתחו Visual Studio Installer ובדקו אם נדרש עדכון.
  2. בחלון ההתקנה סמנו ASP.NET and web development ולחצו Install. בהתקנה קיימת לחצו Modify, סמנו את הרכיב והשלימו את השינוי.
  3. ודאו שמותקן .NET 10 SDK. אם הוא חסר, התקינו אותו ופתחו מחדש את Visual Studio.

פרויקט מכיל את הקוד של האתר. Solution / פתרון הוא מסגרת ש־Visual Studio משתמש בה כדי לפתוח ולנהל פרויקטים. אצלנו יהיה בו פרויקט אחד.

2. בוחרים מקום ושמות

את תיקיות הפרויקט ייצור Visual Studio עבורכם. התחילו במסך הפתיחה של התוכנה.

פותחים את חלון יצירת הפרויקט

פתחו Visual Studio 2026. בצד ימין של מסך הפתיחה לחצו Create a new project, כפי שמסומן בצילום.

אם כבר פתוח חלון עבודה, בחרו File → New → Project כדי להגיע לאותו חלון.

מסך הפתיחה של Visual Studio 2026 עם סימון על Create a new project

מחפשים ובוחרים את תבנית האתר

בתיבת החיפוש בחלק העליון הקלידו raz. ברשימת התוצאות לחצו על ASP.NET Core Web App (Razor Pages), כפי שמסומן בצילום, ואחר כך על Next בתחתית החלון.

ודאו שבחרתם בתבנית האתר בשפת C#. התוצאה Razor Class Library שמופיעה מתחתיה אינה התבנית שנשתמש בה. אל תבחרו Blazor, Web API או תבנית עם MVC בשם.

חיפוש raz ובחירת ASP.NET Core Web App (Razor Pages) בחלון יצירת פרויקט

אפשר ללחוץ על כל צילום כדי לפתוח אותו בגודל מלא.

נותנים שמות ובוחרים תיקייה

בצילום מופיע השם GuysRazor; אצלכם אפשר לבחור שם אחר לניסוי.

בחלון Configure your new project בחרו שם באנגלית ללא רווחים, למשל RazorPractice או AnimalsTry2. זהו פרויקט להתנסות; השם האישי המחייב ייקבע רק בשיעור Git אחרי Bootstrap.

  • Project name: הקלידו את השם שבחרתם.
  • Location: השאירו את מיקום ברירת המחדל שמציע Visual Studio, בדרך כלל source\repos בתוך תיקיית המשתמש שלכם. אין להעתיק את שם המשתמש 3stra מהצילום.
  • Solution name: השאירו את אותו שם כמו הפרויקט.
  • Place solution and project in the same directory: השאירו לא מסומן.

בתחתית החלון תוכלו לראות היכן הפרויקט ייווצר. לחצו Next. אין צורך ליצור תיקייה בסייר הקבצים לפני כן.

חלון Configure your new project עם שם לדוגמה ומיקום ברירת המחדל source repos

Visual Studio ייצור תיקייה חיצונית לפתרון ותיקייה פנימית לפרויקט, שתיהן בשם שבחרתם. בדוגמה שלנו שתיהן נקראות RazorPractice.

אם כבר יצרתם את הפרויקט, פתחו אותו דרך Open a project or solution ובחרו את RazorPractice.sln או RazorPractice.slnx שבתיקייה הקיימת. כדי להמשיך עבודה קיימת אין צורך ליצור פרויקט נוסף. לתרגול יצירה מחדש בחרו שם חדש ותיקייה חדשה. את first-page מהשיעור הקודם נשאיר כפי שהיא.

3. יוצרים את פרויקט Razor Pages

בחלון Additional information בחרו את ההגדרות הבאות. שימו לב להבדל המצוין לגבי top-level statements בצילום הישן:

  • Framework: .NET 10.0 (Long Term Support).
  • Authentication type: None.
  • Configure for HTTPS מסומן.
  • Enable container support לא מסומן.
  • Do not use top-level statements לא מסומן: משאירים את קוד האתחול הרגיל של התבנית. בצילום הישן האפשרות מסומנת; אצלכם הסירו את הסימון.
  • Enlist in Aspire orchestration לא מסומן.

השדות האפורים אינם דורשים פעולה. לחצו Create בתחתית החלון והמתינו ליצירת הפרויקט.

הגדרות Additional information עבור Razor Pages עם NET 10 ואפשרות Do not use top-level statements מסומנת

אם תבנית Razor Pages או .NET 10 אינן ברשימה, חזרו לשלב ההתקנה והעדכון. אל תבחרו תבנית אחרת רק כדי לעבור את המסך; הראו למורה מה חסר.

4. בדיקה ראשונה: לוחצים על Play ורואים אתר

מיד לאחר Create, המתינו עד שחלון הפרויקט ייפתח והטעינה תסתיים. לפני שמשנים קוד, בדקו שהפרויקט שנוצר פועל:

  1. לחצו על המשולש הירוק ▶ (Play) בסרגל העליון של Visual Studio.
  2. המתינו לסיום הבנייה ולהפעלת הדפדפן. בהרצה הראשונה הדבר עשוי לקחת מעט זמן.
  3. בדקו שבדפדפן מופיע דף הפתיחה של האתר עם הכותרת Welcome, ובשורת הכתובת מופיע localhost עם מספר יציאה. זה האתר שלכם, שרץ כרגע על המחשב שלכם.

הבדיקה הצליחה: לחצתם על Play והדף Welcome נפתח בדפדפן. הפרויקט נוצר בהצלחה ואפשר להמשיך לעבוד עליו ולנסות שינויים.

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

בהרצה הראשונה מופיעה בקשה לאישור תעודת HTTPS?

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

עוצרים, מכירים את הקבצים ומשנים כותרת

חזרו ל־Visual Studio ולחצו על הריבוע האדום Stop בסרגל העליון כדי לעצור את ההרצה.

פתחו View → Solution Explorer. הרחיבו את הפרויקט RazorPractice ואת התיקייה Pages. בסייר הקבצים תוכלו לראות את המבנה הבא:

source/repos/
└── RazorPractice/
    ├── RazorPractice.slnx (או RazorPractice.sln)
    └── RazorPractice/
        ├── RazorPractice.csproj
        ├── Program.cs
        ├── Pages/
        │   └── Index.cshtml
        └── wwwroot/

Pages מכילה דפי אתר ו־wwwroot מכילה עיצוב, תמונות ו־JavaScript. בהמשך, הנתיב RazorPractice/Pages/Index.cshtml מתחיל מתיקיית RazorPractice; ב־Solution Explorer פותחים את הפרויקט ואז את Pages.

  1. ב־Solution Explorer פתחו את הפרויקט בשם שבחרתם, ואז Pages → Index.cshtml.
  2. בשורת הכותרת החליפו רק את Welcome ב־החיות שלי ושמרו עם Ctrl+S.
  3. לחצו שוב על המשולש הירוק Play ובדקו שבדפדפן מופיעה הכותרת החדשה.
  4. חזרו ל־Visual Studio ועצרו באמצעות Stop לפני שממשיכים לעריכה.

כעת גם השינוי שלכם מופיע באתר. שמרו את הקבצים והמשיכו לשיעור המשותף.

איך משתמשים בשמות שלכם בשיעורים הבאים?

בדוגמאות בקורס הפרויקט נקרא RazorTaba. אצלכם השתמשו בשם שבחרתם: למשל, RazorTaba/Pages/Index.cshtml הוא RazorPractice/Pages/Index.cshtml בתוך תיקיית הפתרון. אין לשנות את שם הפרויקט כדי להתאים לדוגמה. ב־Solution Explorer פתחו את הפרויקט שלכם ואז את Pages.

השאירו את Program.cs ואת Properties/launchSettings.json כפי שנוצרו. בשלב הזה עורכים תוכן ועיצוב בלבד. אין צורך ליצור מאגר Git או לפרסם ל־GitHub.

המשך

חוזרים לשיעור המשותף