דלג לתוכן הראשי
לשונית Code מאפשרת לך לצפות ולערוך את קוד המקור של האפליקציה שלך ישירות, ומעניקה לך שליטה על הפונקציונליות, העיצוב וההתנהגות של האפליקציה תוך כדי ראיית השינויים באופן מיידי.
לשונית Code מיועדת למפתחים שרוצים שליטה רבה יותר. לשינויים פשוטים יותר, השתמש בעורך החזותי ובכלי ה-AI של Base44.
The Code tab interface showing your app's source code

​
גישה ללשונית Code

לפתיחת לשונית Code:
  1. עבור ללוח הבקרה של האפליקציה שלך.
  2. לחץ על לשונית Code.
לשונית Code מציגה את קבצי הפרויקט שלך בסייר קבצים בצד שמאל, כאשר עורך הקוד תופס את עיקר המסך.
Accessing the Code tab from your app dashboard

​
ניווט בקוד שלך

השתמש בתכונה Files used in this page כדי לראות אילו קבצים מפעילים את הדף שאתה צופה בו. הדבר מציג בדיוק אילו קבצי קוד פועלים, כך שתדע לאן ללכת כאשר תרצה לערוך את הדף או לחקור בעיה. כל רשומה ברשימה מציגה את שם הקובץ ואת נתיב התיקייה שלו, מקובצת לפי המיקום בפרויקט שלך כגון pages או components. לצפייה בקבצים בשימוש בדף:
  1. עבור לעורך האפליקציה.
  2. לחץ על הסמל More Actions בפינה הימנית העליונה.
  3. לחץ על Files used in this page.
Viewing files used on a page of your app
אם תרצה לעבור מהתצוגה הממוקדת הזו למבנה הקבצים המלא, לחץ על See all files. פעולה זו תעביר אותך לתצוגת קבצי הקוד המלאה כדי שתוכל להמשיך לחקור משם.

​
עריכה עם תצוגה מקדימה חיה

לשונית Code מציעה תצוגת מסך מפוצל המציגה את הקוד שלך בצד אחד ותצוגה מקדימה חיה של האפליקציה בצד השני. זה מאפשר לך לראות שינויים באופן מיידי ללא החלפת הקשר.
Split screen view showing code and live preview
לעריכה עם תצוגה מקדימה חיה:
  1. פתח קובץ בלשונית Code.
  2. לחץ על מתג המסך המפוצל בפינה הימנית העליונה.
  3. ערוך את הקוד שלך בצד שמאל וראה את השינויים בצד ימין.
בכל פעם שאתה מבצע שינויים בקוד:
  • לחץ על Save בתחתית המסך כדי להחיל את השינויים שלך ולרענן את התצוגה המקדימה עם הקוד העדכני.
  • לחץ על Discard בתחתית המסך אם תרצה לבטל את כל העריכות שלא נשמרו ולחזור לגרסה השמורה האחרונה של הקובץ.
חשוב: אם תבצע שינויים בקוד האפליקציה, ודא שלחצת על Publish כדי שיעלו לאוויר באפליקציה שלך.
כשתהיה מוכן לעזוב את המסך המפוצל, לחץ על Exit split. לפיתוח מקומי עם ה-IDE שלך, ראה GitHub Integration.

​
סקירת שינויי קוד של ה-AI

כאשר ה-AI עורך את האפליקציה שלך, תוכל לפתוח את חלון Code changes כדי לראות בדיוק מה הוא שינה לפני הפרסום. החלון מציג כל קובץ שה-AI נגע בו, מקובץ לפי תיקייה, עם תצוגת diff עבור כל אחד. לפתיחת חלון Code changes:
  1. עבור לצ’אט ה-AI בעורך האפליקציה.
  2. רחף מעל הודעה שבה ה-AI ערך או יצר קובץ.
  3. לחץ על סמל שלוש הנקודות לצד השינוי ובחר View Changes.
חלון נפתח עם עץ קבצים בצד שמאל וה-diff של הקובץ שנבחר בצד ימין. שורת סטטיסטיקה בחלק העליון מפרטת כמה קבצים נוספו, שונו ונמחקו. קבצים בעץ צבועים לפי מצב:
  • ירוק עבור קבצים שנוספו לאחרונה.
  • ענבר עבור קבצים שעברו שינוי, שנפתחים בתצוגת diff זה-לצד-זה.
  • אדום עבור קבצים שנמחקו.
לחץ על כל קובץ בעץ כדי לקפוץ ישירות ל-diff שלו.

​
שאלות נפוצות

כן. ניתן לפתוח ולערוך כל קובץ קוד שמופיע בפאנל קבצי הקוד, כולל pages, components, layouts ועוזרי entity. אם חלק מהאפליקציה נוצר עבורך, הוא עדיין יופיע ככקוד רגיל שאתה יכול לשנות.
לא. תוכל לעבוד בעורך הקוד ברוחב מלא אם אתה מעדיף יותר מקום. מסך מפוצל מועיל כאשר אתה רוצה לראות את התצוגה המקדימה לצד הקוד שלך, אבל תוכל לכבות אותו בכל עת ולפתוח אותו שוב מאוחר יותר.
Discard מסיר את כל השינויים שלא נשמרו בקובץ הפעיל ומשחזר את הגרסה השמורה האחרונה. זה שימושי אם אתה מנסה משהו שלא עובד ורוצה לחזור במהירות. לאחר לחיצה על Discard, לא ניתן לשחזר את הקוד שלא נשמר מאותו סשן.
אין צורך להיות מומחה, אבל היכרות בסיסית עם React ו-JSX עוזרת. אפשר להתחיל בשינויים קטנים כגון עדכון טקסט, החלפת components, או שינוי סגנונות פשוטים, ולעבור ללוגיקה מתקדמת יותר ככל שתצבור ביטחון
דף זה תורגם באמצעות בינה מלאכותית. למידע המדויק והעדכני ביותר, עיין בגרסה האנגלית.