קורס Next.js למתחילים

קורס Next.js חינמי ואינטראקטיבי שלוקח אתכם מקומפוננטות React לאפליקציה אמיתית: ניתוב, layouts, קומפוננטות שרת ולקוח, שליפת נתונים ו־server actions. רמזי AI עוזרים כשנתקעים, ובסיום מקבלים תעודה חינמית.

להתחיל ללמוד(בחינם)

לצפייה בסילבוס היסודות של Next.js אונליין

1,529+ לומדים רשומים

47 שיעורים32 אתגרים99 שאלות חידון

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

סילבוס

1 יחידות1 פרויקטים47 שיעורים32 אתגרים99 שאלות חידון

היחידה הזו היא חלק ממסלול React. בסילבוס המלא יש עוד יחידות - לחצו על כל תצוגה מקדימה למטה כדי לראות אותה בדף המסלול.

יחידה 1יסודות42 שיעורים
יחידה 2
היסודות של Next.js
להתחיל את היחידהלהתחיללהרחיבלכווץעברו מרכיבי React לאפליקציה אמיתית: ניתוב מבוסס מערכת קבצים, פריסות, רכיבי שרת ורכיבי לקוח, שליפת נתונים, פעולות שרת ופרויקט Next.js מלא.47 שיעורים32 אתגרים99 שאלות1 פרויקט
למה Next.js
4 שיעורים39
01מה Next.js מוסיףאתגרחידון
02תיקיית appחידון
03הדף הראשון שלךאתגרחידון
04סיכום: למה Next.jsאתגר
ניתוב וקישורים
6 שיעורים516
01תיקיות הן נתיביםחידון
02נתיבים מקונניםאתגרחידון
03קישור בין דפיםאתגרחידון
04נתיבים דינמייםאתגרחידון
05דפים לא נמצאואתגרחידון
06סיכום: ניתובאתגר
פריסות ומטא־נתונים
6 שיעורים515
01פריסת השורשחידון
02ניווט משותףאתגרחידון
03פריסות מקוננותאתגרחידון
04מטא־נתונים של הדףאתגרחידון
05מטא־נתונים דינמייםאתגרחידון
06סיכום: פריסותאתגר
שרת ולקוח
6 שיעורים515
01שני סוגי רכיביםחידון
02קריאת השגיאהאתגרחידון
03השורה 'use client'אתגרחידון
04שמרו על חלקי הלקוח קטניםאתגרחידון
05שרת בתוך לקוחאתגרחידון
06סיכום: שרת ולקוחאתגר
נתונים בשרת
6 שיעורים516
01רכיבים אסינכרונייםאתגרחידון
02המתנה לפרמטרים של נתיבאתגרחידון
03שתי פעולות Fetch במקבילאתגרחידון
04מצבי טעינהאתגרחידון
05טיפול בשגיאותחידון
06סיכום: שליפת נתוניםאתגר
פעולות שרת
5 שיעורים413
01מהי פעולת שרתחידון
02טפסים שפועליםאתגרחידון
03קריאת נתוני טופסאתגרחידון
04רענון הדףאתגרחידון
05סיכום: פעולות שרתאתגר
ניווט בצד הלקוח
5 שיעורים515
01הקישור הפעילאתגרחידון
02ניתוב באמצעות קודאתגרחידון
03סינון באמצעות כתובת ה-URLאתגרחידון
04מטפלי נתיביםאתגרחידון
05סיכום: ניווטאתגר
פרויקט: Coddy Eats
פרויקט9 שיעורים
01שלב 1: המעטפתפרויקט
02שלב 2: רשת התפריטפרויקט
03שלב 3: עמודי המנותפרויקט
04שלב 4: מצב טעינהפרויקט
05שלב 5: כותרות העמודיםפרויקט
06שלב 6: הוספה לעגלהפרויקט
07שלב 7: סינון לפי קטגוריהפרויקט
08שלב 8: השארת ביקורתפרויקט
09שלב 9: חיפוש בזמן אמתפרויקט

לצפייה בסילבוס המלא של מסלול React

מה מקבלים

כל מה שתשתמשו בו כדי ללמוד לתכנת

ללמוד תוך כדי עשייה

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

playground.js

עורך קוד

1const greeting = "Hello, Coddy!"

