אודסיטי · Nanodegree · 7 קורסים · 61 שעות

מסלול Nanodegree בפיתוח ממשקים ב-React — אודסיטי

המסלול מורכב משבעה קורסים: פתיחה קצרה, שלושה קורסי ליבה — יסודות React · React ברמת ביניים · React ו-Redux — וסיום, ואחריהם שני קורסי רשות: React Native, וכן Git ו-GitHub.

השורה התחתונה שלנו

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

סרטון קצר על אודסיטי

סרטון קצר על אודסיטי · 2:41

61ש׳

משך רשמי

ביניים

רמת כניסה

7 · 4

קורסים · פרויקטים

4.7★

574 מדרגים

2חוד׳

עד סיום · שלנו

לעמוד המסלול
באודסיטי ←

הרשמה ותמחור מתבצעים אצל אודסיטי · קישור שיווקי · אנחנו לא מוכרים את הקורס

בשורה אחת

חמש שאלות, חמש תשובות

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

01

למי זה

למי שכבר כותב JavaScript, מכיר HTML ו-CSS ורוצה להגיע ל-React ברמה מקצועית — לא קורס תכנות ראשון.

02

מה יוצא ביד

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

03

כמה זמן באמת

61 שעות רשמיות לליבה; בקצב של 6 עד 8 שעות בשבוע זה כחודשיים עד חודשיים וחצי. שני קורסי הרשות מוסיפים כ-25 שעות — עוד כשלושה עד ארבעה שבועות.

04

איפה זה ממקם אותך

בחלק בניית-המסכים של משרת פרונט, מול הכלים שעובדים איתם בפועל — React 19, React Router, React Query, Redux, טיילווינד (Tailwind), Jest ו-Vitest. לא בתחזוקת קוד קיים ולא בעבודת צוות.

05

מה חסר

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

המסגרת במספרים

61 שעות, ומה שיוצא מהן

אלה המספרים שאודסיטי עצמה מפרסמת בעמוד-המוצר. נמדדו ב-8.9.2026.

61

שעות רשמיות

בקצב של 6 עד 8 שעות בשבוע — כחודשיים עד חודשיים וחצי

7

קורסים

56

שיעורים

4

פרויקטים

4.7

574 מדרגים

אוגוסט 2026

עודכן

2

עד סיום · שלנו

מסלול הלימוד

שבעה קורסים ברצף אחד

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

קורס 1

ברוכים הבאים למסלול React

0.8ש׳

קורס 2

יסודות React

14.3ש׳

קורס 3

React ברמת ביניים

19.7ש׳

קורס 4

React ו-Redux

26.5ש׳

קורס 5

ברכות על הסיום

0.2ש׳

קורס 6

React Native (לימודי העשרה)

17.8ש׳

קורס 7

Git ו-GitHub

6.8ש׳

1ברוכים הבאים למסלול React0.8 שעות
  • היכרות עם המסלול שלך — מה מצפה לך ואיך מצליחים בו.
  • איך לקבל עזרה — חמש דקות קריאה על הדרכים לקבל עזרה בתוכן ובפרויקטים.
2יסודות React14.3 שעות
  • למה React — למה הספרייה נבנתה ואילו מושגים של JavaScript פונקציונלי משמשים בה.
  • רינדור ממשק עם React — בניית רכיבים חוזרים ושימוש ב-JSX ליצירת רכיבי ממשק.
  • ניהול מצב — ניהול מצב באפליקציה בעזרת props, useState ורכיבים מבוקרים.
  • הוקים — איך הוקים מאפשרים מצב ומחזור-חיים בתוך רכיבי React.
  • ניתוב — ניתוב באפליקציות עמוד-יחיד בעזרת React Router.
  • זרימת נתונים ומצב משותף — הרמת מצב משותף, הימנעות מהעברת props לעומק ושימוש ב-Context.
  • פרויקטאפליקציה למעקב ספרים
