Web Development Code
6.34K subscribers
389 photos
55 videos
132 files
201 links
قناة خاصه بتطوير الويب
ونشر مشاريع الويب
وكل مايخص الويب
الادمن : @Noureldin13
#Html
#Css
#Bootstrap
#JavaScript
#ReactJs
#Php
#NodeJs
#Mysql
#MongoDB
Buy ads: https://telega.io/c/codedevelopment

جروب المناقشة :
@codedevchat
Download Telegram
فل كدا خلاص كدا الcall stack خلص شغله ويقدر يروح بيته؟؟ لا طبعا لأن أول ما الcall stack بيفضي بالمنظر ده مش هوا اللي يقدر يقول البرنامج انتهى أو لا طيب مين اللي يقول انتهى أو لا؟؟
-الكبير
احمد مكي؟

-لا ياعم الكبير عندنا هنا واللي هيطلع ليه دور كبيييير جدا في أي الطريقة اللي الكود بيشتغل بيها هوا ال event loop

طب وده بيعمل ايه ده؟؟

- ده ببساطة كدا بيقولك اوعى تنام یا یحیی

ازاي

-بص هوا ال event loop ده هوا حامي حق الناس اللي الcall stack بيرميها من عنده ومش بينفذها . يعني اي function عندي الcall stack بيغضب عليها ومش بينفذها ويرميها للwebApi's عمو event loop بيجيبلها حقها ويرجع يفكر الcall stack بيها تاني
بجد؟؟
طيب ما تيجي نسأل على الfunction اللي رميناها دي طالما فيه حد بيسأل عنها وبياخد حقها وطلعت جامده كدا هيا حصلها ايه صحيح من ساعة ما رميناها؟

- راحت شقت طريقها واتنفذت بعيد عننا واحنا لما جينا نكتبها اصلا كانت بتطلب مننا حاجه اسمها call back function وده بقى اللي بيوصلنا منها يعني لما احنا روحنا رميناها ال webApi's اخدتها واحتنضنتها ونفذتها بعيد عن الكود الأساسي وبدون ما تشوش عليه خالص وبعد ما خلصت رجعتلنا ال call back function اللي احنا كنا قايلين عليها واللي هيا انها تطبع لنا كلمة time out

طيب بترجعلنا ال function دي فين هل بترجعه في الcall stack على طول كدا؟؟

- لا طبعا متبقاش غشيم انت مش شايف ان فيه حاجه في
الdiagram لسه ما اتكلمناش عنها فأكيد ليها علاقة بالموضوع ده واللي هيا ال callback queue وده أي function بنرميها لل web api's بترجعلنا فيه الcall back function بتاعتها فيه

طيب وبعدين؟؟
-بعدين بقى زي ما قولنا ان بعد ما ال call stack يخلص شغل ال event loop بتقوله اوعى تنام إلا لما ال web api's و ال callback queue يكونوا فاضيين ومش بيعملوا حاجه يعني ايه؟؟ يعني طول ماعندي ال web api's شغاله على حاجه الcall stack ما يقدرش يقول كدا خلاص يا جماعة انا خلصت شغلي انا هقفل البرنامج ده ولما ال web api's بتخلص بتبعت نتيجة الكلام اللي خلصته ده لل callback queue ما فيه حاجة في ال callback queue الcall stack يبدأ ينفذهم واحده واحده لحد ما يخلصوا
تمام
طيب الكلام ده ممكن يفيدني ب ايه وانا شغال بالnode اصلا وایه لازمته وهل هيأثر على شغلي إذا كنت مش عارفه
- احنا هنهزر؟؟
أكيد مش بنكتب كل الكلام ده على الفاضي المفاهيم دي ليها تأثير كبيير جدا على الكود اللي هنكتبه بعد كدا وهيساعدنا جدا اننا نحسن الperformance بتاعنا جدا وده اللي هنبدأ نشوفه ان شاء الله من المرة الجايه
فهمتوا حاجه
Anonymous Poll
72%
اها فهمنا
28%
لا مفهمناش
Web Development Code
فهمتوا حاجه
ياريت الي مفهمش يقول 😒
السلام عليكم جميعا : Hello everyone


