הבלוג של ינון פרק

ES6 היא נפלאה כי היא פותרת הרבה מהבעיות העתיקות של JavaScript. זוהי המהפכה הכי גדולה של JavaScript מאז גירסא 3 (שנת 1999), מה שאומר שיש המון תחביר חדש ללמוד.

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

נראה שכל הילדים המגניבים עברו לכתוב ריאקט עם ES6 Classes וכמוהם גם אני ניסיתי, עד שנתקלתי בבעיה המרגיזה הבאה שגרמה לי לתכנן מסלול מחדש.

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

בשבועות האחרונים עבדתי על המרת קוד צד הלקוח של אתר ToCode למבנה של Single Page Application באמצעות הטכנולוגיות React ו Redux. קוד צד השרת היה ונשאר Ruby on Rails. התוצאה היא שיפור ניכר בזמני הטעינה וזמני התגובה של כל האתר וקוד משמעותית יותר נקי וקל לתחזוקה. פוסט זה מסכם את כל הלקחים, הבחירות והטעויות שעשיתי במהלך השכתוב וכמובן טיפים עבור מי ששוקל לבצע שדרוג כזה.

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

ספריית Redux של דן אברמוב היא הדבר החם היום בעולם של React. כותב הספריה גויס לאחרונה לעבוד בפייסבוק ויש סיכוי לא רע שנתחיל בקרוב לראות את הגב של פייסבוק גם לספריה זו (בנוסף למימוש Flux שלהם). הנה הצעה שלי למסלול לימוד רדוקס שיעזור להבין על מה כולם מדברים.

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

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

כשאנחנו חושבים על עיצוב קוד (Code Design) מיד עולה לראש עולם המונחים מונחה העצמים: ירושה, כימוס, פולימורפיזם וכמובן מחלקות ותבניות עיצוב, אבל האמת היא שאפשר לכתוב קוד מודולרי ונקי גם ללא שימוש במחלקות. במיוחד נכון הדבר בשפות תכנות המתיחסות ברצינות לפונקציות ולהרכבה שלהן כפי שנראה בדוגמא הבאה.