2function sayHi(name) {

3 return greeting + " " + name

בדיקה #1

בדיקה #2

בדיקה #3

קלט

"Alex"

פלט

"Hello, Coddy! Alex"

לבנות רצף

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

12 ימי רצף

חזרו מחר כדי לשמור על הרצף!

January 2026

הכל או כלום

יום 5 מתוך 7

הקפאת רצף

2 left

לתכנת מכל מקום

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

250

משתנים

להמשיך

4.9

דירוג

אתם לא לבד

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

ליגת המתמודדים7 המובילים עולים

Alex7+ Days

2840

Jordan7+ Days

2650

Sam7+ Days

2420

Casey

2180

Morgan7+ Days

1950

אזור העלייה

כל הדרכים ללמוד

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

מבוא למשתנים

אודיו

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

ב-Python יוצרים משתנה על ידי כתיבת השם, סימן שווה, ואז הערך שרוצים לשמור.

הערך יכול להשתנות עם הזמן - השמה מחדש לאותו שם פשוט מפנה אותו לערך חדש.

1xשרה

לקבל תעודה

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

תעודת סיום

תעודה זו מאשרת כיישראל ישראליהשלים/ה בהצלחה את

יסודות Python

תאריךינו׳ 2026

להוסיף ל-LinkedIn

למה ללמוד Next.js עם Coddy

בנו אפליקציות Next.js בדפדפן. בלי התקנת Node, בלי create-next-app, בלי קונפיגורציה: כל שיעור נותן לכם תיקיית app אמיתית עם layout, דפים וקומפוננטות לערוך.
ה־App Router כפי שמשתמשים בו בפרודקשן: תיקיות כנתיבים, מקטעים דינמיים, layouts מקוננים, קומפוננטות שרת מול קומפוננטות לקוח, שליפת נתונים, מצבי טעינה ושגיאה, וטפסים עם server actions.
רמזי AI שקוראים את הקוד שלכם בפועל. כשנתיב מחזיר 404 או שקומפוננטת שרת נשברת, אתם מקבלים דחיפה שמצביעה על הבעיה בלי לגלות את התשובה.
תעודה חינמית בסיום היחידה: Next.js הוא ה־framework המבוקש ביותר ל־React, וזה מה שמודעות דרושים מודרניות ל־Frontend מבקשות לצד React עצמה.

שאלות נפוצות על לימוד Next.js

מה זה Next.js?

Next.js הוא framework של React לבניית אפליקציות ווב מלאות. React נותנת לכם קומפוננטות; Next.js מוסיף את כל מה שמסביבן: ניתוב מבוסס מערכת קבצים, layouts מקוננים, רינדור בצד השרת, שליפת נתונים ו־server actions לטיפול בטפסים ובשינויי נתונים. הוא נבנה ומתוחזק על ידי Vercel, וזה ה־framework של React הנפוץ ביותר בפרודקשן.

צריך לדעת React לפני שלומדים Next.js?

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

האם הקורס מכסה את ה־App Router?

כן. היחידה בנויה סביב ה־App Router המודרני: תיקיית app, תיקיות כנתיבים, מקטעי נתיב דינמיים, layouts מקוננים ומודל קומפוננטות השרת והלקוח. זו הארכיטקטורה שפרויקטי Next.js חדשים משתמשים בה כברירת מחדל, ומה שמודעות דרושים עכשוויות מצפות לו.

מה ההבדל בין קומפוננטות שרת לקומפוננטות לקוח?

קומפוננטות שרת מתרנדרות בשרת: הן יכולות לשלוף נתונים ישירות ושולחות פחות JavaScript לדפדפן. קומפוננטות לקוח רצות בדפדפן ומטפלות באינטראקטיביות: state, אירועים, effects. אפליקציות Next.js משלבות את שתיהן, והיכולת לדעת במה לבחור היא אחת ממיומנויות הליבה שהיחידה הזו מתרגלת.

אפשר ללמוד Next.js אונליין בחינם?

כן. יחידת ה־Next.js האינטראקטיבית חינמית: שיעורים מלאים, אתגרי קוד אמיתיים עם משוב מיידי ורמזי AI. הכול רץ בדפדפן, כך שלא צריך להתקין Node או להקים פרויקט כדי להתחיל.