تم شرح في هذا الفيديو سوف ننشئ خط سفلي متحرك بتأثير جميل في حالة ال hover يحدث و بشكل سهل و بسيط جرب طبق الشرح في الكود الخاص بك لتعلم كيف يتم برمجته  بطريقة سهلة و بسيطة


رابط الفيديو
https://youtu.be/SGmnr6PnsiQ
السلام عليكم لو اي محتاج محتاج خدمات من الآتية يتواصل معانا فالمجموعه :

UI&UX Design By Figma,XD

Create Website:
Front By JS
BackEnd By Laravel OR Node.js OR Django
Database MongoDB OR Firebase OR MySQL

Create Apis By Node OR Laravel

Create IOS and Android Applications By Flutter
السلام عليكم
المره اللي فاتت كنا بنكمل كلامنا عن ازاي الjs عموما بتتنفذ في اغلب الbrowsers وعرفنا شوية أساسيات كدا عنها و………...

-استنى بس كدا أنا أصلا بدأت اقرا كلامك عشان الnode.js واللي انت لحد دلوقتي مجيبتش سيرتها أصلا

فعلا بس ممكن تصبر عليا شوية؟

-تمام هصبر بس مش كتير

خلاص طالما مش هتقدر تصبر اكتر من كدا ممكن نتبدأ نربط اللي اتكلمنا عنه المرة اللي فاتت ب الnode.js

-ايه بقى node.js أصلا وايه الاختلاف فيها عن اللي اتكلمنا عنه المرات اللي فاتت؟

ولا أي حاجه احنا برضو عندنا node.js شغالة بنفس الطريقة اللي كنا بنتكلم عنها المره اللي فاتت عادي خالص ومفيش أي اختلاف

- بجد؟

اه بجد ﻷن أصلا node.js مبنية في الأساس على الV8 engine وده اللي كنا بنشرحه المرات اللي فاتت بس الموضوع كله انه بيساعد الV8 engine دهlibrary اسمها libuv ودي مبنية أساسا كلها بc فمثلا انا لما اجي اكتب كود js عادي جدا وعاوز انفذه بالnode ف ساعتها الnode هيا اللي بتhandle الموضوع بمساعدة الV8 engine والlibuv يعني زي ما واضح في الصورة الي فوق الnode هيا layer بتاخد الكود بتاعي اللي بكتبه وتتعامل مع الV8 engine والlibuv عشان تنفذهولي وتطلعلي الناتج

- تمام بس ايه libuv دي واستخدمناها ليه اصلا دلوقتي ما الV8 شغالين بيه في google chrome ومفيش حد اشتكى منه ليه ندخل معاه الحاجة دي ولازمتها ايه

هجاوبك ع السؤال ده بس ممكن أسألك سؤال تاني قبله؟

- ماشي

هل استخدام الjs في الnode زي استخدام الjs في الbrowser؟

- مش فاهم سؤالك ممكن توضح؟

يعني هل كل العمليات اللي بعملها في الnode اقدر اخدها اطبقها في الbrowser ويشتغل عادي وبنفس الكفاءة؟

- أكيد طبعا هوا مش كلها js؟

ايوا طبعا هوا كلها js بس على سبيل المثال هل اقدر في الbrowser اتحكم في الfiles اللي ع الجهاز عندي او اقدر ابني server مثلا بكود انفذه في الbrowser يكون قادر انه يعمل الnetwork operations اللي الserver مسؤول عنها؟؟

- لا مفروض ان أي browser مش شغلته انه يعمل الحاجات دي أصلا وحتى لو هتتعمل فيه ممكن تبقى حاجه جانبية ﻷنها مش شغلته الأساسية

