Code With Somar
2.72K subscribers
444 photos
4 videos
1 file
814 links
🚀 ريادي أعمال ومطوّر ويب بخبرة واسعة

💻 متخصص بتطوير حلول ويب متكاملة باستخدام Laravel، Django، React، Vue، و Node.js.

🏆 ضمن أفضل 4 صناع محتوى في سوريا وأفضل 3 في المحتوى التقني.

🌟 ناشط في مجتمع برمجة الأطفال، ومساهم في تطوير المحتوى التقني عربياً.
Download Telegram
تمنياتي للجميع بداية اسبوع موفقة

بذكركم بانه الشباب اللي سجلت على جلسة الـ Git Like a PRO و اللي ما تمت إضافتهم على المجموعة التواصل معي كرمال ضيفهم باقرب وقت

الغروب مختلف عن غروب القناة وجب التنويه ⚠️
8👍1
This media is not supported in your browser
VIEW IN TELEGRAM
مارح يفهمها إلا اللي مقضى ليالي مع الـ Terminal 😂
💯16👏3👍1
شاركونا حساباتكم على LinkedIn نساوي Connection لبعض

حسابي بأول تعليق 👇🏻
8🔥2
اكيد شي مرة حدثت تطبيق او نظام و صرت تتمنى لو ترجع للإصدار القديم بدون ما تخسر بياناتك أو تخرب شي؟

هون بيجي دور مفهوم Rollback Compatibility! هالمفهوم بيضمن إنه حتى لو التحديث الجديد فيه مشاكل، تقدر ترجع بكل أمان للإصدار السابق بدون عواقب كبيرة.

ليش مهم هالمفهوم؟
لما بتحدث نظام أو تطبيق، دايمًا فيه احتمال يصير مشاكل أو أخطاء غير متوقعة. بهيك مواقف، Rollback Compatibility بيسمحلك ترجع للإصدار القديم بسرعة وبدون أي خسائر. وهاد الشي بيكون ضروري جدًا خاصة إذا البرنامج عم تستخدمه شركات أو مؤسسات مهمة، لأن أي خطأ ممكن يسبب مشاكل كبيرة و شفنا هالشي بالتحديث اللي خرب المطارات و مؤسسات كبيرة بالعالم من فترة

كيف بيتطبق Rollback Compatibility؟

📌 حفظ البيانات بشكل آمن: لازم البيانات تكون محفوظة بطريقة إذا رجعت للإصدار القديم ما تضيع. يعني يكون فيه Backup دوري للبيانات المهمة.

📌 توافق الميزات القديمة: لازم الميزات القديمة تشتغل طبيعي حتى بعد التحديث. وإذا رجعت للوراء، لازم ما تواجه مشاكل باستخدام هاي الميزات.

📌 التحديث الجزئي: أحيانًا التحديث ما بيكون لكل النظام. ممكن يكون لجزء معين، وهون لو صار خطأ، النظام بيقدر يرجع بس لهالجزء بدون ما يأثر على الباقي.

📌اختبار الرجوع: ضروري كل ما تعمل تحديث، تختبر كيف النظام بيرجع للإصدار القديم. هالعملية بيسموها Rollback Testing، وهي بتتأكد إنه الرجوع يتم بدون مشاكل.

مشاكل ممكن تواجهها مع Rollback Compatibility:

📌 فقدان البيانات: لو الإصدار الجديد أضاف ميزات أو تغييرات كبيرة، ممكن لما ترجع للإصدار القديم تفقد بعض البيانات.

📌 عدم توافق الميزات: بعض الميزات الجديدة ممكن ما تشتغل بشكل سليم إذا رجعت للإصدار القديم.

📌 التعقيد التقني: تطبيق Rollback Compatibility بيزيد من تعقيد النظام، لأنك لازم تضمن إنه كل إصدار يشتغل مع الإصدارات السابقة بدون مشاكل.

إذا بتحب تضمن استقرار النظام وتجنب أي مشاكل بعد التحديثات، Rollback Compatibility بيكون عنصر أساسي. فشو رأيك؟ بتفضل يكون عندك هالنوع من الأمان بنظامك لتقدر تتراجع عن أي خطوة بكل سهولة؟


Facebook | Linkedin |Instgram | Telegram | YouTube

===================

أنا Somar Kesen أعمل كـ Full Stack Developer أنشر بشكل شبه يومي منشورات تحتوي على العديد من المعلومات عن تطوير البرمجيات و سوق العمل مستخلصة من خبرة سنين في العمل مع العديد من الشركات في الشرق الأوسط و أوروبا ضمن هذا المجال

