🎮 كورس برمجة وتطوير لعبة أونلاين على محرك Unreal Engine

الكورس ده هيخليك تدخل عالم صناعة الألعاب بخطوات عملية، وتتعلم إزاي تبني لعبة أونلاين متكاملة باستخدام أقوى محرك ألعاب Unreal Engine.
هتتعرف فيه على:

أساسيات محرك Unreal Engine وتكوين المشاريع.

التعامل مع الجرافيكس والـ Blueprints والـ C++.

ربط اللعبة بالسيرفر علشان تبقى أونلاين Multiplayer.

تصميم الشخصيات، الخرائط، والميكانيكيات الخاصة باللعب الجماعي.

تحسين الأداء وتجهيز اللعبة للنشر.


🔹 الكورس مناسب لأي حد عايز يدخل مجال Game Development سواء مبتدئ أو عنده خبرة بسيطة.
وفي النهاية هتكون قادر تعمل لعبة أونلاين بنفسك وتعرضها على أي منصة.

◆ الجودة👀 :- 1080p
◆ اللغه 📓 :-  العربيه
◆ كلمه السر:- @Digital_killers

كـنـز الـ GitHub 💎
.
.
لو مهتم بتطوير مهاراتك كمهندس برمجيات، لازم تبقى عارف إن GitHub مليان كنوز هتساعدك بشكل كبير خلال رحلتك...

في البوست ده هشارك معاك مجموعة Repositories لازم تبقى عندك في الـ bookmarks، هتلاقي فيها أدوات، شروحات، وأكواد مفتوحة المصدر وأسئلة انترفيو هتسهّل عليك مشوارك في البرمجة. 💯

———

GitHub Repositories Every Software Engineer Should Know 💯


📍 developer-roadmap
https://github.com/kamranahmedse/developer-roadmap

📍 awesome-roadmaps
https://github.com/liuchong/awesome-roadmaps

📍 free-programming-books
https://github.com/EbookFoundation/free-programming-books

📍 engineering-blogs
https://github.com/kilimchoi/engineering-blogs

📍 Best-websites-a-programmer-should-visit
https://github.com/sdmg15/Best-websites-a-programmer-should-visit

📍 freeCodeCamp
https://github.com/freeCodeCamp/freeCodeCamp

📍 The Algorithms
https://github.com/TheAlgorithms

📍 Data-Structure-Algorithms-LLD-HLD
https://github.com/arpit20adlakha/Data-Structure-Algorithms-LLD-HLD

📍 awesome-algorithms
https://github.com/tayllan/awesome-algorithms

📍 design-patterns-for-humans
https://github.com/kamranahmedse/design-patterns-for-humans

📍 awesome-design-patterns
https://github.com/DovAmir/awesome-design-patterns

📍 system-design-101
https://github.com/ByteByteGoHq/system-design-101

📍 system-design-primer
https://github.com/donnemartin/system-design-primer

📍 system-design-resources
https://github.com/InterviewReady/system-design-resources

📍 system-design
https://github.com/karanpratapsingh/system-design

📍 Awesome-Design-Tools
https://github.com/goabstract/Awesome-Design-Tools

📍 design-resources-for-developers
https://github.com/bradtraversy/design-resources-for-developers

📍 app-ideas
https://github.com/florinpop17/app-ideas

📍 project-based-learning
https://github.com/practical-tutorials/project-based-learning

📍 public-apis
https://github.com/public-apis/public-apis

📍 interviews
https://github.com/kdn251/interviews

📍 tech-interview-handbook
https://github.com/yangshun/tech-interview-handbook

📍 awesome-interview-questions
https://github.com/DopplerHQ/awesome-interview-questions

📍 Coding Interview University
https://github.com/jwasham/coding-interview-university

📍 free-for-dev
https://github.com/ripienaar/free-for-dev

📍 build-your-own-x
https://github.com/codecrafters-io/build-your-own-x

📍 realworld
https://github.com/gothinkster/realworld

———

لو عندك Repos مميزة بتستخدمها ممكن تشاركها معنا في التعليقات وتفيد غيرك 💡

مصادر مهمة لانترڤيو الـ Problem Solving 💯
.
.
📌 This repository contains LeetCode articles which are very useful during the interview preparation.
https://github.com/ashishps1/awesome-leetcode-resources

📌 A curated list of awesome Leetcode problems, algorithms, and data structures.
https://github.com/kiranpalsingh1806/awesome-leetcode

التطبيق العملي من أفضل الطرق اللي هتساعدك جدًا في مجال البرمجة. 💯
.
.
موقع DevProjects هتلاقي فيه مشاريع ممتازة تقدر تشتغل عليها بنفسك، وتتعلم خطوة بخطوة لحد ما توصل لمستوى احترافي.🚀

———

📌 أنواع المشاريع المتاحة على الموقع:

- Web Development
- Mobile App
- Automation Or Tools
- HTML/CSS
- JavaScript
- React
- Vue
- Angular
- Node.js
- Python
- Ruby
- Java
- PHP
- Swift
- React Native

———