صح بالظبط كدا libuv دي نقدر نقول دلوقتي عليها انها بتكملنا شوية حاجات كانت ناقصه في الV8 engine لأنه في الأساس مش مبني عشان يتعامل مع OS والfiles ووجع الدماغ ده كله فهنلاقي الV8 engine لقى نصه التاني اللي هيكمله ويخليه يكون قادر انه يتعامل مع كل المشاكل اللي بتواجهه دي بسهولة جدا وعلى فكرة ملحوظة بس ال V8 في الأساس كان مشروع open source عملته google الغرض منه اننا نقدر ننفذ كود الjs خارج الbrowser ف الV8 في الأساس مهيء للموضوع ده جدا حيث انه engine كويس جدا وopen source ولكن مفيش حاجه في الدنيا كاملة لأسف والجماعه اللي عملوا node.js لقوا ان فيه مكتبة ب الc بتقدم اداء كويس جدا في انها تhandle الfiles وميزات تانيه كتيره غايبة عن الV8 والحاجات هنبدأ نعرفها ان شاء الله من المرة الجايه ونتكلم عن اللي بتقدمهولنا الlibrary دي ودورها السحري في الnode وحكاية الnon-blocking I/O operations دي اللي الlibrary بتقدمهولنا
كلنا عارفين ان الstring في الjavascript عبارة عن primitive type ، عمرك سألت نفسك ازاي بتقدر تستخدم معاها methods ؟؟
طب اي السبب؟
السبب process بتعملهالك الjs ،
Behind the scene
اسمها ال " Boxing "
لما بتعمل call لأي method علي ال string ،
الjs بتعمل wrapped
للprimitive value لل string بتاعك وتحطها جوا object وال object دا
built in prototyping
خاص بالmethods اللي انت بتستعملها مع ال string زي substr و slice وغيرهك من ال methods الخاصة بالstring، ولما ال operation اللي انت بتعملها بالmethods الخاصة بال string object بتخلص ، الstring object دا بيحصله converted back
لل string primitive data type
عشان كدا أي string method
بت return primitive data type
يعني لو استخدمت
String method
مع string primitive data بتتحول ل object له
Prototype methods
خاصة بالتعامل مع الstring
وف الآخر خالص الmethod دي ال return value بتاعها بيكون primitive
السلام عليكم ..

النهارده ان شاء الله مش هنطول عليكم وهيكون بوست بسيط جدا كدا هنتكلم فيه عن حاجات أساسية في دور libuv وبعدها هنوقف السلسلة دي مؤقتا عشان نشرح بعض الtopics اللي هنحتاجها عشان نكمل السلسلة دي زي ال
asynchronous vs synchronous or single-threaded vs multi-threaded عشان هيبقى مبني عليها كلامنا بعد كدا
وكنا كملنا كلامنا المرة اللي فاتت عن الnode.js وكنا وقفنا عند libuv وكنا بنسأل ايه أهميتها ودورها في الnode وليه استخدمناها من الأساس؟؟
زي ما قولنا المرة اللي فاتت ان الV8 engine رغم اداءه القوي بس كان فيه بعض الحاجات مش بيدعمها والحاجات دي بشكل عام هيا ال system resources لأنه في الأساس كان كل تركيزه أنه ينفذ كود الjs زي ما بيتنفذ عندي في الbrowser بس مش ومش مهم عند انه يتعامل ازاي مع الos أو الnetwork أو ال files ف جيبنا بعدها libuv عشان نضيف بعض الfeatures وكل اللي هنقوله النهاردة هوا ايه أهم الfeatures اللي موجودة في libuv و اللي هيا :
The event loop
Asynchronous TCP and UDP sockets
Asynchronous DNS resolution
Asynchronous file and file system operations
Thread pool
Child processes
High-resolution clock
Threading and synchronization primitives
Polling
Streaming
Pipes

      وبس كدا بوست النهاردة الخفيف كدا خلص عشان نوقف سلسلة ال node.js مؤقتا ونرجعلها تاني قريب بإذن الله بعد ما نتكلم شويه عن كذا topic مهمين الأول
single thread & multi thread programming