3React ברמת ביניים19.7 שעות
  • מבוא ל-React ברמת ביניים — מה תלמד בקורס, מה נדרש מראש ובאילו כלים וסביבה תעבוד.
  • ארכיטקטורה לאפליקציות ייצור — איך ארכיטקטורה שומרת על אמינות, תחזוקתיות ופריסות בטוחות ככל שהמורכבות גדלה.
  • ניתוב מודרני ב-React — React Router מגרסה 6 ומעלה: ניתוב בצד-הלקוח, מסלולים מקוננים ותבניות פריסה.
  • יישום תבניות ניתוב מתקדמות — מסלולי פריסה, פרמטרים ופרמטרי-חיפוש לאפליקציות מונחות-מצב.
  • מערכות רכיבי ממשק מודרניות — ספריות חסרות-עיצוב, הרכבה מול הגדרה, והתאמה דרך מערכת עיצוב.
  • בניית ממשק עם shadcn/ui וטיילווינד — רכיבים חוזרים, פריסות רספונסיביות, נגישות ומצב כהה.
  • טיפול בשגיאות ומצבי טעינה — ממשק עמיד עם הודעות ברורות, פעולות שחזור ומעקב בסיסי.
  • יישום חוויית שגיאה וטעינה — Error Boundaries, שלדי-טעינה והודעות שגיאה ידידותיות למשתמש.
  • מצב מרוחק מול מצב מקומי — ההבדל בין מצב שמגיע מהשרת למצב שנשמר באפליקציה, ומתי משתמשים בכל אחד.
  • יסודות React Query — ניהול מצב-שרת עם שאילתות, מטמון, סנכרון ברקע וכלי פיתוח.
  • התקנה ומשיכת נתונים עם React Query — שימוש ב-useQuery וטיפול במצבי טעינה, שגיאה וריקנות.
  • תבניות שאילתה מתקדמות ואופטימיזציה — שאילתות תלויות ומקבילות, טעינה מוקדמת, ביטול מטמון וכוונון ביצועים.
  • יישום יכולות שאילתה מתקדמות — מפתחות דינמיים, שאילתות תלויות וסינון מסונכרן לכתובת ה-URL.
  • useReducer למצב מורכב — ריכוז לוגיקת העדכון בפעולות וב-reducers טהורים לצורך התנהגות צפויה ובדיקות.
  • בניית reducer למצב האפליקציה — עיצוב, כתיבה ושילוב של reducer עם עדכונים טהורים ובלתי-משתנים.
  • שמירת מצב ובוררים — שמירה בטוחה של המצב, טעינה מחדש, מצב נגזר וממואיזציה (memoization).
  • שילוב Context, reducer ושמירת מצב — ניהול מצב משותף שנשמר, בלי לפגוע בטוהר ה-reducers.
  • הזדהות והרשאות — תהליכי התחברות, ניהול סשן וטוקנים, פקיעה, חידוש וביטול גישה.
  • יישום הזדהות בעזרת Context — מצב הזדהות משותף, שמירת טוקן, התחברות והתנתקות ואימות טפסים.
  • הגנה על מסלולים ומסכים — שליטה בגישה, הפניה אחרי התחברות וחזרה לנקודה שבה המשתמש היה.
  • יישום מסלולים מוגנים וממשק מודע-הרשאות — ניווט בטוח שמותאם למצב ההזדהות של המשתמש.
  • שינויי נתונים (Mutations) — ההבדל בין שאילתה לשינוי, ושמירה על ממשק עקבי בזמן עדכון.
  • יישום שינויים ועדכונים אופטימיים — עדכון מטמון, ממשק אופטימי וחזרה לאחור בכישלון.
  • שיפור ביצועים ב-React — זיהוי בעיות רינדור, מימואיזציה, מעברים ופיצול קוד.
  • יישום שיפורי ביצועים — פרופיילינג, ייצוב props, הפחתת רינדורים מיותרים ושמירה על ממשק מגיב.
  • בדיקות באפליקציות React — פירמידת בדיקות מאוזנת והתמקדות בהתנהגות שהמשתמש באמת רואה.
  • כתיבת בדיקות עם Vitest וספריית הבדיקות — ארגון בדיקות יחידה, בדיקות הוקים ובדיקות אינטגרציה.
  • בנייה ופריסה לייצור — בניית אפליקציית Vite, משתני-סביבה, בדיקת איכות ו-CI/CD ב-Vercel או ב-Netlify.
  • פרויקטחנות מקוונת ב-React
4React ו-Redux26.5 שעות
  • מבוא לקורס — מבנה הקורס, דרישות הקדם, הכלים והצצה לפרויקט הסיום.
  • ניהול מצב — העברת המצב למקום מרכזי וקביעת כללים נוקשים לקריאה, להאזנה ולעדכון.
  • ממשק ו-Redux — בניית אפליקציית JavaScript שהמצב שלה מנוהל כולו ב-Redux במקום ב-DOM.
  • מידלוור ב-Redux — כתיבת מידלוור משלך שמיירט פעולות לפני שהן מגיעות ל-reducers.
  • Redux עם React — חיבור React לאפליקציית Redux כך שהמצב מנוהל בחנות אחת.
  • Redux אסינכרוני — בניית מידלוור Thunk משלך לטיפול מסודר באירועים אסינכרוניים.
  • חיבורי React-Redux — שימוש בספריית הקישור כדי לחבר בין ספריית הממשק לספריית ניהול המצב.
  • יישום React עם Redux — בניית אפליקציה אמיתית, הרכבת reducers ונרמול נתונים.
  • בדיקות עם Jest — התקנה והרצה של Jest על פונקציות סינכרוניות ואסינכרוניות, סנאפשוטים ובדיקות DOM.
  • פרויקטאפליקציית סקרים לעובדים
