DevGuide 🇵🇸
10.9K subscribers
2.51K photos
17 videos
127 files
3.52K links
Join our channel for top-notch programming hacks, epic discussions, and brilliant career moves. 🚀

⚡️ Stay connected with me: linktr.ee/AliSamir

📍 To advertise on the channel: https://telega.io/c/the_developer_guide
Download Telegram
16 Coding Patterns That Make Interviews Easy 💯

1- Two-Pointer Technique
2- HashMaps
3- Linked Lists
4- Fast and Slow Pointers
5- Sliding Window Technique
6- Binary Search
7- Stacks
8- Heaps
9- Prefix Sum
10- Trees
11- Tries
12- Graphs
13- Backtracking
14- Dynamic Programming
15- Greedy Algorithms
16- Intervals
9
How to Learn Databases? 🤔

1- Database Fundamentals
2- Data Models and Types
3- Querying and Language
4- Indexing and Optimization
5- Security, Backups, and Scaling
6- Tools and Ecosystem
8
الفرق بين Hashing و Encoding و Encryption 🔐
.
.
لو بتشتغل في الباك إند، أو بتتعامل مع APIs، أو حتى بتشتغل على تطبيق بسيط فيه عملية تسجيل دخول…
أكيد قابلت مصطلحات زي Hashing و Encoding و Encryption.

وممكن تفتكر إنهم شبه بعض، أو إن أي واحد فيهم "بيأمن البيانات وخلاص".
لكن الحقيقة إن كل واحد له هدف مختلف تمامًا، ولو استخدمت حاجة غلط ممكن تفتح ثغرات أمنية وأنت مش واخد بالك.

تعال ندردش شوية عن الفرق بينهم...

———

أولًا: الـ Hashing:


تخيل إنك بتعمل بصمة لأي معلومة…
مش علشان ترجع لها بعدين، لكن علشان تتأكد إنها متغيرتش.

الـ Hashing بياخد قيمة (زي password مثلًا)، ويطلع منها سلسلة ثابتة الطول شكلها عشوائي – اسمها Hash – واللي بتستخدمها عشان تطابق أو تتحقق من البيانات من غير ما تحتاج تخزن الأصل.

🎯 المهم هنا:

- العملية دي One Way (مفيش رجوع).
- لو غيرت حرف واحد، الـ Hash كله بيتغير.
- وده اللي بنستخدمه مثلًا لما نخزن الـ Passwords في قواعد البيانات.

⚠️ لو حد عرف الـ Hash، مش هيعرف يطلع منه الباسورد الأصلي (بس ممكن يعمل Brute Force ويحاول يخمنه).

———

ثانيًا: الـ Encoding:


ده ملوش أي علاقة بالسرية...
الـ Encoding هو طريقة بنحول بها البيانات لشكل تاني علشان يسهل تخزينها أو نقلها.

زي Base64، اللي بتحول مثلًا صورة أو نص يحتوي رموز غريبة لشكل مفهوم لأي نظام.

🎯 المهم هنا:

- العملية دي Two Way (تقدر ترجّع البيانات الأصلية).
- مفيش أي حماية أو تشفير، أي حد يعرف نوع الـ encoding يقدر يفكه بسهولة.
- الهدف منه بس إنك تنقل الداتا بدون ما تضيع أو تبوظ.

مثال بسيط: لو عندك some text
ممكن يتحول بـ Base64 إلى: c29tZSB0ZXh0

———

ثالثًا: الـ Encryption:


أنت عايز تبعت داتا سرية لحد، ومش عايز أي حد في النص يفهمها.
فبتعمل لها تشفير باستخدام مفتاح (Key)، والمستلم اللي معاه المفتاح يقدر يفكها.

🎯 المهم هنا:

- العملية دي Two Way، بس لازم المفتاح.
- لو المفتاح اتسرّب أو ضاع، أي حد يقدر يفك البيانات.
- بتستخدمها في إرسال معلومات حساسة زي بطاقات الدفع أو بيانات المستخدمين.

فيه نوعين من الـ Encryption:

- الـ Symmetric: نفس المفتاح بيشفّر ويفك (زي AES).
- الـ Asymmetric: مفتاحين، واحد بيشفّر (public) والتاني بيفك (private) – زي اللي بيستخدم في HTTPS.

———

💡 إمتى تستخدم مين؟

- بتخزن passwords؟ يبقى Hashing
- بتبعت صورة أو داتا عبر API؟ يبقى Encoding
- بتبعت معلومات حساسة زي tokens أو بيانات مستخدم؟ يبقى Encryption

———

وفقكم الله لكل خير 🌿
20
API Design 💯
6
حابب تتناقش في فكرة أو عندك استفسار؟
اسألني في أي وقت من خلال حسابي على منصة قبيلة 👇

https://qabilah.com/profile/alisamir
4
Introducing Zustand (State Management)

Zustand is a minimal, but fun and effective state management library.

https://frontendmasters.com/blog/introducing-zustand
2
🔵🟢 يعني إيه Blue-Green Deployment؟
.
.
تعال أقولك على موقف حصل تقريبًا مع كل الناس اللي اشتغلت على مشاريع شغالة في الـ (Production)...

أنت خلصت ميزة جديدة (Feature) أو صلحت مشكلة (Bug Fix)، ومبسوط أوي بالشغل اللي عملته، وداخل تعمل deploy للكود. أول ما تعمل Deploy، تكتشف إن حصلت مشكلة مش متوقعة، والموقع وقع أو المستخدمين اشتكوا من حاجة مخدتش بالك منها.

ساعتها بتكون في لحظة توتر مش طبيعية، وتحاول ترجع الكود القديم بسرعة بأي طريقة.

هنا بقى بييجي دور الـ Blue-Green Deployment علشان يمنع كل الكوارث دي...

———

💡 يعني إيه Blue-Green Deployment؟

الـ Blue-Green Deployment هو أسلوب في نشر التحديثات (Deployment Strategy) بيخليك تنشر التغييرات بتاعتك بشكل آمن وسلس ومن غير downtime.

ببساطة، بدل ما عندك نسخة واحدة شغالة من التطبيق، بتبقى مشغّل نسختين:

- 🟢 النسخة الحالية اللي الناس كلها بتستخدمها دلوقتي اسمها Green
- 🔵 النسخة الجديدة اللي فيها التعديلات والتحديثات اسمها Blue

أنت بتجهّز نسخة الـ Blue، وتعمل عليها كل الاختبارات المطلوبة. ولما تتأكد إن كل حاجة شغالة تمام، بتبدّل الـ Traffic من Green لـ Blue.

يعني المستخدمين بدل ما بيتعاملوا مع النسخة القديمة، بيتحولوا فجأة للنسخة الجديدة من غير ما يحسوا بأي downtime.

———

🤔 ليه الأسلوب ده ممتاز جدًا؟

1- الـ Zero Downtime
مفيش وقت توقف. التحديث بيحصل في الخلفية، وأول ما يكون جاهز، بيتحوّل الـ Traffic بس.

2- الـ Rollback سهل جدًا
لو حصلت مشكلة في النسخة الجديدة، تقدر ترجع المستخدمين تاني للنسخة القديمة بكل سهولة.

3- الاختبار على أرض الواقع
تقدر تجرب النسخة الجديدة على عدد محدود من المستخدمين الأول (canary testing) قبل ما تعمل الـ switch الكامل.

4- مش هتبقى خايف تعمل Deploy. حتى لو فيه خطأ، فيه دايمًا نسخة سليمة تقدر ترجع لها.

———

فيه أكتر من طريقة تطبّق بيها Blue-Green Deployment، على حسب البنية التحتية اللي بتشتغل عليها:

1- لو شغال على Kubernetes، ممكن تستخدم مثلًا:

- الـ Services + Deployments علشان تتحكم في الـ Traffic.
- أدوات زي Argo Rollouts أو Spinnaker

2- لو بتستخدم Cloud Platforms زي AWS أو GCP، فيه أدوات built-in بتساعدك تعمل التبديل ما بين النسخ.