هنتكلم النهاردة عن موضوع جديد شوية ان شاء الله وهو الmulti threading ايه هيا الmulti threading واستخدمها امتى وليه؟؟

- اه يا ريت أنا عاوز أعرف فعلا

بس اول حاجه لازم نتكلم الاول عن ايه هو ال thread أساسا وازاي الthreads دي بتتنفذ عندي من ال cpu

- ماشي ياعم اشرح ايه هوا الthread الأول اما نشوف اخرتها ايه

طيب معلش بقى اخر حاجه قبل ما نشرح ال thread هنشرح حاجه اسمها process الأول

- !!؟؟

معلش اخر طلب

- ماشي تمام

بسم الله نبدأ بقى بأول مفهوم معانا النهاردة واللي هوا الprocess واللي بيتعرف بـأنه the program in execution وبالمناسبة ده مش معناه ان اي program هوا عبارة عن process واحده ممكن يكون البرنامج فيه اكتر من process شغالين مع بعض عادي جدا وممكن الprocess تخلفلنا processes تانيين بنقول عليهم child processes

بالمناسبة الprogram هنا المقصود بيه الكود المتخزن على الdisk عندي مجرد الكود بس مش أكتر

و لو عندنا مثلا program حابب يشتغل بيتحول الكود المتخزن على الdisk ده للميموري(RAM) عشان نبدأ نسميه باسمه الجديد (process) وبعد كدا الprocess اللي عندي تبدأ تتنفذ واحده واحده فتبدأ تجهز الكود بتاعها ده عشان يروح للcpu بس الكود مش بيعرف يروح لوحده كدا فالprocess تبدأ تجهزله حاجه عشان تودي الكود ده يتنفذ والحاجه دي هيا الthread فالthread دي هيا الunit اللي الcpu بينفذها وهو جزء من الprocess وممكن الprocess يكون ليها اكتر من thread عادي جدا
يبقى دلوقتي عندي ال thread هو عباره عن جزء من الprocess اللي شغاله عندي بيتم تنفيذه من خلال الcpu يعني لو الprocess(program in execution) اللي عندي دي بتتنفذ كلها من خلال thread واحد بيقوم بتنفيذ الكود كله كده الprocess دي single thread ولو الprocess دي بتنفذ الكود على اكتر من جزء تكون multi threading طيب ازاي برضو مش فاهم ازاي ينفذ الكود كله كجزء واحد وينفذ الكود على اجزاء ممكن مثال تمام هندي مثال لو عندنا مثلا array اسمها فتحي وفتحي دي عبارة عن ارقام وعدد الارقام دي كبير وانا محتاج اجيب مجموع الارقام دي من خلال concept ال single threading اللي فهمناه اني هعمل loop على ال array دي وهبدأ احسب مجموع الارقام دي كجزء واحد من خلال single thread واحد بس اما لو بتكلم عن multi thread ف انا ممكن اقسم ال array للي عندي دي مثلا على 4 threads وكل واحد فيهم يحسبلي ربع الarray بس
- تمام ايه بقى اللي استفدته لما ان ال array كلها تتحسب مره واحده وايه اللي حصل لما قسمتها على اكتر من thread؟؟؟
الاجابه هي الcpu بمعنى ان احنا لازم نفهم الاول ازاي الcpu ده بيتعامل مع الthreads دي الأول

- تمام طيب ازاي الthread بتتعامل عندي في الcpu

اول حاجه لازم نعرفها ان فيه كذا طريقة الcpu بيتعامل بيها مع الthreads وبتختلف الطرق دي من operating system ومن cpu للتاني بحيث ان كل os ليه الalgorithm الخاص بيه اللي بيستخدمه علشان يتعامل مع الthreads يعني مثلا الويندوز بيستخدم algorithm اسمه round robin اما اللينكس مثلا بيستخدم Completely Fair Scheduler وكل os يقدر يستخدم حاجه مختلفه

- طب تمام ايه اللي استفدته لما عرفت الموضوع ده؟؟