شكراً لـ Yousef Saleh على المساعدة في إعداد هذا المحتوى.
10👍3
هل معنا حدا متعامل مع Cloud Panel و Hostinger VPS بشكل عام ؟
👍2
إذا كنت web developer، فهذا لا يعني فقط أنك تكتب كود وبيطلع عندك الموقع شغال. في كتير أمور لازم تهتم فيها لتكون developer ناجح، مثل سرعة الموقع وسهولة فهم الكود والتعديل عليه. باختصار، لازم نولي نفس الاهتمام لأداء الموقع مثل ما نهتم ببنائه.

واليوم رح أعطيك بعض النصائح إذا كنت عم تستخدم React لتحسين performance وتشوف السرعة والأداء المثالي.

أول شي، استخدم lazy loading. شو يعني؟ هو آلية لتحميل المكونات والموارد عند الحاجة بس، مو كله دفعة وحدة بالبداية. هاد الشي بيساعد على:

تقليل وقت التحميل الأولي: لأن جزء من التطبيق بس هو اللي بينحمل بالبداية.
توفير الموارد: بيتم تحميل المكونات بس لما المستخدم يحتاجها.
تحسين تجربة المستخدم: بيساعد على التفاعل بسرعة أكبر مع التطبيق.
الخطوة التانية، استخدم React.memo. هي دالة بتقلل من إعادة عرض (render) المكونات لما الـ props ما تتغير، وهالشي بيحسن أداء المكونات اللي بتستقبل بيانات ثابتة.

الخطوة الثالثة، استخدم useMemo وuseCallback. الفرق بينهم:

useCallback: بيخزن الدالة لتجنب إنشاء دالة جديدة في كل إعادة عرض.
useMemo: بيخزن القيم المحسوبة لتجنب إعادة حسابها في كل مرة.
رابعاً، حسّن استعلامات البيانات باستخدام تقنيات مثل GraphQL لتقليل البيانات اللي عم تصارعها.

ولا تنسى تحسين استخدام الصور، وإزالة المكتبات غير المستخدمة، واستخدام code splitting. كمان، استخدم أدوات مثل React DevTools وProfiler لتحليل الأداء وتحديد نقاط الضعف.

باستخدامك هالنصائح رح تحسن أداء تطبيقات React، لكن لسه في كتير أمور تانية لتحسين الأداء.



Facebook | Linkedin |Instgram | Telegram | YouTube

===================

أنا Somar Kesen أعمل كـ Full Stack Developer أنشر بشكل شبه يومي منشورات تحتوي على العديد من المعلومات عن تطوير البرمجيات و سوق العمل مستخلصة من خبرة سنين في العمل مع العديد من الشركات في الشرق الأوسط و أوروبا ضمن هذا المجال

شكراً لـ Khder AL Romi على المساعدة في إعداد هذا المحتوى.
11🔥8
إذا سمعت بمفهوم الـ UX Design أو تصميم تجربة المستخدم، فهو ببساطة عن كيفية تحسين التفاعل بين المستخدم والتطبيق بطريقة سلسة ولطيفة. مثلاً، إذا كنت عم تحاول تسجل دخولك على تطبيق ولقيت أنو حقل الباسوورد صار لونه أحمر، هاد دليل من التطبيق لحتى تنتبه أنو في مشكلة بكلمة المرور. أو مثلاً لما تحمّل ملف وبيطلعلك دويرة صغيرة عم تدور، هاد بيعني "استنى شوي، نحن عم نشتغل على الملف".

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

وأهميتها بتكمن بالتالي:

تجربة إيجابية: لما بيكون التطبيق سهل الاستخدام، المستخدم بيضل يرجعله وبيصير عنده ولاء، يعني بيفضل يستخدمه دائماً.
تطبيق مميز: إذا عندك تطبيق بيقدم خدمة مشابهة لتطبيقات تانية، تجربة المستخدم المريحة رح تميّزه وتخلّي الناس تستخدمه لأنه أسهل وأكفأ، وبالتالي بتوفّر وقت وجهد.
إذا صادفت تجربة مستخدم عجبتك بتطبيق أو موقع، شاركنا برأيك فيها.

Facebook | Linkedin |Instgram | Telegram | YouTube

===================

أنا Somar Kesen أعمل كـ Full Stack Developer أنشر بشكل شبه يومي منشورات تحتوي على العديد من المعلومات عن تطوير البرمجيات و سوق العمل مستخلصة من خبرة سنين في العمل مع العديد من الشركات في الشرق الأوسط و أوروبا ضمن هذا المجال

شكراً لـLobana Balloul على المساعدة في إعداد هذا المحتوى.
6👍3
This media is not supported in your browser
VIEW IN TELEGRAM
العناوين و المحاور الرئيسية اللي رح تكون معنا خلال جلسة Git Like a PRO اللي رح نحاول خلال هي الجلسة انه نوصل بالجميع لمرحلة احتراف و اتقان للعمل على الـ Git و توظيفه بمشاريعهم سواءً الفردية او ضمن فريق.

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