3- ولو شغال بشكل يدوي، ممكن تستخدم load balancer (زي NGINX أو HAProxy) وتغيّر التوجيه منه للنسخة الجديدة وقت ما تكون جاهزة.

———

- لازم النسختين (Blue و Green) يشتغلوا على نفس قاعدة البيانات أو يكون في حل مناسب لمزامنة البيانات. وإلا ممكن تواجه مشاكل في الـ schema أو البيانات نفسها.

- لازم تتأكد إن الـ Blue نسخة طبق الأصل من Green + التعديلات الجديدة، علشان تضمن إن rollback هيشتغل كويس لو اضطررت ترجّع.

———

👀 هل لازم دايمًا تستخدم Blue-Green Deployment؟

لا مش دايمًا. الأسلوب ده مفيد جدًا لو:

- التطبيق بتاعك بيشتغل لعدد كبير من المستخدمين.
- التحديثات اللي بتعملها حساسة وممكن تعمل مشاكل كبيرة.

لكن لو مشروع صغير أو مش فارق معاك downtime بسيط، ممكن تستخدم أساليب أبسط زي Rolling Deployment.

———

وفقكم الله لكل خير 🌿
4
يعني إيه Dead Code؟ 💀
.
.
تخيل معايا إنك في مشروع كبير، وكل يوم بتكتب فيه Features جديدة، وتعدّل على الكود القديم. مع الوقت، طبيعي جدًا يحصل تراكم أكواد غير مستخدمة…حاجات كانت مهمة زمان، بس دلوقتي مبقاش لها أي لازمة. الحاجات دي اسمها Dead Code.

الـ Dead Code هو أي كود موجود داخل المشروع، لكن لا يتم تنفيذه أو استخدامه في الـ Runtime. يعني الكود موجود في الـ Files، بس فعليًا ملوش أي تأثير على البرنامج أو الـ Output.

———

🔍 أمثلة على الـ Dead Code:

- أي Function مكتوبة ومحدش بينادي عليها في أي مكان في المشروع.
- أي Variables أو Constants متعرفة لكنها غير مستخدمة.
- أي Conditions مش ممكن تتحقق أبدًا (Unreachable Code).
- أي كود قديم استبدلناه بكود أحدث، بس نسينا نمسحه.

———

💡 طيب إيه المشكلة؟

يمكن تحس إن مفيش ضرر، لكن الحقيقة فيه مشاكل كتير:

1- زيادة حجم الكود: بيخلي المشروع تقيل ومليان حاجات ملهاش لازمة.
2- صعوبة الصيانة: لما تيجي تصلّح Bug أو تعدّل Feature، هتلف وتدور.
3- ممكن حد يشوف Function موجودة ويظن إنها بتستخدم، فيبدأ يشتغل عليها وهو مش واخد باله إنها Dead.
4- أداء أبطأ في بعض الحالات: حتى لو مش بتتنفذ، وجودها ممكن يأثر على وقت الـ Build أو حجم الـ Bundle في الـ Frontend.
5- الـ Code Smell: علامة على إن المشروع مش Managed كويس، وده بيأثر على الـ Code Quality.

———

🛠 إزاي نكتشف الـ Dead Code؟

في JavaScript/TypeScript:

- استخدم Tools زي ESLint مع Rule زي no-unused-vars أو no-unreachable.
- الـ ts-prune: أداة قوية بتحددلك الـ Exports اللي مش مستخدمة.
- الـ webpack-bundle-analyzer: يعرفك إيه اللي داخل في الـ Bundle ومش محتاجه.

في لغات تانية زي Java أو #C:

- الـ IDE نفسه زي IntelliJ أو Visual Studio غالبًا بيحددلك الـ Unused Code بعلامة أو لون باهت.

———

وفقكم الله لكل خير 🌿
11
React Context vs Redux 💯

Let’s break it down, what they do, when to use them, and how to choose the right one for your app.
5👍1
مفهوم الـ API Rate Limiting 💡
.
.
تخيل إن عندك Event ضخم وكل الناس هتدخل من باب واحد بس. لو كل الناس حاولت تدخل في نفس اللحظة، إيه اللي هيحصل؟ زحمة، فوضى، وممكن الـ Event يتلغي.

