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

1. ריאקט: פיתוח מבוסס פקדים בדרך הנכונה

פקד הוא רכיב ויזואלי בממשק המשתמש שנמצא בשימוש במספר מקומות. אתם תמצאו פקדים בכל ספריית ממשק משתמש כולל ב HTML רגיל. כפתור של HTML הוא פקד, וכך גם select ו input.

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

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

2. מה נראה בקורס

בשנים האחרונות הייתי שותף בפיתוח מערכות מבוססות ריאקט ללקוחות ולפרויקטים אישיים. את כל אתר ToCode פיתחתי ב React אחרי שראיתי כמה העבודה בספריה זו יעילה יותר מטכניקות פיתוח אחרות.

בקורס תלמדו לפי הסדר את כל מה שצריך לדעת על React היום ובראיה קדימה. בחלק הראשון נדבר על מנגנון הפעולה של React והרעיון של Virtual DOM. לאחר מכן נבנה פקדים ב React ודרך הבניה נלמד על State ו Properties של פקדים.

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

בחלק "תבניות נפוצות" שהוא החלק השני של הקורס תלמדו כיצד לכתוב קוד React ליישומים גדולים ולעשות שימוש מחדש בקוד ריאקט שכתבתם במספר מקומות והקשרים. נדבר על Mixins, שילוב ריאקט עם jQuery ו jQuery Plugins, כתיב ES6 וטיפול באירועי מקלדת.

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

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

3. סיכום

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