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

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

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

קחו למשל את הקוד הבא עבור פלאגין למונה לחיצות.

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

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

רוב הדוגמאות לניתוב צד-לקוח באמצעות react-router מציגות הגדרת טבלת ניתוב שנראית כמו JSX. היתרון שזה מרגיש יותר ריאקטי אבל האמת שמדובר במסיכה בלבד: ריאקט ראוטר עצמה מתרגמת את כתיב ה JSX לטבלת ניתוב הבנויה כהיררכיה של אוביקטי JavaScript, בדיוק כמו הראוטר של אנגולר או ספריות ניתוב אחרות.

להלן דוגמא פשוטה לטבלת ניתוב בשני התחבירים לצורך השוואה ביניהם.

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

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

המטרה בשינוי הגישה היא להפוך את התהליך. להביא למצב שכל יום שעובר פועל לטובתכם. אבל איך?

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

הפיתוח והבאז סביב node.js הביאו מתכנתים רבים לכתוב קוד צד-שרת וכלי סקריפטים ב JavaScript. אחד מאותם מפתחים, אייזק שלוטר, הבין מהר מאוד שהתקנה ידנית של חבילות זה תהליך די מתסכל ודרוש כלי אוטומטי דרכו כל אחד יוכל לכתוב חבילת קוד ולהפיץ אותה לחברים. אז הוא פיתח כלי כזה וקרא לו npm, שזה קיצור ל node package manager ומהר מאוד כולם באמת התחילו לכתוב ולהפיץ חתיכות קוד JavaScript לחברים.

היום יש במאגר של npm מעל 240 אלף חבילות וקצב גידול של כ 400 חבילות חדשות ביום. לצורך השוואה המאגר המקביל של פייתון כולל כ 75 אלף חבילות וגדל בקצב של 70 חבילות ביום. זה המון קוד לשלב בפרויקטים שלכם.

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

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

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

משתנים קשורים הם מאפיין אהוב של ספריות ממשק משתמש רבות מאחר והם מאפשרים לנתק בין הפעולה לבין השפעתה על המסך. אתם יכולים למצוא אותם בפלאש, באנגולר וכמובן גם ב QML. במקרה של QML אפשר לכתוב את הלוגיקה לעדכון ערכי המשתנים ב JavaScript או ב C++