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

בסיכומה של התלבטות החלטתי להתחיל בלי ריאקט ולראות מה יקרה וכמה אתגעגע אליה. התוצאה היא JavaScript קצת מבולגן, ששומר את הסטייט ב DOM במקום בזיכרון וכולל לא מעט קטעי קוד מהסוג הזה:

if (this.miniPlayerValue) {
  this.playButtonTarget.textContent = '❚❚';
} else {
  this.playButtonTarget.classList.add('hidden');
}

ובאותו זמן עמוד שנטען הרבה יותר מהר כי מכיל הרבה פחות JavaScript (כ 360 קב), בלי שום צורך לחשוב על סטייט, איפה לשים אותו ואיך הוא עובד ומיסתנכרן בין מספר מקומות ביישום. בקיצור בינתיים אני עוד לא מתגעגע אבל זה כמובן רק פונקציה של דרישות המערכת. יום אחד אם יהיו דרישות מספיק מורכבות אולי יהיה מקום לשקול ריפקטורינג לפריימוורק.

הפרויקט עצמו אגב הוא מערכת שבונה לי אוטומטית תרגולי שפה מתוך שירים. אם אתם בעניין הנה כמה דוגמאות לתרגולים שבניתי עם JavaScript ונילה ללא ריאקט לפי השירים:

ספרדית עם השיר El principio de algo https://www.langlets.app/courses/el-principio-de-algo

צרפתית עם Et si tu n'existais pas https://www.langlets.app/lessons/et-si-tu-n-existais-pas0

אנגלית עם מיילי סירוס https://www.langlets.app/lessons/flowers0

וערבית עם ג'ואן ספדי https://www.langlets.app/lessons/haifa-jenin0