📌 رابط الموقع:

https://www.codementor.io/projects

الفرق بين gRPC و REST – أيهما أقوى وليه ممكن تحتاج الـ gRPC؟ 🤔
.
.
لفترة طويلة، الـ REST كان كفاية جدًا علشان الـ APIs تتعامل مع بعضها. بس مع الوقت، ظهرت تحديات جديدة، وبدأنا نحتاج حلول أسرع، أخف، وأكتر كفاءة.

هنا ظهر الـ gRPC، بس هل ده معناه إن REST انتهى؟ لا طبعًا، كل واحد له مكانه واستخدامه. تعال نشوف الفرق بينهم وإمتى تستخدم كل واحد منهم...

———

1. طريقة الاتصال

- الـ REST: بيعتمد على HTTP 1.1، وكل Request بيبقى مستقل تمامًا عن اللي قبله. يعني كل مرة بتطلب حاجة، السيرفر بيحتاج يفتح Connection جديد ويرد عليك، وبعدها الـ Connection بيتقفل – لكن لو السيرفر بيدعم Keep-Alive (وهي ميزة في HTTP 1.1)، الـ Connection ممكن يفضل مفتوح لفترة، وده بيقلل المشكلة شوية. بس برضو، HTTP 1.1 مش بيدعم Multiplexing.

- الـ gRPC: بيستخدم HTTP/2، وده بيسمح بأنه يعمل Multiplexing، يعني يقدر يبعت أكتر من طلب في نفس الـ Connection بدون ما يستنى كل طلب يخلص الأول. النتيجة؟ أداء أسرع واستهلاك أقل للـ Resources

———

2. نقل البيانات

- الـ REST: بيعتمد على JSON في أغلب الحالات، وده فورمات سهل القراءة بس مش الأمثل من حيث السرعة أو حجم البيانات. لكن REST مش مقتصر على JSON؛ ممكن تستخدم XML أو حتى Plain Text لو عايز، بس JSON هو الأكثر شيوعًا.

- الـ gRPC: بيعتمد على Protocol Buffers (Protobuf)، وهو Binary Format مضغوط جدًا، وأسرع بكتير في الـ Serialization/Deserialization من JSON
———

3. الأداء

- الـ REST: بيستهلك Bandwidth أعلى بسبب الـ JSON (أو أي Text Format) والـ Headers الكبيرة اللي في كل Request.

- الـ gRPC: أخف وأسرع لأنه بيستخدم Binary Encoding وبيحافظ على Connection مفتوح طول الجلسة.
———

4. الـ Code Generation

- الـ REST: لو عايز تكتب Client، لازم تبنيه يدويًا وتتعامل مع الـ HTTP Requests بنفسك.

- الـ gRPC: بيديك Code Generation جاهز بلغات كتير (JavaScript, Python, Go, etc.)، يعني تقدر تكتب الـ API مرة واحدة بس والـ Clients في لغات مختلفة تستهلكها بسهولة.

———

5. دعم الـ Streaming

- الـ REST: مش بيدعم الـ Streaming بشكل Native، ولو عايز تعمل حاجة شبه كده هتحتاج حلول زي WebSockets. لكن لو بتستخدم HTTP/2 مع REST، ممكن تستفيد من Server-Sent Events كحل جزئي، بس ده مش شائع.

- الـ gRPC: بيدعم Bi-directional Streaming، يعني الكلاينت والسيرفر يقدروا يبعتوا بيانات لبعض بشكل متزامن من غير ما يستنوا بعض.

———

6. التوافقية مع الـ Browsers

- الـ REST: بيشتغل في أي مكان، أي متصفح، وأي بيئة بدون مشاكل.

- الـ gRPC: ما بيشتغل مباشرة في المتصفح لأنه بيعتمد على HTTP/2 و Protobuf، لكن ممكن تدمجه مع gRPC-Web علشان تتعامل مع المتصفحات.

———

📌 إمتى تستخدم REST؟

✅ لو الـ API بتاعك هيشتغل مع المتصفحات مباشرة.
✅ لو عايز حل سهل، موثق كويس، ومعروف عند أغلب المطورين.
✅ لو بتتعامل مع سيرفرات مش بتدعم gRPC أو مش عايز تبني حاجة معقدة.

———

📌 إمتى تستخدم gRPC؟

🚀 لو عندك Microservices Architecture وعايز أداء سريع واستهلاك قليل.
🚀 لو بتتعامل مع Mobile Apps أو IoT Devices وعايز تقلل الـ Bandwidth.
🚀 لو عايز تعمل Real-time Communication بين الـ Services.

———

الـ REST مش رايح في أي حتة، ولسه مناسب لمعظم الاستخدامات. لكن لو بتبني سيستم معقد، وعايز كفاءة أعلى، وخصوصًا لو عندك Microservices أو High-performance Systems، الـ gRPC ممكن يكون الحل الأمثل لك.

الـ DOM (Document Object Model) 💯
.
.
هي البنية اللي المتصفح بيستخدمها عشان يحوّل صفحة الويب من كود HTML لكائنات (Objects) يقدر يتعامل معاها.

