Base44 בעברית: בונים אפליקציה מימין לשמאל ומתקנים את מה שנשבר

בקצרה

כן, אפשר לבנות ב-⁠Base44 אפליקציה בעברית. Base44 בונה אפליקציות React רגילות, הטקסט הוא מה שתכתבו או תבקשו, ואפשר לערוך כל קובץ בלשונית "Code" (הקוד). מה ש-⁠Base44 לא עושה זה לתעד פריסה מימין לשמאל (RTL) באפליקציות. נכון לאוקטובר 2026, התיעוד שלה מזכיר שפות שנכתבות מימין לשמאל רק בהקשר של מצגות, ועברית לא מופיעה ברשימת השפות של העורך ושל צ׳אט ה-⁠AI.

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

מה Base44 מתעדת על שפה ועל עברית

נכון לאוקטובר 2026, לפי התיעוד של Base44:

• העורך. דף התמיכה אומר שהפלטפורמה וצ׳אט ה-⁠AI זמינים בכמה שפות, "כולל אנגלית, גרמנית, ספרדית, צרפתית, יפנית ופורטוגזית". עברית לא ברשימה. התמיכה האנושית עובדת באנגלית בלבד.
• שפת הדף. קובץ index.html של האפליקציה מגדיר מאפיין lang, ותיעוד ה-⁠SEO של Base44 מנחה לשנות אותו בלשונית "Code" כך שיתאים לשפה העיקרית של האפליקציה. בעברית זה lang="he". אותו דף לא מזכיר את המאפיין dir, שקובע את הכיוון.
• דפי ההתחברות. Base44 יוצרת בתוך האפליקציה דפי התחברות, הרשמה ואיפוס סיסמה, ותיעוד ההתחברות אומר שאפשר לתרגם אותם לכל שפה.
• מיילים. במסלול Builder ומעלה אפשר להתאים את המיילים המובנים, כמו איפוס סיסמה ואימות כתובת מייל. גרסה משלכם למייל האימות דורשת דומיין מייל משלכם, חייבת להציג את הקוד, ועוברת בדיקה לפני שהיא נשלחת (עיצוב מיילים).
• גופנים. בחלונית "Theme" (ערכת העיצוב) אפשר לבחור גופן או להעלות גופן משלכם: TTF, ‏OTF, ‏WOFF או WOFF2, עד 5MB (התאמת העיצוב). אפשר גם להוסיף קטע הטמעה של Google Fonts דרך קובץ ה-⁠layout (יסודות העיצוב). בייבוא מ-⁠Figma רק Google Fonts נתמכים במלואם, ושאר הגופנים מוחלפים בגופן ברירת מחדל (ייבוא מ-⁠Figma).
• מימין לשמאל. האזכור היחיד נמצא בשאלות הנפוצות על מצגות: אפשר לבקש מה-⁠AI לתרגם מצגת, ו"שפות שנקראות מימין לשמאל נתמכות".
• תרגום עולה קרדיטים. דף הקרדיטים נותן את "תרגום כל האפליקציה" כדוגמה לשינוי שיכול לצרוך כמה קרדיטים, כי ה-⁠AI צריך לעבור על הרבה קבצים.

מתחת למכסה המנוע, אפליקציות Base44 משתמשות ב-⁠React, ב-⁠Vite, ב-⁠Tailwind CSS ובספריית הרכיבים shadcn/ui (הטכנולוגיות). זה חשוב, כי לכל אחת מהן יש דרך מתועדת משלה לטפל בכיוון מימין לשמאל.

מתחילים את האפליקציה מימין לשמאל

רוב באגי ה-⁠RTL מגיעים מאפליקציה שנבנתה משמאל לימין ותורגמה אחר כך. אם האפליקציה בעברית מההתחלה, כתבו את זה כבר בהנחיה הראשונה, ובפירוט. למשל:

This app is in Hebrew only and reads right to left.
- Set lang="he" and dir="rtl" on the <html> element in index.html.
- Use logical Tailwind classes (ms-, me-, ps-, pe-, start-, end-, text-start, text-end), never ml-, mr-, pl-, pr-, left-, right-, text-left or text-right.
- Use a font that includes Hebrew letters.
- Mirror arrows and chevrons that mean "back" or "next".
- Show phone numbers, emails and URLs left to right.

