كلام جميل بس في كذة نقطة في الفيديو مش حقيقة: React كان فيها SSR قبل وجود NextJS و كان في functions زي مثلا hydrate بتشتغل علي الserver قبل وجود NextJS و دي بالمناسبة القائم عليها NextJS. وصفك للSSR بردو مش مظبوط في نص القيديدو، الSSR مش بيحسب اي نوع من انواع الdistance او المسافات او ما الي ذلك، الserver بيرجع markup و الbrowser في الحالة دي بيقوم بعملية الhydration و بعدين كل الحسابات و الlayout calculations بتقوم في الbrowser عادي Concepts الSSG موجودة منذ قديم الأزل، بردو باستعمال functions زي hydrate او server rendering functions من react نفسها الكلام بشكل عام جميل بس هو مجرد وصف خارجي، و ده في حد ذاته ممكن يكون مفيد بس المعلومات ال فيه بتبقي مش دقيقة او سعات غلط.
شكرا على الاضافة.✌️🚀 للتوضيح فان الهدف من هذا النوع من الفيديوهات هو زيادة الوعي .. فانت ما شاء الله عندك التعمق .. غيرك لا يعلم اصلا ان فيه مثل هذه الحاجات متواجدة .. فهدفي هو التبسيط والتنوير لهذه المعلومات .. فاذا شرحت الموضوع بتعمق لن يستطيع الناس فهم ما اقول بالنسبة لمرحلة معينة تشكل النسبة الكبيرة من الناس. واحترم اي تعليق او اضافة يساعد على زيادة الوعي 🌹👌🏻
شكرا جداا على الاضافة القيمة ❤ .. استأذن حضرتك ..بس فيه جزئية اتمنى تشرحها في فيديو تاني.. اكتر حاجة بتزعجني في النيكست انه ممنوع استخدام الhooks في server side rendered فعشان كده كنت مش بستخدم الخاصية دي وكنت بخلي كل استخدامي client components علشان اعرف استخدم usestate وغيرها ...
لو سمحتم يا جماعة انا دلوقتى ذاكرت رياكت ونيكست وداخل على مرحلة عمل مشاريع للتطبيق فانا دلوقتى اركز على مشاريع النيكست فقط ولا اعمل مشاريع على الاتنين علما بأني overage فمفيش قدامي غير الفريلانس ارجو الافادة وشكرا
لو سمحت يا باشمهندس انا بتعلم علشان اكون فرونت ايند و دلوقتي في مرحله اختيار الفريم وورك و مش عارف اختار انهي مع اني شوفت فيديوهات كتيره بس بردو محتار ياريت فيديو عن مجال الفرونت ايند بالذات السوق المصري طالب انهي فريم اكتر ومثلا ترشيحات لقنوات او كورسات و هكذا
روح للرياكت مباشرة لانة سهل في التعلم والطلب علية كبير في السوق ، وعشان انة سهل بتلاقي المحتوى التعليمي والشرحات بكميات ضخمة على اليوتيوب وغيرة من المنصات التعليمية وبعد ما تحس نفسك كويس برياكت وتاسست صح فية ، بيكون سهل تنتقل لاي فريمورك ثاني فيما بعد على حسب شغلك او مشروعك
البطأ والسرعة مسألة تتعلق بكيف تم استخدامه في التطور والbusiness case التي تم التطوير لها .. فنفس الشئ مع رياكت قد يكون بطئ وقد يكون سريع .. لا يمكن ان نجزم ان تقنية في المطلق سريعة او بطيئة.
بس يا هندسا مش السيرفر سايد ريندرينج بيحصل مع اول صفحة فقط ؟ لا يحدث طول الوقت لانهم عايزين يصدرو اول صفحة عشان شغل السيو لكن باقى الصفحات بتشتغل كلاينت سايد ريندرنج عادى
شكرا يحي انا لو حابب اتخصص فى تصميم صفحات الهبوط وfunnels برايك اى مجال ادرسة بشكل افضل واى منصة ابنى علىها ذالك ويكون لها مستقبل وعليها طلب فى السوق واىهما تفضل بخبرتك ـ انا اريد اكون محترف فى هذة المهارة والتخصص ما هى نصيحتك والمسار التعليمى لذالك وافضل ادوات تساعد فى ذالك شكرا لك وبارك الله فيك
رأي لو انت لسة بتبدأ وداخل جديد في الفرونت اند ومش متمكن اووي من React.js .. يعني هتتعب من توفيق الاختيارات مع بعضها في React.js لوحده بتاعت كل حاجة والFolder Structure وما الى ذلك .. فافضل طبعا Next.js لان كل حاجة هتلاقي المنهجية بتاعتها موجودة في الDocumentation عندهم. --- وفي العموم في معايير تانية كتيير طبعاً بخلاف المعيار اللي انا ذكرته فوق .. فده مجرد بس لتبسيط الاجابة. دايما المحرك في الشركات عوامل كتيرة زي الResources والScalability والMaintaiability والخ...
بصراحة حلقة مهمةجدا والله، خاصة عند شرح client side, server side rendering. فعلا الشرح مهم جدا و طريقة الشرح سهلة و مبسطة و مفهومة. سؤال سريع. ذكركتم أن رياكت قبل ١٩، لا يحتاج إلى سرفر بل يمكن أن رفعه علىS3 Amazon أو azure app service. وذا الكلام صحيح. استفساري هو، لو أن تطبيق الرياكت الخاص بي مربوط بقاعدة بيانات. الا احتاج حينئذ أن أرفع التطبيق على IIS داخل server وكذلك قاعدة البيانات؟
عادة انت بتعمل compile او بمعنى اصح transpile لملفات الjsx او الtsx الخاصة برياكت الي ملفات html وcss وjavascript .. فهذه كده ملفات الfrontend وتقدر ترفعها على S3 وتربطها على cloudfront للcaching .. اما الباك اند اللي هتتكلم معاه ملفات الjs اللي خرجت لازم يكون اكيد مرفوع على سيرفر حسب التقنية الخاصة بيه .. وغالبا انهاردة بتعمل Docker Container للاستضافة وترفعها برده على Amazon على خدمة ECS او EKS بحيث تضمن بيئة تشغيل مبسطة وسليمة. وبتدي للفرونت اند الEndpoint في الEnvironment Variables وبس بيشتغل معاك تمام بغض النظر كل واحد معمولة استضافة فين. فهو المغزى انه ممكن تستضيف الفرونت اند في مكان ليس له علاقة بالباك اند وكله يشتغل معاك مظبوط. وقد اغطي كلام اكثر عن هذا الموضوع في فيديو قادم ان شاء الله
@@yehiatech شكرا على الإجابة. فعلا تفصيل جميل و إجابة واضحة. اتضح لي أنه يمكن رفع الفرونتد اند ك رياكت في S3 مثلا حتى لو كان مربوط بقاعدة بيانات، لأنه بإمكاننا أن نرفع الباك اند و قاعدة البيانات في مكان تاني خالص بدون أي مشكلة. والله ياريت تعمل فيديو مطول شوي عن هذا الموضوع. فعلا شيق و طريقة شرحك فيها فوائد كثيرة.
انا شغال كا فول ستاك بس دايما بميل اكتر للباك اند وبلاقي انه اسهل بكتير من الفرونت مفيش تعقيد كتير انا فقط بكتب كود علي عكس الفرونت بحس دايمآ انه محتاج حجات كتير مع بعض واذاكر اكتر من حاجة في نفس الوقت علشان اعمل حاجة اقدر اقول عليها نضيفة مش عارف هل انا عندي مشكلة في النقطة ولا ده طبيعي
@@A-Zaydan الصراحة ممكن اه لان انا شغال ب nodejs و express و mongodb ده الأساس عندك ولو عايز تضيف مثلى authentication عندك jwt فتقدر تقول ان باستخدام الحجات دي بس تقدر تعمل اكتر من كونسبت في ال apps بس علي النقيض في الفرونت لازم react ثم routing ثم state management ثم integration بال api ثم styling وال styling اصلا لوحده حوار تحتار مبين اكتر من حاجة ant design ولا styled components غير ال responsive غير انك مطالب تتعلم animation شوية علشان الحركة في الويبسايت فيه فعلا حجات كتير بتدور في الفرونت
وبعدين انا نسيت اقولك الفرونت بيتغير كل شوية كل فكرة هتضطر تعملها design ثم implementation بس الباك انا حرفيا كوبي بيست من مشاريع كنت عملتها بتناقش جزئية معينة فبخادها وبعملها تعديلات بسيطة ده اصلا لو محتاجة تعديلات
شكرا لانك من الناس القليلة يلي بتنزل محتوى High quality و بتشرح حاجات احترافية باللغة العربية🩵
كلام جميل بس في كذة نقطة في الفيديو مش حقيقة:
React
كان فيها SSR قبل وجود NextJS و كان في functions زي مثلا hydrate بتشتغل علي الserver قبل وجود NextJS و دي بالمناسبة القائم عليها NextJS.
وصفك للSSR بردو مش مظبوط في نص القيديدو، الSSR مش بيحسب اي نوع من انواع الdistance او المسافات او ما الي ذلك، الserver بيرجع markup و الbrowser في الحالة دي بيقوم بعملية الhydration و بعدين كل الحسابات و الlayout calculations بتقوم في الbrowser عادي
Concepts الSSG موجودة منذ قديم
الأزل، بردو باستعمال functions زي hydrate او server rendering functions من react نفسها
الكلام بشكل عام جميل بس هو مجرد وصف خارجي، و ده في حد ذاته ممكن يكون مفيد بس المعلومات ال فيه بتبقي مش دقيقة او سعات غلط.
شكرا على الاضافة.✌️🚀
للتوضيح فان الهدف من هذا النوع من الفيديوهات هو زيادة الوعي .. فانت ما شاء الله عندك التعمق .. غيرك لا يعلم اصلا ان فيه مثل هذه الحاجات متواجدة .. فهدفي هو التبسيط والتنوير لهذه المعلومات ..
فاذا شرحت الموضوع بتعمق لن يستطيع الناس فهم ما اقول بالنسبة لمرحلة معينة تشكل النسبة الكبيرة من الناس.
واحترم اي تعليق او اضافة يساعد على زيادة الوعي 🌹👌🏻
ممكن لو سمحتوا تبعتوا كورس كامل يُفضل بالعربي أو انجلش وحديث للreact وnext.js
والله يااخي اتابعك على انستغرام على linkedIn على يوتيوب ،عندك طريقة شرح ماتنشبع وممتازة بارك الله فيك
شكرا حقيقي كنت محتاج الفيديو ده ونزل في وقته
فيديو رائع...محتوى عربى فوق الممتاز❤
شكرا جداا على الاضافة القيمة ❤ .. استأذن حضرتك ..بس فيه جزئية اتمنى تشرحها في فيديو تاني.. اكتر حاجة بتزعجني في النيكست انه ممنوع استخدام الhooks في server side rendered فعشان كده كنت مش بستخدم الخاصية دي وكنت بخلي كل استخدامي client components علشان اعرف استخدم usestate وغيرها ...
في وقتو ي هندسه وربنا 😍💜
I love your content, shoukran!
حقيقي بتقدم محتوى عظيم جدا❤❤❤
ماتقولنا ازاي نعمل interceptor في نيكست مع fetch
يكون فيه refresh token
و refetch لكل الريكويستات ال وقعت قبل ال refresh token
جزاك الله كل خير باش مهندس بس في حاجة على راسك يا مهندسنا الغالي باينا في التصوير
لو سمحتم يا جماعة انا دلوقتى ذاكرت رياكت ونيكست وداخل على مرحلة عمل مشاريع للتطبيق فانا دلوقتى اركز على مشاريع النيكست فقط ولا اعمل مشاريع على الاتنين علما بأني overage فمفيش قدامي غير الفريلانس ارجو الافادة وشكرا
يا باشا لو استثنينا SEO ، الي يكسب فيه ناكست بدون جدال، ايه يخليني اختاره على حساب الرياكت؟
نفسي في الفيديو دا من زمان
ارجو لو كان في المستطاع كورس عن aws ، شرحك جميل و مفهوم
لو سمحت يا باشمهندس انا بتعلم علشان اكون فرونت ايند و دلوقتي في مرحله اختيار الفريم وورك و مش عارف اختار انهي مع اني شوفت فيديوهات كتيره بس بردو محتار
ياريت فيديو عن مجال الفرونت ايند بالذات السوق المصري طالب انهي فريم اكتر ومثلا ترشيحات لقنوات او كورسات و هكذا
روح للرياكت مباشرة لانة سهل في التعلم والطلب علية كبير في السوق ، وعشان انة سهل بتلاقي المحتوى التعليمي والشرحات بكميات ضخمة على اليوتيوب وغيرة من المنصات التعليمية وبعد ما تحس نفسك كويس برياكت وتاسست صح فية ، بيكون سهل تنتقل لاي فريمورك ثاني فيما بعد على حسب شغلك او مشروعك
Without the language of wood choice Angular or React
لو تقدر تتكلم عن Amazon SSS اكثر
حلقة ولا اروع
كنت اكرهك ليه وانت حلاوة كدا❤❤❤🙂
ال nextjs تقيل جدا على المتصفح وأحيانا بيهنج الجهاز أتمنى أن يتم تطوير ال React فقط مع اضافة خواص ال nextjs له
البطأ والسرعة مسألة تتعلق بكيف تم استخدامه في التطور والbusiness case التي تم التطوير لها .. فنفس الشئ مع رياكت قد يكون بطئ وقد يكون سريع .. لا يمكن ان نجزم ان تقنية في المطلق سريعة او بطيئة.
يمكن أنت تتحدث عن البطئ في مرحلة البرمجة صحيح هو أبطأ لكن بعد build يصبح أخف بكثير
Npm run dev --turbo
البطأ بيبقى على ال development server فقط بينما لماترفع المشروع على السيرفر نسخة production بيبقا فائق السرعة
فعلا react 19 في كل مميزات next js
بس يا هندسا مش السيرفر سايد ريندرينج بيحصل مع اول صفحة فقط ؟ لا يحدث طول الوقت لانهم عايزين يصدرو اول صفحة عشان شغل السيو لكن باقى الصفحات بتشتغل كلاينت سايد ريندرنج عادى
كل الشكر لك عالمجهود
يحيي ممكن تتكلم اكتر عن الاستضافات وهل ينفع استضيف اكتر من موقع .Net core على استضافة واحده
طب انا خلصت جافا سكريبت كفرونت اند اتعلم ريأكت بعدين نكست ولا اطبق على js لحد متنزل اصدار افضل من ريأكت وامضى عليه منغير نكست
react and then next
سؤال في link كيف اضهر البار الدي يكون في اعلى الصفحة متل فايسبوك
ياريت تتكلم عن vite , cra
محتاج تعرف ايه
Just ignore cra, and use vite
باش مهندس وين الموسم الثاني من تحدي البرمجة لو نحنا في The Voice كان نزل الموسم الثاني
الله ينور عليك
nextjs or laravel ? and why. please help me to choose, cause i want to specialize
There is no comparison
U can use them together
ازاي اقدر ادفع ع يوديمي وهل ينفع ادفع ع فودافون كاش مثلا وحضرتك تفعلي الكورس ع الايميل بتاعي
الواحد مبيلحقش يبدا ياخد حتي علي القديم هو في اييييييييييييييية
كل ما اعمل مشروع الاقي اصدار نزل
انت اسطورة
شكرا يحي انا لو حابب اتخصص فى تصميم صفحات الهبوط وfunnels برايك اى مجال ادرسة بشكل افضل واى منصة ابنى علىها ذالك ويكون لها مستقبل وعليها طلب فى السوق واىهما تفضل بخبرتك ـ انا اريد اكون محترف فى هذة المهارة والتخصص ما هى نصيحتك والمسار التعليمى لذالك وافضل ادوات تساعد فى ذالك شكرا لك وبارك الله فيك
يعطيك العافية وشكرا لشرحك ❤ بس انا هلق لساني ضايع هل ضل ب ريأكت او انقل ل next لان جربت next فيو شغلات مختلفة عن ريأكت كتير فحاسس حالي ح انسى ريأكت
اشوف مشكلة النيكست بالديبلوي .. صعب تنزله على vps
الا تقدر روح لقناه نور حمصي رفع مشروع next js
يعني لو عاوز اعمل موقع فاعمله في react js ولا next js من ناحية frontend
رأي لو انت لسة بتبدأ وداخل جديد في الفرونت اند ومش متمكن اووي من React.js .. يعني هتتعب من توفيق الاختيارات مع بعضها في React.js لوحده بتاعت كل حاجة والFolder Structure وما الى ذلك ..
فافضل طبعا Next.js لان كل حاجة هتلاقي المنهجية بتاعتها موجودة في الDocumentation عندهم.
---
وفي العموم في معايير تانية كتيير طبعاً بخلاف المعيار اللي انا ذكرته فوق .. فده مجرد بس لتبسيط الاجابة.
دايما المحرك في الشركات عوامل كتيرة زي الResources والScalability والMaintaiability والخ...
محتاجين كورس next يا هندسة
عامله علي القناة في كورس react
جاى فى وقتك
بصراحة حلقة مهمةجدا والله، خاصة عند شرح client side, server side rendering.
فعلا الشرح مهم جدا و طريقة الشرح سهلة و مبسطة و مفهومة.
سؤال سريع. ذكركتم أن رياكت قبل ١٩، لا يحتاج إلى سرفر بل يمكن أن رفعه علىS3 Amazon أو azure app service. وذا الكلام صحيح.
استفساري هو، لو أن تطبيق الرياكت الخاص بي مربوط بقاعدة بيانات. الا احتاج حينئذ أن أرفع التطبيق على IIS داخل server وكذلك قاعدة البيانات؟
عادة انت بتعمل compile او بمعنى اصح transpile لملفات الjsx او الtsx الخاصة برياكت الي ملفات html وcss وjavascript .. فهذه كده ملفات الfrontend وتقدر ترفعها على S3 وتربطها على cloudfront للcaching ..
اما الباك اند اللي هتتكلم معاه ملفات الjs اللي خرجت لازم يكون اكيد مرفوع على سيرفر حسب التقنية الخاصة بيه .. وغالبا انهاردة بتعمل Docker Container للاستضافة وترفعها برده على Amazon على خدمة ECS او EKS بحيث تضمن بيئة تشغيل مبسطة وسليمة.
وبتدي للفرونت اند الEndpoint في الEnvironment Variables وبس بيشتغل معاك تمام بغض النظر كل واحد معمولة استضافة فين.
فهو المغزى انه ممكن تستضيف الفرونت اند في مكان ليس له علاقة بالباك اند وكله يشتغل معاك مظبوط.
وقد اغطي كلام اكثر عن هذا الموضوع في فيديو قادم ان شاء الله
يا ريت بالفعل فيديو عن الموضوع ده ...خاصا ان فيه مصطلحات فى الكومنت بتاعك يا هندسة انا معرفش عنها كتير و اكيد فيه ناس زييى @@yehiatech
@@yehiatech
شكرا على الإجابة. فعلا تفصيل جميل و إجابة واضحة. اتضح لي أنه يمكن رفع الفرونتد اند ك رياكت في S3 مثلا حتى لو كان مربوط بقاعدة بيانات، لأنه بإمكاننا أن نرفع الباك اند و قاعدة البيانات في مكان تاني خالص بدون أي مشكلة.
والله ياريت تعمل فيديو مطول شوي عن هذا الموضوع. فعلا شيق و طريقة شرحك فيها فوائد كثيرة.
انا شغال كا فول ستاك بس دايما بميل اكتر للباك اند وبلاقي انه اسهل بكتير من الفرونت مفيش تعقيد كتير انا فقط بكتب كود علي عكس الفرونت بحس دايمآ انه محتاج حجات كتير مع بعض واذاكر اكتر من حاجة في نفس الوقت علشان اعمل حاجة اقدر اقول عليها نضيفة مش عارف هل انا عندي مشكلة في النقطة ولا ده طبيعي
يعنى الباك اند مفهوش تقنيات كتير؟
@@A-Zaydan
الصراحة ممكن اه لان انا شغال ب nodejs و express و mongodb ده الأساس عندك ولو عايز تضيف مثلى authentication عندك jwt فتقدر تقول ان باستخدام الحجات دي بس تقدر تعمل اكتر من كونسبت في ال apps بس علي النقيض في الفرونت لازم react ثم routing ثم state management ثم integration بال api ثم styling وال styling اصلا لوحده حوار تحتار مبين اكتر من حاجة ant design ولا styled components غير ال responsive غير انك مطالب تتعلم animation شوية علشان الحركة في الويبسايت فيه فعلا حجات كتير بتدور في الفرونت
وبعدين انا نسيت اقولك الفرونت بيتغير كل شوية كل فكرة هتضطر تعملها design ثم implementation بس الباك انا حرفيا كوبي بيست من مشاريع كنت عملتها بتناقش جزئية معينة فبخادها وبعملها تعديلات بسيطة ده اصلا لو محتاجة تعديلات
بس اظن اغلب سوق node js يتطلب انك تكون فول ستاك كفرى لانسر
@@A-Zaydan
علشان كدة اشتغلت فول ستاك بالرغم اننا مش حابب حتة الفرونت بس علشان ازود فرص العمل
❤
React 19 available?
Yes, RC: Release Candidate
سؤال علي فين ممكن اعرف 😢 وليه نحذفت الفيديوهات بتاعو 😢
ده بجد حذفوا فيديوهاته؟
Next js is very slow
reactjs is just more popular but technically sveltejs is more better.
Totally agree.
LARAVEL
RUBY افضل
اوحش حاجه ف الفيديو دا انه بيخلص