วีดีโอ

في الحلقة معانا حسيني وبنتكلم عن الـ Watchers في Vue.js وحتكتشف ليه حاجة بسيطة زي كدا ممكن نرغي عنها ساعة بحالها! بنغطي تفاصيلها والاستخدامات المتعددة ليها وايه الفروقات الي بينها وبين Computed وايه حوار الـ Watch Effect وازاي نفهم هما شغالين ازاي وازاي ممكن نعمل debugging ليهم. بنتكلم عن الحاجات الي تاخد بالك منها وافضل الـ Practices فيما يتعلق بكل دا!

في الحلقة دي حنتكلم عن الـ Async Components في Vue.js واستخداماتها في تحسين الاداء والـ Core Web Vitals. لكن في نفس الوقت بنتكلم في ازاي ممكن تكون سلاح ذو حدين، وازاي ممكن استعمالها بكثرة قد يؤذي تجربة المستخدم. والشيئ الي يمكن محدش بيتكلم عنه، ايه الي ممكن يحصل غلط ويخلي الـ Component متحملش وازاي اتعامل مع الـ Errors دي! لينكات مفيدة: import` Function` | MDN developer.mozilla.org/en-US/docs/W...

الجزء الثاني من حلقتنا مع محمود النجار وبيشاركنا تجربته لما جرب Vue مؤخراً ولقى حاجات كتير عجبته. طبعاً علشان احنا انتهازيين، كلمنا محمود وقررنا نسجل حلقة مقارنة لتجربته الشخصية بين React و Vue وايه الحاجات الي عجبته وايه الي بيميز كل Framework عن الثاني في حاجات صغيرة بس بتسيب أثر في تجربتك كمطور (DX).

في الحلقة دي معانا محمود النجار وبيشاركنا تجربته لما جرب Vue مؤخراً ولقى حاجات كتير عجبته. طبعاً علشان احنا انتهازيين، كلمنا محمود وقررنا نسجل حلقة مقارنة لتجربته الشخصية بين React و Vue وايه الحاجات الي عجبته وايه الي بيميز كل Framework عن الثاني في حاجات صغيرة بس بتسيب أثر في تجربتك كمطور (DX). الجزء التاني الاسبوع القادم علشان طولنا في اللقاء.

في الحلقة دي بنتكلم عن Component بيوفرها Vue.js لينا واسمها KeepAlive وبالرغم من انها قليلة الاستخدام الا انها بتخلي بعض المهام في قمة السهولة. بنتكلم برضو عن افضل استخداماتها وايه الحاجات الي لازم تاخد بالك منها علشان تستفيد منها علي قدر الامكان بدون التأثير بشكل سلبي علي اداء الـ Vue Application. لينكات مفيدة: KeepAlive - Vue Docs vuejs.org/guide/built-ins/keep-alive.html#keepalive المثال الي...

في الحلقة دي بنتكلم عن الـ Dynamic Components والسيناريوهات الي ممكن تحتاجها فيها وليه هي بتساعدك تكتب كود افضل في الحالات الي بناقشها. برضو بنتكلم عن الاستخدامات العملية ليها في شغلنا، وايه الحاجات الي تاخد بالك منها. لينكات مفيدة: vuejs.org/guide/essentials/component-basics.html#dynamic-components

في الحلقة دي بنتكلم عن الـ Teleport Component وايه المشاكل الي بتحلها وايه افضل استخداماتها وايه الي تخلي بالك منه اثناء استعمالها. وبنختم بنقاش حول اذا ما كانت فايدتها محدودة بوجود Dialog Element في الـ HTML والـ Popover API.

في الحلقة دي معانا داليا ايهاب من جديد وبنتكلم عن الـ Data fetching في Vue.js. بنغطي الحالات الي بنحتاج نجيب فيها داتا من السيرفر وايه انواع الداتا المختلفة وازاي كل نوع يختلف من حيث الاهمية والاولوية وازاي دا بيغير تماما من طريقة الـ fetching. بنتكلم برضو عن الطرق المختلفة الي ممكن نستعملها وافضل الـ patterns الي ناخد بالنا منها ونمشي عليها لما نعمل Data fetching وبنذكر بعض الحاجات الجديدة الي...

في الحلقة دي معانا ابراهيم وحنتكلم عن الـ TypeScript في Vue.js وتحديداً رحلتنا من البدايات وايه التغييرات الي طرأت عليه وجعلت استخدام الـ TypeScript افضل بكثير من نسخه السابقة. بنغطي برضو التفاصيل والادوات المتاحة ليك علشان تخلي كل شئ في الـ components شغال مع TypeScript ونصائح عمليه من واقع خبراتنا ممكن تطبقها في شغلك مع Vue.js. لينكات مفيدة: Using Vue.js with TypeScript | vuejs.org/guide/type...

في الحلقة دي معانا داليا ايهاب وبنتكلم عن الـ Components بشكل عام وايه الي يخلي بعضهم اكثر قابلية للـ Reusability او اعادة الاستخدام. بنغطي السيناريوهات المعقدة والـ Best practices فيما يتعلق بالموضوع وايه الأدوات المتاحة لنا في Vue.js في جعل اي Component اسهل واكثر قابلية للاستخدام.

في الحلقة دي بنتكلم عن الـ Forms في Vue.js وليه هي من اصعب الحاجات الي ممكن تشتغل عليها واسباب احتياجك لمكتبة تساعدك في التعامل معها. بنغطي حاجات كتير زي الـ state والـ validation وابرز الـ UX patterns الي بنشوفها النهاردا وايه سبب وجود اكثر من مكتبة وايه الفروقات ما بينهم وازاي تختار اكثر واحدة تناسب احتياجاتك.

في الحلقة دي معانا عمر لبنه وبناقش Nuxt.js واهميته في الـ Vue.js Ecosystem. بنتكلم عن Nuxt.js كونه اكثر من SSR فريمورك لـ Vue.js وانه عبارة عن اداة تسهل بناء اي بروجكت مع Vue.js خاصة مع وجود ادوات واضافات كتيرة تقدر تضيفها او تبنيها بنفسك عن طريق الـ Modules والـ Plugins. وبرضو بنتكلم عن بعض الاسئلة المهمة، زي هل تتعلم Nuxt علي طول ولا لازم تبدأ بـ Vue.js بعدين تنقل علي Nuxt؟ وهل الـ Migration ...

في الحلقة دي بناخد نظرة عامة علي الـ Testing بمختلف انواعه ومستوياته وازاي نقدر نوصل لاكبر استفادة ممكنة من الـ Tests الي بنكتبها من واقع خبراتنا المختلفة. برضو بنتكلم عن الحاجات الي مفادتناش كتير في رحلتنا وايه الأدوات الي بنستعملها علشان نـ test اي Vue Application.

في الحلقة دي بنتكلم عن الـ Composition API كأحد اهم مميزات وطرق كتابة Vue دلوقتي واد ايه يختلف عن الـ Options API وايه قصوره بالمقارنة. بنجيب كذا عنصر مهم زي الـ State والـ Life Cycle و الـ Watchers واهم النقط الي تاخد بالك منها في كلا منهم!

Migrating to Vue 3 | Ep. 5 | POV

State Management | Ep. 4 | POV

Rendering | Ep. 3 | POV

Reactivity | Ep. 2 | POV

Why Vue.js? | Ep. 1 | POV