מה לומדים

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

הקורס מורכב מ-10 שעורים המכסים יחדיו את כל מה שאתם צריכים לדעת כדי להתחיל לכתוב קוד ריאקט ולשלב אותו בתוכניות שלכם. אנו נתחיל בדברים הפשוטים, נראה כיצד לבנות פקד ריאקט וכיצד לשלב אותו בקוד קיים שלנו מבלי לפגוע בנגישות האתר למנועי חיפוש. לאחר הבנה של היסודות נוכל לבנות פקדים מורכבים: נדבר על העברת מידע בין פקדים, החל מתוכניות קטנות ועד ליישומי צד-לקוח מלאים הכוללים תקשורת עם צד-שרת ו Local Storage. בהמשך תלמדו על ארכיטקטורת Flux שפותחה בפייסבוק כטכנולוגיה מלווה לריאקט, וכיצד Flux ו React משתלבות יחד לפתח יישומי צד-לקוח מלאים.

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

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

הספריות שנלמדות בקורס כוללות: React, Reflux, React Router, React Bootstrap.
בנוסף נראה כיצד לשלב את ריאקט עם ספריית jQuery ו jQuery UI. 

סילבוס מפורט
אחד הדברים שתאהבו בספריית ריאקט הוא כמה קל להתחיל לכתוב קוד עובד. כבר בפרק המבוא אנו נבנה פקדי ריאקט ונכיר את עקרונות היסוד של הספריה דרך דוגמאות למימוש פקדי ריאקט שעושים דברים פשוטים, לדוגמא מונה לחיצות, ממיר יחידות זמן ופקדי טקסט. בסיום הפרק תוכלו להתחיל לכתוב קוד ריאקט ולשלב אותו ביישומים שלכם.
1. סקירת הספריה והקורס
תצוגה מקדימה
2. הפקד הראשון שלי
3. שילוב ריאקט בקוד שלנו
4. פקדים פשוטים
5. תרגול פקדים
6. פקדים מקוננים
הפרק השני בקורס עוסק בפיתוח קוד מודולרי ושימוש חוזר בקוד ריאקט. כאן נלמד על הכלים שריאקט מציעה כגון Mixins וקיצורי דרך למתכנתים כדי להקליד פחות ולהגיע לתוצאות מהר יותר
7. שילוב jQuery Plugins בקוד ריאקט
8. שימוש חוזר בקוד באמצעות Mixins
9. קשירת מידע דו-כיוונית
תצוגה מקדימה
10. עבודה עם רשימות בריאקט
תצוגה מקדימה
11. שיפור ביצועים באמצעות צמצום קריאות ל Render
הפרק כולל מספר דוגמאות מורכבות יותר לפיתוח פקדים בריאקט. בין השאר נכתוב פקד עבור סליידר תמונות מתחלפות ונממש משחק איקס עיגול כפקד ריאקט. דרך הבניה של הפקדים נכיר את האתגרים של יישומי ריאקט גדולים יותר ונוכל להתחיל לדבר על ארכיטקטורה כהכנה לשעורים על רדוקס.
12. פיתוח סליידר תמונות
13. פיתוח משחק איקס עיגול
14. חלוקת העבודה בין פקדים
15. תרגול: ריבוי לוחות למשחק איקס עיגול
16. ניתוב צד-לקוח עם React Router
פרק זה פותח את החלק השני של הקורס העוסק בארכיטקטורה ליישומים מורכבים. אנו מתחילים עם ספריית רדוקס, ספריה מורכבת שמטרתה פיתוח יישומים גדולים עם דגש על ביצועים ובדיקות של כל הרכיבים במערכת. זה אולי הפרק הארוך והמורכב בקורס מפאת מורכבות הנושא, והוא כולל דוגמאות ותרגולים מעשיים על הספריה.
17. למה פלאקס
18. היתרונות בעבודה עם Immutable Data
19. תרגול: Immutable Data
20. ניהול מצב ופעולות
21. הוספת ממשק משתמש
22. תרגול רדוקס
23. זיהוי שינויים יעיל יותר
24. הרצת קוד עבור פעולה
25. תקשורת עם צד השרת
בפרק זה נלמד על גישה נוספת לפיתוח בארכיטקטורה שנקראת Reflux. גם הפעם הלימוד מבוצע דרך תרגול ודוגמאות מהעולם האמיתי כולל שילוב קריאות Ajax ויישומי עמוד-יחיד באמצעות React Router
26. תרגיל אמצע: פקד מלבנים
27. ארכיטקטורה ליישומי ריאקט
28. שילוב קוד Ajax
29. חלוקה למודולים
פרק זה מציג שיטות לשילוב ריאקט עם שפות צד-שרת מרכזיות
30. שילוב פקד ריאקט ביישום Java
31. שילוב פקד ריאקט ביישום Ruby On Rails
Teacher

מדריך הקורס - ינון פרק

הי! אני ינון פרק. אני מתכנת שכותב קוד כל יום מאז שנת 2002, ומשנת 2012 גם מדריך קורסים בפיתוח למתכנתים בחברות תוכנה מובילות בארץ. בין השאר לימדתי ב Intel, IBM, Amdocs, Sapiens, eBay ובעוד עשרות חברות הייטק נוספות כאן בארץ.

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

איך זה עובד - מסלול מנוי חודשי

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

React (ישן): קורס אונליין בעברית

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

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

בקצרה

  • 31 שיעורים
  • 5 שעות וידאו
  • גישה לכל תכני הקורס ולכל שאר הקורסים באתר
  • אתם לא לבד! עזרה מקצועית דרך המייל ובקבוצת הדיונים
  • הצטרפו עכשיו