نفس الفكرة بتحصل مع أي API… لما عدد كبير جدًا من الـ Requests يوصل للسيرفر في نفس الوقت، الأداء بينهار، والـ Users بيبدأوا يحسوا إن الخدمة بطيئة أو مش شغالة.

هنا بيجي دور الـ API Rate Limiting، اللي هو ببساطة نظام بيحط حدود واضحة لعدد الـ Requests اللي أي مستخدم أو تطبيق يقدر يبعته في فترة زمنية محددة، عشان يضمن إن الخدمة تفضل مستقرة وسريعة لكل الناس.

———

🤔 ليه نعمل Rate Limiting؟

1- حماية الـ Server
لو الـ API استقبل عدد Requests أكتر من طاقته، ممكن يقع أو يشتغل ببطء شديد. الـ Rate Limiting بيحافظ على أداء السيرفر.

2- منع الـ Abuse
فيه ناس بتحب تجرب تبعت ملايين Requests بسرعة عشان تهاك أو تعمل Spam. الحدود دي بتوقفهم.

3- توزيع الـ Resources بطريقة مناسبة
لو فيه أكتر من عميل بيستخدم الـ API، مش معقول واحد منهم ياخد 90% من الـ Resources والباقي يتخانقوا مع بعض.

———

⚙️ إزاي نطبق الـ Rate Limiting؟

- الـ Fixed Window
بتحدد مثلًا 100 طلب في كل دقيقة. لو عديت العدد، هتاخد Error (غالبًا 429 Too Many Requests) لحد ما الدقيقة تخلص.

- الـ Sliding Window
نفس فكرة الـ Fixed Window بس أذكى شوية. بيحسب requests خلال آخر فترة زمنية متحركة بدل ما يقسم الوقت لمربعات ثابتة.

- الـ Token Bucket
عندك "جيب" فيه Tokens، كل Request بياخد Token. الـ Tokens بتتجدد بمعدل ثابت. لو الجيب فاضي، استنى لحد ما يتجدد.

- الـ Leaky Bucket
زي الصفيحة اللي فيها ثقب صغير بينقط Requests بمعدل ثابت، حتى لو جالك دفعة كبيرة فجأة.

———

💡 نصائح لو أنت بتبني API

- حدد معدل Requests معقول بناءً على قدرات السيرفر وعدد العملاء.
- استخدم Caching في الحاجات اللي مش محتاجة تتطلب من السيرفر كل مرة.
- خلي عندك خطة لتعامل خاص مع العملاء المهمين (Premium Users).

———

وفقكم الله لكل خير 🌿
3
مفهوم الـ Webhooks 💡
.
.
تخيل معايا إنك مستني صاحبك يجيلك. بدل ما كل شوية تقوم تبص من الشباك تشوف وصل ولا لا، هو أول ما يوصل يبعتلك رسالة يقولك "أنا وصلت".

السيناريو ده بالضبط شبه اللي بيعمله الـ Webhook. بدل ما الـ Application بتاعك يفضل كل شوية يسأل "فيه حاجة جديدة حصلت؟" (وده اسمه Polling)، الـ Webhook بيخلي الـ System التاني هو اللي يبعتلك أول ما يحصل التغيير.

———

🔗 LinkedIn:
https://www.linkedin.com/posts/mentoor-io_sofwaredevelopment-softwareengineering-softwaredeveloper-activity-7360720810849763329-4CYv

🔗 Facebook:
https://www.facebook.com/share/p/1Bv7LHEAcf

🔗 Qabilah:
https://qabilah.com/posts/5Tod1qKZvxU
5
كيف تعمل الـ JavaScript خلف الكواليس؟ JS Event Loop

https://youtu.be/5PbmjScmt4Y

———

💡 سؤال مهم جدًا وهتقابله تقريبًا في أي انترفيو له علاقة بالـ JS
6👏1
Writing tests that actually last?

Let’s go beyond “it renders” and explore how to write robust, maintainable tests with React Testing Library
4