5ברכות על הסיום0.2 שעות
  • ברכות! — סיום המסלול וציון ההישג.
6React Native (לימודי העשרה)17.8 שעות
  • מבוא ל-React Native — הצצה למושגי היסוד ולפרויקט של הקורס.
  • מסכים ועיצוב בנייד — בניית תצוגות גמישות לנייד ועיצובן.
  • ניווט ב-React Native — היכרות עם עקרונות הניווט בנייד, הוספת ספרייה ותכנון המבנה.
  • ניהול נתונים עם Redux — הקמת Redux Toolkit, בניית טופס ושליחתו ומעבר בין מסכים.
  • יכולות מכשיר — הרשאות, התראות דחיפה והכנה לפרסום האפליקציה.
  • פרויקטאפליקציית ניהול לקוחות לנייד
7Git ו-GitHub6.8 שעות
  • מהי בקרת גרסאות — היתרונות של בקרת גרסאות והתקנת Git על המחשב שלך.
  • יצירת מאגר Git — איך מקימים מאגר חדש אחרי שההתקנה מוכנה.
  • קומיטים, תגיות והתנגשויות — סקירת היסטוריית הקומיטים של מאגר קיים.
  • מאגרים מרוחקים ומאגרי מפתחים — פיצול (fork) של פרויקט של מפתח אחר ותרומה לפרויקט ציבורי.
  • כתיבת קובצי README — חשיבות התיעוד וכתיבת README משמעותי למאגר.

איפה זה ממקם אותך

מה תדע לעשות לבד

  • לנהל מצב ומסכים ב-React 19, עם דף חיפוש חי שמסונכרן לדף הראשי
  • לבנות חנות עם עגלה, מסך תשלום מאחורי התחברות מדומה והזמנה, ולנהל מצב-שרת עם React Query
  • לנהל מצב אפליקציה ב-Redux ולכתוב לו בדיקות יחידה ב-Jest
  • לבנות אפליקציה לנייד ב-React Native, עם טפסים ומעבר בין מסכים

מה יישאר לך ביד

4 פרויקטים שמוגשים לבדיקה

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

  1. 01

    יסודות React

    אפליקציה למעקב ספרים

    שלושה מדפים קבועים באפליקציה: קורא עכשיו, רוצה לקרוא וכבר קראתי. בקרת-מדף לכל ספר, כשברירת המחדל היא המדף שהספר נמצא בו כרגע. דף חיפוש נפרד בכתובת /search, עם חיפוש חי ואפשרות להוסיף ספר למדף. מצב עקבי בין הדף הראשי לדף החיפוש — שינוי בצד אחד מופיע בצד השני.

  2. 02

    React ברמת ביניים

    חנות מקוונת ב-React

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

  3. 03

    React ו-Redux

    אפליקציית סקרים לעובדים

    אפליקציה שבה עובדים מפרסמים סקרים ועונים עליהם, ולוח שמדרג את העובדים לפי מספר הסקרים שיצרו ושענו עליהם. מוגש כאפליקציית ווב (עדיף ב-GitHub) עם בדיקות יחידה ב-Jest.

  4. 04

    React Native (לימודי העשרה)

    אפליקציית ניהול לקוחות לנייד

    אפליקציה שבה אנשי מכירות מוסיפים ומעדכנים פרטי קשר של לקוחות. מוגש כמאגר GitHub או zip עם App.js, קובץ README ומבנה תיקיות מוגדר.

החסם של האנגלית

יש בכיתה עוזר שמדבר עברית

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

?

כל שאלה על מה שכתוב בעמוד

למשל: "תסביר לי במילים פשוטות את המושג שמופיע כאן". התשובה מתייחסת לשיעור שפתוח מולך.

✓

סיכום, ואז בוחן

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

מארווין — העוזר בעברית בתוך הכיתה של אודסיטי
שאלנו את מארווין בעברית בתוך הכיתה — והוא ענה בעברית.

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

אחרי המסלול