ب اللي استفدته ان كل الalgorithms اللي اغلب الos الحديثه بتستحدمها بينهم حاجه مشتركه والحاجه دي انها بتدي كل thread عندي وقت معين للتنفيذ لو الthread ده خلص في الوقت اللي هيا محدداه ليه تمام ما خلصش بترميه وتقول انا واقفه في المكان ده وتروح تنفذ الthread اللي بعده انها تديله نفس الوقت اللي قبله اخده تنفذ فيه على قد ما تقدر ولما الوقت ده يخلص تروح على اللي بعده وهكذا..

-طب مش فاهم ممكن مثال؟؟

تمام هنفترض ان عندنا مثلا p1 , p2 دول 2 process و p1 محتاجه 8 ثواني و p2 محتاجه 6 ثواني والos عندي بيدي لكل process ثانيتين بس ايه بقى اللي هيحصل الاول p1 هتدخل ثانيتين وتطلع وكده يكون فاضلها 6 ثواني بعدهاp2 تدخل ثانيتين وتطلع وترجع تاني p1تدخل ثانيتين لحد الاخر زي ما واضح في الصورة اللي فوق يبقى انا كده عندي p1 اللي محتاجه 8 ثواني عشان تتنفذ قعدت منتظرها برا على ما تخلص 14 ثانيه ده في حالة ان مفيش اي حاجه بتتنفذ معاها غير thread واحه وطبعا كل ما زاد عدد الthreads زاد الوقت اللي هتخلص فيه الthread تمام طيب ايه الحل الحل فوق لما كنا بنتكلم على التقسيم والكلام الغريب ده يعني ايه يعني لما قولنا فوق مثلا على مثال الarray لو قولنا الarray دي هيا p1 اللي محتاجه 8 ثواني لو انا قسمتها مثلا على اربع اجزاء بحيث ان كل جزء يتنفذ لوحده ايه اللي هيحصل بدل ما كان عندي p1 ومحتاجه 8 ثواني عشان تتنفذ هيبقى عندي p1, p2, p3, p4 وعندي مثلا الprocess (كلامنا كله على ان الprocessليها thread واحد بس)التانيه دي هسميها p5 يبقى انا كدا عندي p1, p2, p3, p4 وكل واحده محتاجه ثانيتين مثلا
لان الprocess الكبيره كانت محتاجه 8 ثواني فاللي هيحصل دلوقتي ان اول حاجه p1هتدخل تتنفذ الثانيتين وهتخلص وبعدها p2و p3 زي ما في الصوره تحت في الاخر يطلع عندي ان الprocess الكبيره دي بدل ما تتنفذ في 14 ثانيه خلصت في 8 بس يعني وفرت تقريبا نص الوقت اللي كانت هتاخده لما كانت بتتنفذ على thread واحده بس وكل ده بنتكلم على ان الcpu ده single core وده دلوقتي بقى قليل جدا لان اقل cpu دلوقتي ممكن يبقى 4 cores او اكتر

- يعني ايه؟

يعني في كل ثانيه يقدر ينفذ 4 processes من اللي عندنا دول!!
يعني كل الحوار ده هيتنفذ مره واحده لو اعتبرنا ان الcpu نفذهم في نفس الوقت وبدل ما نستنى 8 ثواني ممكن نستنى ثانيتين بسسسس!

- ايه ده ده الmulti threading دي طلعت جميله اوي وأطيب من الاستاذ بهاء سلطان

للاسف مفيش حد اطيب من استاذ بهاء والmulti threading رغم اللي عملته ده ليها مشاكل كتير بتخليني مش احسن حل دايما وده اللي ان شاء الله هنتكلم عنه المره الجايه
رابط الفيديو من هنا
https://youtu.be/l3FHjCDXXJ0


في هذا الفيديو سوف نشرح كيف عمل عرض الشرائح ( slider ) بالصور بطريقة سهلة و بسيطة بدون الحاجة الى استخدام جافاسكربت في هذا المشروع فقط باستخدام HTML و CSS بدون الحاجة الى استخدام javascript
How to create the counter app
#Task