تطوير Next.js
Next.js Development
إتقان Next.js لإنشاء تطبيقات React كاملة مع SSR و SSG ومسارات API
مستوى الصعوبة
intermediate
المدة المتوقعة
عدد المراحل
3
📋المتطلبات الأساسية
- •React
- •JavaScript ES6+
- •HTML/CSS
- •أساسيات Node.js
مراحل المسار التعليمي
1
المرحلة 1: أساسيات Next.js
تعلم التوجيه والصفحات وأساسيات Next.js
أساسيات Next.js
📚المواضيع الرئيسية:
- •تثبيت Next.js
- •App Router vs Pages Router
- •التوجيه المبني على الملفات
- •الصفحات والتخطيطات
- •التنقل (Link)
- •الصور (next/image)
- •الخطوط (next/font)
💡أمثلة عملية ستطبقها:
- ✓تطبيق متعدد الصفحات
- ✓التنقل
- ✓صور محسنة
استراتيجيات العرض
📚المواضيع الرئيسية:
- •العرض من جانب الخادم (SSR)
- •توليد الموقع الثابت (SSG)
- •التجديد الثابت المتزايد (ISR)
- •العرض من جانب العميل
- •العرض الهجين
- •getStaticProps
- •getServerSideProps
💡أمثلة عملية ستطبقها:
- ✓صفحات SSR
- ✓صفحات ثابتة
- ✓ISR ديناميكي
جلب البيانات
📚المواضيع الرئيسية:
- •Server Components
- •Client Components
- •fetch API
- •تخزين البيانات مؤقتًا
- •إعادة التحقق
- •حالات التحميل
- •معالجة الأخطاء
💡أمثلة عملية ستطبقها:
- ✓جلب البيانات
- ✓واجهة المستخدم للتحميل
- ✓حدود الأخطاء
2
المرحلة 2: مسارات API والخلفية
إنشاء APIs ودمج وظائف الخلفية
مسارات API
📚المواضيع الرئيسية:
- •معالجات المسار
- •نقاط نهاية API
- •الطلب/الاستجابة
- •معاملات المسار
- •المسارات الديناميكية
- •الوسائط
- •Edge runtime
💡أمثلة عملية ستطبقها:
- ✓REST API
- ✓نقاط نهاية ديناميكية
- ✓وسائط API
المصادقة
📚المواضيع الرئيسية:
- •NextAuth.js
- •إدارة الجلسة
- •رموز JWT
- •OAuth providers
- •مصادقة الاعتماد
- •المسارات المحمية
- •الوصول على أساس الدور
💡أمثلة عملية ستطبقها:
- ✓نظام المصادقة
- ✓تسجيل دخول OAuth
- ✓صفحات محمية
تكامل قاعدة البيانات
📚المواضيع الرئيسية:
- •Prisma ORM
- •إعداد قاعدة البيانات
- •النماذج والمخططات
- •عمليات CRUD
- •العلاقات
- •الترحيلات
- •استعلامات قاعدة البيانات
💡أمثلة عملية ستطبقها:
- ✓نماذج قاعدة البيانات
- ✓API مع DB
- ✓CRUD كامل
3
المرحلة 3: الإنتاج والتحسين
تحسين ونشر تطبيقات Next.js
تحسين الأداء
📚المواضيع الرئيسية:
- •تقسيم الكود
- •تحسين الحزمة
- •تحسين الصور
- •تحسين الخطوط
- •استراتيجيات التخزين المؤقت
- •التحميل البطيء
- •مراقبة الأداء
💡أمثلة عملية ستطبقها:
- ✓تطبيق محسن
- ✓ضبط الأداء
- ✓درجات Lighthouse
الميزات المتقدمة
📚المواضيع الرئيسية:
- •التدويل (i18n)
- •الوسائط
- •Metadata API
- •توليد Sitemap
- •خلاصات RSS
- •التحليلات
- •تحسين SEO
💡أمثلة عملية ستطبقها:
- ✓تطبيق متعدد اللغات
- ✓محسن لـ SEO
- ✓تكامل التحليلات
النشر
📚المواضيع الرئيسية:
- •نشر Vercel
- •نشر Docker
- •متغيرات البيئة
- •CI/CD
- •المراقبة
- •تتبع الأخطاء
- •أفضل ممارسات الإنتاج
💡أمثلة عملية ستطبقها:
- ✓نشر الإنتاج
- ✓خط CI/CD
- ✓إعداد المراقبة
هل أنت مستعد لبدء رحلتك التعليمية؟
انضم إلى آلاف المتعلمين الذين بدأوا رحلتهم معنا واحصل على دعم مباشر من خبراء المجال
نصائح للنجاح في هذا المسار
💪
الممارسة المستمرة
اعمل على مشاريع عملية بانتظام لتطبيق ما تعلمته
👥
انضم لمجتمع
تواصل مع متعلمين آخرين وشارك تجربتك وتعلم منهم
📝
دوّن ملاحظاتك
احتفظ بسجل لما تعلمته وارجع إليه عند الحاجة
🎯
حدد أهدافاً واضحة
قسّم المسار إلى أهداف صغيرة واحتفل بإنجازاتك