ההנחיה של W3C היא לשים dir="rtl" על האלמנט html, ולא לקבוע את כיוון הבסיס ב-⁠CSS ‏(W3C: סימון מבני וטקסט מימין לשמאל). מאז Tailwind v3.3, מחלקות כמו ms-3 ו-pe-4 מעצבות את תחילת האלמנט ואת סופו, כך שאותה מחלקה עובדת בשני הכיוונים (Tailwind CSS v3.3).

בחרו גופן שבאמת כולל אותיות עבריות. ב-⁠Google Fonts אפשר לסנן לפי עברית. גופן בלי עברית לא נכשל בצורה גלויה: הדפדפן פשוט עובר בשקט לגופן אחר בשביל הטקסט העברי, והכותרות שלכם יוצאות בשני גופנים.

בעיות RTL שחוזרות באפליקציות שנבנו עם AI, ואיך מתקנים אותן

הפריסה מתהפכת רק חלקית

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

למה: או ש-dir="rtl" חסר, או שהרכיבים משתמשים במחלקות פיזיות (ml-4, ‏pl-2, ‏left-0, ‏text-left, ‏rounded-l-md). מחלקה פיזית אומרת "שמאל" בלי קשר לכיוון.

התיקון: מגדירים dir="rtl" על <html>, ומחליפים מחלקות פיזיות במחלקות לוגיות: ml- הופך ל-ms-, ‏pr- ל-pe-, ‏left-0 ל-start-0, ו-text-left ל-text-start. לא כדאי "לתקן" את הסדר עם flex-row-reverse: זה משנה את מה שרואים על המסך אבל לא את הסדר בקוד, ואז הסדר של המקלדת ושל קורא המסך כבר לא תואם את מה שעל המסך.

ל-⁠shadcn/ui יש תיעוד משלה לתמיכה ב-⁠RTL, כולל רכיב DirectionProvider ופקודת migrate rtl שממירה מחלקות פיזיות ללוגיות. נסו אותה קודם על עותק או על branch.

סימני פיסוק ומילים באנגלית נוחתים במקום הלא נכון

מה רואים: נקודה אחרי שם מותג באנגלית קופצת לתחילת השורה, ‏"(Pro)" יוצא ")Pro(", או ששם משתמש באנגלית שובר את המשפט סביבו.

למה: האלגוריתם הדו-כיווני של הדפדפן מחליט איפה למקם תווים ניטרליים, כמו סימני פיסוק וספרות, לפי הטקסט שסביבם.

התיקון: עוטפים כל ביטוי בכיוון ההפוך באלמנט משלו. לטקסט שידוע מראש, span עם dir. לטקסט שלא ידוע מראש, כמו שמות, שמות מוצרים או כל דבר שמגיע ממסד הנתונים, משתמשים ב-<bdi> או ב-dir="auto", כפי שהמדריך של W3C לסימון דו-כיווני ממליץ:

<p>ההזמנה של <bdi>{order.customerName}</bdi> התקבלה.</p>
<span dir="ltr">Acme Ltd.</span>

חצים ואייקונים מצביעים לכיוון הלא נכון

מה רואים: חץ "חזרה" מצביע שמאלה בממשק בעברית, או ש"הבא" בקרוסלה מצביע אחורה.

התיקון: הופכים אייקונים שמראים כיוון תנועה או סדר קריאה (חזרה, הבא, החצים בפירורי לחם, התקדמות), ומשאירים את השאר כמו שהם. ההנחיות של Apple לממשקים מימין לשמאל מנסחות את זה היטב: הופכים פקדים שעוקבים אחרי סדר הקריאה, פקד שמתייחס לכיוון אמיתי ממשיך להצביע לאותו כיוון, ולא הופכים תמונות או איורים. ב-⁠Tailwind עושים את זה עם rtl:-scale-x-100 או rtl:rotate-180 על האייקון.

מספרים, מחירים, תאריכים ומספרי טלפון

מה רואים: מספר טלפון מוצג כ-4567-123-050, סימן ה-₪ נוחת בצד הלא נכון, או שטווח מחירים נקרא הפוך.

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