انتظرونا 🔥🙏🏻
🔥123
ليش منخزن بيانات بالمتصفح؟ السبب الرئيسي هو تسريع الأداء بدل ما نستنى استجابة الخادم، البيانات المخزنة محلياً بتكون جاهزة فوراً.

ممكن نخزن معلومات متل اسم المستخدم من الجلسة السابقة أو محتويات سلة التسوق لوقت ترجع تتصفح أو نحفظ بيانات مؤقتاً إذا فصل النت أو لتسريع تحميل الموقع.

شو هيي طرق التخزين:

1️⃣ Local Storage: 🔵 تخزن البيانات بدون تاريخ انتهاء صلاحية. 🔵 السعة التخزينية حوالي 5 ميغابايت. 🔵 ما في نقل بيانات للخادم. 🔵 مو آمنة 100% لأنها تنخزن كنص (string).

2️⃣ Session Storage: 🔵 بتخزن البيانات لجلسة وحدة وبتنحذف لما تسكر المتصفح. 🔵 سعتها من 5 لـ 10 ميغابايت. 🔵 كل نافذة أو تاب بتعمل جلسة تخزين خاصة فيها.

3️⃣ Cookies: 🔵 بتخزن البيانات وبتنرسل مع طلبات XHR للخادم. 🔵 حجم التخزين أقل من 4 كيلوبايت. 🔵 ممكن تحدد صلاحيتها من الخادم أو المستخدم.

حتى تتوسعوا بهي المعلومات بنصحكم تشوفوا المنشور الكامل عنهم من خلال الرابط في اول تعليق.


Facebook | Linkedin |Instgram | Telegram | YouTube

===================

أنا Somar Kesen أعمل كـ Full Stack Developer أنشر بشكل شبه يومي منشورات تحتوي على العديد من المعلومات عن تطوير البرمجيات و سوق العمل مستخلصة من خبرة سنين في العمل مع العديد من الشركات في الشرق الأوسط و أوروبا ضمن هذا المجال
8
تذكير نهائي للاشخاص اللي سجلوا بالجلسة مراسلتي للانضمام للمجموعة الخاصة بالجلسة
3
Code With Somar pinned «تذكير نهائي للاشخاص اللي سجلوا بالجلسة مراسلتي للانضمام للمجموعة الخاصة بالجلسة»
مين الضيوف اللي بتحبوا يكونوا معنا بجلسات Live قادمة

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

إذا في موضوع او مجال حابب تعرف عنه اكتر او ضيف ببالك حابب تستفيد من خبرته اذكرلي بالتعليقات لحتى نشتغل على الموضوع
21👏4🔥2
صباح الخير جميعاً

تمنياتي الكم باسبوع موفق و بداية اسبوع سعيدة.

خلونا نبدأ هالاسبوع بفقرة سؤال و جواب - رح كون معكم على هاد المنشور للإجابة على اسئلتكم.

إذا كان عندك اي سؤال بإمكانك تتركه بالتعليقات و رح نجاوب عليه بأقرب وقت.
11🔥4
بتحبوا نعيد جلسة Laravel اللي ساويناها قبل فترة ( التفاصيل بالتعليق )
Final Results
77%
مع فكرة الإعادة
23%
غير محبذ لفكرة الإعادة
5👏1
WordPress 6.7 Beta 2 is now available for testing!
3
لازم تشارك القناة مع كل شخص بتعرفه بيشتغل Word Press لأن عم تابع أخبار الموضوع أول بأول و رح يكون المحتوى مفيد الهم كتير

مبارح نزل خبر مهم للشباب اللي عم تستخدم Advanced Custom Fields (ACF) Plugin صار فيكم تستخدموا Secure Custom Fields (SCF) اللي هيي متلها تماماً و لكن آمنة و أكيد مجانية و فيك تشيل الـ ACF و تفعل بدالها SCF بدون اي مشاكل.

و على فكرة إذا موقعك ما اعتمد على تحديثات WP Engine ( شوف منشوراتي القديمة بتعرف شو قصدي )، فيك تعمل التحديث لـ SCF مباشرة، وإذا مفعل التحديثات التلقائية من Word Press، الموقع رح يتحدث تلقائياً للإضافة الجديدة.


Facebook | Linkedin |Instgram | Telegram | YouTube

===================

أنا Somar Kesen أعمل كـ Full Stack Developer أنشر بشكل شبه يومي منشورات تحتوي على العديد من المعلومات عن تطوير البرمجيات و سوق العمل مستخلصة من خبرة سنين في العمل مع العديد من الشركات في الشرق الأوسط و أوروبا ضمن هذا المجال
👍4🔥3