לאיזו עבודה זה מספיק בישראל

מפתח/ת צד-לקוח (Frontend)

מה עושים בו ביום-יום

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

מה המסלול נותן

ארבע אפליקציות שעוברות בדיקה אנושית: ניהול מצב ומסכים ב-React 19 עם Vite, חנות עם React Query וניהול מצב ב-Context ו-Reducer, אפליקציית סקרים ב-Redux עם בדיקות Jest, ואפליקציית React Native לנייד. זה חלק בניית-המסכים של התפקיד. חיבור למערכת קיימת, עבודה מעיצוב ב-Figma ועבודת צוות — לא נמצאים כאן.

מה עוד תצטרך

תיק-עבודות ו-GitHub לא נדרשו באף מודעת פרונט שבדקנו. חיפשנו במפורש 'GitHub', 'תיק עבודות', 'פורטפוליו' ו-portfolio במודעות שאספנו, ולא מצאנו אף התאמה. מה שכן נדרש במקומם: (1) היכולת להסביר בעל-פה קוד שכתבת — 'יכולת להסביר פיצרים, APIs, שירותים או קומפוננטות שפותחו באופן אישי' כסעיף-חובה; (2) כניסה לקוד של אחרים — 'ניסיון בכניסה לפרויקטים קיימים, תחזוקה ופיתוח שלהם (ולא רק הקמה של פרויקטים מאפס)' — וזו בדיוק הפעולה שקורס לא מלמד, כי כל פרויקט-קורס מתחיל בתיקייה ריקה; (3) שימוש ביקורתי בכלי-AI, כסעיף-סינון; (4) עבודה בתוך תהליך-צוות: Code Review, ספרינטים; (5) אחריות על מה שרץ בייצור. ולבסוף — לא מצאנו אף מודעת-פרונט לכניסה בלי ניסיון, ולא מודעה שמקבלת קורס במקום תואר.

מפתח/ת מובייל

מה עושים בו ביום-יום

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

מה המסלול נותן

רק את React Native, כלימודי רשות: אפליקציית ניהול-לקוחות לנייד עם מעבר בין מסכים, טפסים, הרשאות והתראות. אין כאן שפת-אם של הפלטפורמה (Kotlin או Swift), ואין פרסום בפועל בחנות.

מה עוד תצטרך

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

✓זה בשבילך אם…

אתה כבר כותב JavaScript ומכיר HTML, CSS ושורת-פקודה, ורוצה לעבור ל-React בצורה מסודרת; אתה צריך תוצרים שמישהו בדק — ארבע אפליקציות שעברו בדיקה אנושית מול רובריקה; ואתה יכול להקצות 6 עד 8 שעות בשבוע לאורך כחודשיים עד חודשיים וחצי.

לפני שמחליטים

מה זה לא נותן

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

שאלות ותשובות

צריך לדעת React לפני שמתחילים?

לא. React, Redux ו-React Native נלמדים מאפס בתוך המסלול. מה שכן נדרש מראש: JavaScript ברמת ביניים כולל קוד אסינכרוני, HTML ו-CSS, שורת-פקודה בסיסית, NodeJS ובקרת גרסאות. קורס Git ו-GitHub שבסוף המסלול הוא קורס רשות — לרענון, לא לימוד מאפס.

כל התוכן באנגלית — איך מתמודדים?

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

מי בודק את הפרויקטים שאני מגיש?

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

כמה זמן זה באמת לוקח?

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

האם הפרויקטים מלמדים אבטחה אמיתית?

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

החלק של React Native הוא חובה?

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

61 שעות, ארבעה פרויקטים, תיק אחד

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

לעמוד המסלול באודסיטי ←

הרשמה ותמחור מתבצעים אצל אודסיטי · קישור שיווקי · אנחנו לא מוכרים את הקורס

מקורות

  1. אודסיטי — עמוד המוצר הרשמי של מסלול React (nd019), נמדד ב-8.9.2026.
  2. הוראות הפרויקט והרובריקה בתוך הכיתה של אודסיטי — אפליקציה למעקב ספרים, נקרא ב-8.9.2026.

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

מסלול Nanodegree בפיתוח ממשקים ב-React — אודסיטי 61 שעות · ארבעה פרויקטים · 4.7 ★ לעמוד המסלול ←
גילוי נאות: התוכן באתר אינו ייעוץ פיננסי, פנסיוני, מסים או השקעות. החלטות פיננסיות אישיות מומלץ לקבל בליווי בעל מקצוע מוסמך.

להמשיך מכאן

4 המשכים · חינוך והשכלה