התיקון: מעצבים סכומים ותאריכים עם ה-⁠API ‏Intl של הדפדפן, שמכיר את המוסכמות הישראליות: new Intl.NumberFormat('he-IL', { style: 'currency', currency: 'ILS' }) ‏(MDN). עוטפים מספרי טלפון, ספרות אחרונות של כרטיס, מספרי הזמנה וכתובות URL ב-<span dir="ltr">. פסי התקדמות ומחוונים צריכים לרוץ מימין לשמאל, והמספרים עליהם שומרים על הסדר הרגיל שלהם.

טפסים

מה רואים: כשמקלידים כתובת מייל בשדה מימין לשמאל, הסמן קופץ וה-@ נוחת במקומות מוזרים.

התיקון: משאירים את התוויות ואת טקסט העזרה מימין לשמאל, אבל נותנים לשדות של מייל, כתובת אתר, טלפון וסיסמה dir="ltr". בשדות טקסט חופשי שיכולים להכיל כל אחת מהשפות, משתמשים ב-dir="auto", שבוחר את הכיוון לפי התו החזק הראשון שמוקלד. תרגמו גם את הודעות האימות והשגיאה, כולל אלה שהקוד מציג מהשרת ושמגיעות לא פעם באנגלית.

רכיבים שקובעים כיוון ב-⁠JavaScript

בוררי תאריכים, קרוסלות, גרפים ומחוונים מחשבים לא פעם מיקומים ב-⁠JavaScript ומתעלמים מ-dir. דף ה-⁠RTL של shadcn מציין את הרכיבים Calendar, ‏Pagination ו-⁠Sidebar כרכיבים שבפרויקטים ישנים צריך להמיר ידנית. פתחו כל אחד מהם בתצוגה המקדימה ולחצו עליו לפני שאתם מפרסמים.

בדיקה לפני פרסום

1. <html lang="he" dir="rtl"> בקובץ index.html.
2. חפשו בקוד ml-, ‏mr-, ‏pl-, ‏pr-, ‏left-, ‏right-, ‏text-left, ‏text-right ו-flex-row-reverse. לכל מופע צריכה להיות סיבה.
3. כל חץ מצביע לכיוון שבו הקורא מתקדם.
4. שמות, מיילים, מספרי טלפון ומחירים ממסד הנתונים מוצגים נכון בתוך משפטים בעברית.
5. עברו על כל דף עם Tab: הפוקוס צריך לנוע מימין לשמאל ומלמעלה למטה.
6. דפי ההתחברות, ההרשמה ואיפוס הסיסמה, והמיילים שמאחוריהם, בעברית.
7. בדקו בטלפון וגם בדפדפן במחשב, כי לתפריטים ולחלונות קופצים יש לא פעם פריסה נפרדת למובייל.

מה משתנה כשהקוד בבעלותכם

אף אחד מהתיקונים האלה לא מחייב לעזוב את Base44. אפשר לבצע אותם דרך צ׳אט ה-⁠AI או בלשונית "Code", ואז לפרסם. המגבלה היא שכל עריכה עתידית של ה-⁠AI יכולה להחזיר text-left, ובדיקה של זה היא עבודה ידנית.

כשהקוד נמצא במאגר (repository) שבבעלותכם, הבדיקה יכולה לרוץ לבד. אפשר להוסיף בדיקה שמכשילה את ה-⁠build בכל פעם שמופיעה מחלקה פיזית, להריץ את ההמרה של shadcn על branch, ולכתוב את הכללים ("רק מחלקות לוגיות, <bdi> סביב טקסט של משתמשים") בקובצי ההנחיות שסוכני קוד קוראים, כך ש-⁠Claude Code או Cursor יפעלו לפיהם בכל שינוי.

זה מה שהעברה עם Unbase44 נותנת. צד הלקוח (frontend) של האפליקציה, קוד ה-⁠React שלה עם כמה תיקונים קטנים שמפורטים ב-docs/MIGRATION.md, עובר למאגר פרטי ב-⁠GitHub שלכם, יחד עם צד שרת (backend) שתואם ל-⁠Base44 ותיעוד שנכתב גם לאנשים וגם לסוכני קוד (README, ‏AGENTS.md, ‏CLAUDE.md). האפליקציה רצה מקומית עם docker compose up, וב-⁠Railway כל push לענף הראשי (main) פורס אותה. הניתוח החינמי מראה מה יש באפליקציה לפני שמחברים משהו: מתחילים כאן. לתמונה הרחבה יותר, ראו הרצת אפליקציית Base44 מקומית ועבודה על אפליקציית Base44 עם Claude Code או Cursor.