Elsama Luxury Marble

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

Elsama Luxury Marble היא אפליקציית Laravel מונחית פורטפוליו, שנבנתה עבור עסק לחומרים יוקרתיים שזקוק ליותר מאשר אתר תדמיתי בלבד. האתר מציג פרויקטים, חומרים, תוכן בלוג, המלצות ומיצוב שירותים בדרך התומכת באמינות המותג ובהמרת מכירות בו-זמנית. הפלטפורמה מותאמת לקהלים בינלאומיים, עם ניתוב מודע ללוקאל (locale-aware), תמיכה ב-RTL (מימין לשמאל) ותוכן מתורגם המאוחסן ישירות במודל הדומיין. בצד התפעולי, אותה בסיס קוד מפעיל חוויית Inertia React ציבורית ושכבת ניהול (Filament CMS) לניהול תוכן, פניות וניתוח נתונים.

הצעת ערך מרכזית

• ביצועים ומדרגיות (Scalability): החוויה הציבורית מוגשת באמצעות Inertia v2 עם תמיכת SSR, טעינת קשרים (relationships) בשיטת eager-loading, משאבי JSON רזים, הגדרות במטמון, תורים מבוססי מסד נתונים והמרת תמונות לפורמט WebP לאספקת דפים מהירה יותר.
• מצוינות ב-UX/UI: החזית (Frontend) משתמשת בשפה חזותית עריכתית יוקרתית עם טיפוגרפיה גדולה, פריסות מונחות תמונות, כרטיסים רספונסיביים, אינטראקציות של "טען עוד" בבלוג, כפתור וואטסאפ דביק להמרה, והחלפת כיוון פריסה מודעת ללוקאל.
• אבטחה ואמינות: הגשת פניות מאומתת בצד השרת, מוגבלת לפי קצב לכל IP, מועברת לתור למשלוח, ומשוכפלת הן לצוות הפנימי והן ללקוח הפוטנציאלי. ממשק הניהול מבודד מאחורי אימות של Filament, בעוד מחיקה רכה (soft deletes) של תוכן ושמירת לוקאל מבוססת סשן מפחיתות סיכונים תפעוליים.

ארכיטקטורה טכנית וטכנולוגיות

Frontend (חזית)

• מסגרת עבודה: React 18 עם Inertia.js v2 ונקודות כניסה ל-SSR ב-resources/js/app.tsx וב-resources/js/ssr.tsx.
• מצב וניווט: Inertia router, useForm, עזרי ניתוב דרך Ziggy, ודפדוף/סינון בצד הלקוח עבור תצוגות קטלוג ובלוג.
• עיצוב ותנועה: Tailwind CSS, Headless UI, Framer Motion, ופלטה עריכתית כהה המותאמת במיוחד למותג חומרים יוקרתי.
• דפוסי ממשק: מעטפת פריסה ציבורית, כרטיסים וקריאות לפעולה (CTAs) לשימוש חוזר, רינדור תוכן רב-לשוני, וקומפוזיציה רספונסיבית של אזורי גיבור (hero) וסקציות.
• תוכן עשיר: TipTap זמין ליצירת תוכן CMS ארוך בלוח הבקרה למנהלים.

Backend / API (צד שרת)

• מסגרת עבודה: Laravel 13 עם ניתוב MVC קלאסי ותגובות Inertia עבור האתר הציבורי.
• מידול דומיין: שדות מתורגמים בפורמט JSON עבור שמות, תיאורים, טקסט SEO ותוכן בלוג; קישור מודל לניתוב מבוסס slug; מחיקות רכות בישויות קטלוג ליבה.
• גישת נתונים: משאבי API ייעודיים מנרמלים כתובות אתרים של מדיה, תוכן מתורגם ומטעני נתונים יחסיים לפני שהם מגיעים לחזית.
• שירותים עסקיים: עזר תרגום פותר חלופות לוקאל (fallbacks), מודל הגדרות שומר הגדרות גלובליות במטמון, ניתוח נתונים מונצח דרך שכבת שירות, ותמונות מומרות ל-WebP לפני האחסון.

DevOps ותשתית

• זמן ריצה מקומי: הפרויקט מתוכנן עבור שרשרת כלים סטנדרטית של PHP + Node ו-Laravel Herd. לא מוגדר Docker בתוך המאגר (repository).
• תורים ודואר: תור מסד נתונים הוא ברירת המחדל, עם התראות פנייה בתור ודואר מבוסס לוגים המוגדר לפיתוח מקומי.
• אחסון: מדיה ציבורית נכתבת לדיסק ה-public ומוגשת מ-storage/app/public.
• צינור בנייה (Build Pipeline): Vite מהדר את חבילת הלקוח וחבילת ה-SSR, בעוד סקריפטים של המאגר מפעילים גם את שרת האפליקציה, מאזין התורים וקורא הלוגים יחד במהלך הפיתוח.
• מטמון (Caching): המטמון של Laravel משמש להגדרות גלובליות, וניתן להחליף את התצורה למנהלי התקן נתמכים אחרים כאשר הסביבה דורשת זאת.

זרימת ארכיטקטורה

flowchart LR
	Browser[דפדפן ציבורי] --> Inertia[דפי Inertia React]
	Inertia --> Controllers[בקרי Laravel]
	Controllers --> Resources[משאבי API + מנהל לוקאל]
	Controllers --> Models[מודלים של Eloquent + שירותים]
	Models --> DB[(MySQL / SQLite)]
	Models --> Cache[(מטמון Laravel)]
	Controllers --> Queue[(תור מסד נתונים)]
	Queue --> Mail[מיילים של פניות]
	Controllers --> Storage[(אחסון ציבורי / מדיה ב-WebP)]
	Admin[מנהל Filament] --> Controllers
	Admin --> Models
	Controllers --> Analytics[(לוגים של ניתוח נתונים)]

צלילה לעומק ההנדסה

1. אספקת תוכן מודעת לוקאל

האתגר אינו רק תרגום מחרוזות; הוא שמירה על עקביות של כתובות אתרים, כיוון פריסה ומטעני תוכן על פני שישה לוקאלים, תוך שימור slugs ידידותיים ל-SEO וטקסט קריא עסקי. הפתרון משתמש בקידומת ניתוב {locale}, שמירת לוקאל מבוססת סשן, ו-LocaleManager שפותר ערכים מתורגמים מעמודות JSON עם חלופות הגיוניות. ערבית מטופלת כ-RTL בשכבת הפריסה, כך שמעטפת האתר הציבורי מעדכנת את כיוון המסמך באופן דינמי במקום להסתמך על תבניות משוכפלות.

2. צינור פניות ממוקד המרה

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

3. קטלוג עשיר במדיה ו-CMS עריכתי

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