يعني ببساطة، الصفحة بتاعتك اللي بتتكون من عناصر زي العناوين، الفقرات، الصور، وغيرها بتتحول لشجرة من الكائنات، وكل عنصر بيتحول لكائن فيه خصائص زي النص، الألوان، الأحجام، وغيرها.

———

الجميل في الـ DOM إنه بيسمح لنا نغير الصفحة بعد ما تتحمل، وده اللي بنسميه "DOM Manipulation" باستخدام JavaScript. ✅

فكرة الـ DOM Manipulation ببساطة هي إنك بتقدر تعدل على عناصر الصفحة وتغيرها بناءً على تفاعل المستخدم، زي إنك تضيف زرار جديد، تشيل صورة، أو حتى تغير النص اللي مكتوب في الفقرات. 💯

———

📌 إزاي تجيب عناصر من الـ DOM؟

عشان تقدر تعمل DOM Manipulation، لازم الأول تعرف إزاي تجيب العناصر اللي عايز تعدلها. فيه طرق كتير عشان تجيب العناصر:

⚡️ الـ document.getElementById: دي بتجيب العنصر اللي له ID معين. مثلًا:

const element = document.getElementById("myElement");

⚡️ الـ document.querySelector: دي طريقة أقوى شوية لأنها بتستخدم CSS Selectors، يعني تقدر تجيب أي عنصر بناءً على الاسم، الـ class، أو حتى الـ ID:

const element = document.querySelector(".myClass");

⚡️ الـ document.getElementsByClassName والـ document.getElementsByTagName: دول بيرجعوا لك مصفوفة (Array-like) من العناصر اللي لها نفس الـ class أو الـ tag.

———

📌 إيه اللي ممكن تعمله بـ DOM Manipulation؟

⚡️ إضافة عناصر جديدة: لو عايز تضيف عنصر جديد في الصفحة، زي زرار أو صورة، تقدر تستخدم JavaScript عشان تعمل Create Element، وبعد كده تضيفه للشجرة باستخدام appendChild. مثال بسيط:

const newButton = document.createElement("button");
newButton.innerHTML = "اضغط هنا";
document.body.appendChild(newButton);

الكود ده بيعمل زرار جديد مكتوب عليه "اضغط هنا" وبيضيفه في آخر الـ body.

———

⚡️ تعديل محتوى العناصر: تقدر بسهولة تغير النص أو الـ HTML اللي موجود جوا أي عنصر باستخدام innerHTML أو textContent. يعني مثلًا لو عندك فقرة فيها نص وعاوز تغير النص ده لما المستخدم يضغط على زرار:

document.getElementById("myButton").addEventListener("click", function() {
  document.getElementById("myParagraph").innerHTML = "النص اتغير!";
});

هنا، لما المستخدم يضغط على الزرار اللي ID بتاعه "myButton"، النص اللي في الفقرة اللي ID بتاعها "myParagraph" هيبقى "النص اتغير!".

———

⚡️ تعديل تنسيق العناصر (CSS): عن طريق الـ DOM، تقدر تعدل في التنسيق (CSS) بتاع أي عنصر بسهولة باستخدام element.style. يعني لو عاوز تغير لون الخلفية لزرار معين لما المستخدم يضغط عليه:

document.getElementById("myButton").addEventListener("click", function() {
  document.getElementById("myButton").style.backgroundColor = "red";
});

هنا الزرار هيغير لونه للأحمر بعد ما المستخدم يضغط عليه.

———

⚡️ حذف عناصر من الصفحة: مش بس بتقدر تضيف أو تعدل، كمان تقدر تحذف عناصر من الصفحة تمامًا باستخدام remove():

document.getElementById("myButton").remove();

الكود ده هيحذف الزرار اللي ID بتاعه "myButton" من الصفحة.

———

📌 إيه أهمية DOM Manipulation؟

الـ DOM Manipulation بيلعب دور كبير جدًا في مجال الويب، وده لأنه بيخليك تقدر تبني صفحات ويب ديناميكية تستجيب لتفاعل المستخدم في اللحظة.

على سبيل المثال، في تطبيقات زي الـ Single Page Applications (SPA) زي اللي معمولين بـ React أو Vue، الـ DOM بيتم تحديثه باستمرار عشان يعرض للمستخدم المحتوى اللي هو محتاجه بدون ما نعمل Reload للصفحة كلها.

كمان، لو بتشتغل على تحسين تجربة المستخدم (UX)، هتلاقي إن DOM Manipulation بيساعدك توصل للنتائج اللي أنت عايزها، سواء بتعديل في التنسيق أو بتحريك العناصر على الصفحة بشكل سلس.

ملحوظة: رغم إن DOM Manipulation مهم جدًا، إلا أنه ممكن يبقى مكلف شوية لو عملت تعديلات كتير مرة واحدة على الصفحة، عشان كده من الأفضل دايمًا تستخدم تقنيات زي الـ Virtual DOM في مكتبات زي React عشان تحسن الأداء.