لاحظت كثير من طلاب الحاسب ملخبطين نبغى نتعلم
Back-end development
هل لازم نتعلم Html ??
طيب إيش الفرق بين front-end و back-end ??
راح أكتب ثريد شامل يفيد كل الي حاب يسير مبرمج مواقع إن شاء الله ...
تابعوني
لاحظت كثير من طلاب الحاسب ملخبطين نبغى نتعلم
Back-end development
هل لازم نتعلم Html ??
طيب إيش الفرق بين front-end و back-end ??
راح أكتب ثريد شامل يفيد كل الي حاب يسير مبرمج مواقع إن شاء الله ...
تابعوني
@PrograminLovers
أي برنامج ٍSoftware يتكون من 5 طبقات رئيسية :
1- UI 💻 : ما يظهر للمستخدم
2- API🔁 : الطريقة التي تم جلب البيانات بها
3- Logic 📝: كيفية معالجة البيانات
4- Database📤: طريقة تخزين البيانات
5- Hosting🌍 : مكان تخزيين البيانات
أي برنامج ٍSoftware يتكون من 5 طبقات رئيسية :
1- UI 💻 : ما يظهر للمستخدم
2- API🔁 : الطريقة التي تم جلب البيانات بها
3- Logic 📝: كيفية معالجة البيانات
4- Database📤: طريقة تخزين البيانات
5- Hosting🌍 : مكان تخزيين البيانات
#ثريد اليوم :
خارطة برمجة الويب -مسار Front-End + مصادر متنوعة لتعلم اللغات والتقنيات المناسبة :
1- HTML/HTML5 :
أول شيء يجب تعلمه في مجال برمجة الويب ,
وظيفتها هيكلة عناصر الويب : مثلا الصفحة تتكون من عنوان رئيسي - صورة - قائمة ...الخ
هذا الاسبوع برعاية
#flutter
أول مره أدخل مجال التطبيقات بخبرة صفر ,
عاجبتنيflutter لدرجة أفكر أتخصص تطبيقات وأترك الويب 😅
رغم انه تجهيز بيئة العمل والتنصيب أخذ مني يومين 😱😖
♦️مواقع مفيدة في مجال برمجة الويب :
موقع مفيد ورهيب يقوم بتوليد أكواد CSS مجانا استنادا إلى مواصفات تصميم الشكل الزجاجي glassmorphism
كل اللي عليكم تختاروا الخلفية , وتحددوا :
Blur value, Opacity , Saturation
ويظهر لكم الكود جاهز
لاحظت كثير من طلاب الحاسب ملخبطين
نبغى نتعلم Back-end development هل لازم نتعلم Html ??
طيب إيش الفرق بين front-end و back-end ??
راح أكتب ثريد شامل يفيد كل الي حاب يسير مبرمج مواقع إن شاء الله ...
📍أشياء لا تحدث الا مع المبرمجين :
- النوم قد يحل الايرور
- التعداد يبدا من الصفر وليس 1
- أهمية و قيمة ; لا يعرفها احد مثل المبرمجين😂
- الجذور (root) تقع في الأعلى وليس في الاسفل كما في الشجرة
إيش كمان ؟
📍أشياء لا تحدث الا مع المبرمجين :
- النوم قد يحل الايرور
- التعداد يبدا من الصفر وليس 1
- أهمية و قيمة ; لا يعرفها احد مثل المبرمجين📷
- الجذور (root) تقع في الأعلى وليس في الاسفل كما في الشجرة
إيش كمان ؟
#ثريد اليوم :
نصائح مهمة للمبتدئين في مجال #البرمجة :
1- إبدأ مع الكورسات المجانية : اليوتيوب مليان وفي مواقع تشرح البرمجة مع التمارين , في حال ما عجبتك البرمجة يكون ما خسرت شيء وأضفت تجربة جميلة لك
2- إقرأ documentation من الموقع الرسمي الخاص بلغة البرمجة 📖📖
أي برنامج ٍSoftware يتكون من 5 طبقات رئيسية :
1- UI 💻 : ما يظهر للمستخدم
2- API🔁 : الطريقة التي تم جلب البيانات بها
3- Logic 📝: كيفية معالجة البيانات
4- Database📤: طريقة تخزين البيانات
5- Hosting🌍 : مكان تخزيين البيانات
#ثريد اليوم عن أنواع الخوادم
شرحت في ثريد سابق المقصود بالخادم :
والذي هو عبارة عن برنامج (Software) أو جهاز كمبيوتر (Hardware) , وظيفته تخزين البيانات وتقديم الخدمات ,,,
المبرمج ليس من مهامه 🛑🛑🛑:
- يعرف يصلح الطابعة🖨️
- يعرف كلمة سر الايميل📩
-يصلح الايفون إذا علق على شعار التفاحة 📲
- فيس بوك هاكر 🕵️♀️
- ينشأ لك موقع مجانا 🖥️
طيب الله جمعتكم
بما إني حاليا قاعدة أرتب أعمالي وأرفعها على إستضافة
راح أشاركم هذا #الثريد
كيفية رفع موقع ويب GitHub مجانا :
تقدم منصة GitHub خدمة مجانية لاستضافة صفحات الويب، يطلق على هذه الخدمة اسم GitHub Pages
المبرمج ليس من مهامه 🛑🛑🛑:
- يعرف يصلح الطابعة🖨️
- يعرف كلمة سر الايميل📩
-يصلح الايفون إذا علق على شعار التفاحة 📲
- فيس بوك هاكر 🕵️♀️
- ينشأ لك موقع مجانا 🖥️
#ثريد اليوم
الفرق بين #برمجة الموقع من الصفر أو #الووردبريس ؟
الووردبريس : نظام إدارة محتوى سهل الإستخدام ومجاني ،
لا يحتاج لغات برمجة مثل php ،
ممكن أي شخص يعمل لك موقع كامل وجاهز من غير ما يعرف يكتب سطر برمجي واحد بإستخدام الووردبريس !!!
@PrograminLovers
تكملة #ثريد مشاريع التخرج لطلبة علوم الحاسب
إن شاء الله الثريد يساعدكم للحصول على فكرة مميزة وحلوه لمشروعكم ,
وكلكم A+ يااارب 👏👏
كيف أحصل على فكرة لمشروع التخرج ؟
⬇️⬇️⬇️⬇️⬇️
أدوات المتصفح تفيد المبرمجين 2 :
-Octotree :
تظهر قائمة جانبية بتفاصيل repo على Github
-WhatFont :
لمعرفة نوع الخط المستخدم في الموقع
-ColorPick Eyedropper :
لمعرفة رقم أي لون موجود على صفحة الويب
-Wide GitHub :
تكبر صفحة Git hub
-Hover Zoom+:
تظهر أي صورة بأبعادها الحقيقية
#ثريد اليوم
الفرق بين #برمجة الموقع من الصفر أو #الووردبريس ؟
الووردبريس : نظام إدارة محتوى سهل الإستخدام ومجاني ،
لا يحتاج لغات برمجة مثل php ،
ممكن أي شخص يعمل لك موقع كامل وجاهز من غير ما يعرف يكتب سطر برمجي واحد بإستخدام الووردبريس !!!
كيف نطور المنطق لدينا كمبرمجين Programming Logic :
1- التفكير في حل المشكلة البرمجية : عن طريق تقسيمها إلى أجزاء أصغر وكتابته على ورقة
2- التمرين والتطبيق العملي بكثثثثثثثثثثثثرة
3- نتعلم الخوارزميات و هيكل البيانات DS
4- ألعاب الذكاء مثل الشطرنج
5-تعلم نماذج البرمجة
بما إني بدأت الإسبوع الماضي أتعلم
#flutter
,
قررت أعمل مشروع كامل كتطبيق عملي على اللي إتعلمته
لقيت في اليوتيوب دورة كاملة تتكون من 4 ساعات راح أبدأ فيها
من اليوم وأشارككم رحلتي في التعلم
اللي حاب يشاركني الرحلة الله يحييه 💪💪
رابط الدورة:
1-إضافات تسهل إستخدام محرر Visual Studio Code :
-Auto Rename Tag :
تحديد Tag النهاية تلقائيا عند تحديد Tag البداية HTML
-Bracket Pair Colorizer :
يلون كل زوج من الأقواس بلون مختلف عن اللي بعده
-Live Server :
تفتح كود HTML على المتصفح في السيرفر وتعمل تحديث تلقائي عند كل تغيير
السر العظيم خلف نجاح أي مبرمج في الحياة :
الاستمرارية
الاستمرارية
الاستمرارية
الاستمرارية
الاستمرارية
بدون إنقطاع , وبنفس عدد الساعات التي بدأ فيها
قليل متصل خير من كثير منقطع ....
#ثريد اليوم : ماذا يقصد ب RESTِ API ؟
بالبداية ماذا يقصد ب API :
ِِApplication Programming Interface
راح أشرح لكم المعنى عن طريق مثال سمعته :
المطعم يتقسم إلى قسمين :
1 - مكان الخدمة اللي يجلسوا فيه زبائن : مرتب ونظيف 💫✨ , هذا هو الفرونت إند Front-end لاي موقع
#ثريد اليوم عن الحوسبة السحابية Cloud Computing
لو شركة تقنية لها فرع واحد , وقررت تفتح لها عدة فروع في مدن مختلفة على سبيل المثال
التكلفة 💸, عددالموظفين 🧑🤝🧑, محدودية المصادر 🗃️
قد تكون من الامور التي تعيق توسع الشركة
الحل ؟
الحوسبة السحابية ☁️☁️
في #ثريد اليوم راح أتكلم عن مطور الواجهة الخلفية للموقع
Backend Web Developer :
يقصد به تطوير موقع الويب من جهة الخادم (Server-Side Development ) و يتكون من عمليات تحدث خلف الكواليس غير مرئية للمستخدم عكس الواجهة الامامية للموقع
📍أنواع data structure :
- array
-linked list
-stack
-queue
-binary
-hash table
-matrix
-heap
-graph
الشاطر يفتكر في اي مادة درستها واسم الدكتور في التعليقات ؟
راح أنزل كل خميس تحدي برمجي بسيط , تكون فيه معلومة أو تصميم مختلف (على الأقل بالنسبة لي )
نبدأ في ثاني تحدي تصميم ب glass morphism
المدة ⌛️ إلى الأربعاء القادم
اللغات والتقنيات 👩💻 اللي يناسبك
لكم حرية استخدام الاشكال والالوان 🎨
متحمسة أشوف إبداعكم 😍😍
كيف تتعلم البرمجة :
- ابحث في الجواب في google.
- إبحث عن فيديو يشرح المشكلة.
(أكاد أجزم جميع المشاكل البرمجية لها فيديو على اليوتيوب)
- ابحث عن فيديو آخر مرة أخرى.
- كرر الفيديو مرة ومرتين.
- تطبيق ماتم مشاهدته برمجيا .
- التكرار مع الفهم.
-يمكن إيجاد طريقة أخرى للحل .
المبرمج ليس من مهامه 🛑🛑🛑:
- يعرف يصلح الطابعة🖨️
- يعرف كلمة سر الايميل📩
-يصلح الايفون إذا علق على شعار التفاحة 📲
- فيس بوك هاكر 🕵️♀️
- ينشأ لك موقع مجانا 🖥️
😂😂😂😂
بعض Tricks المفيدة للكمبيوتر :
- لتسريع الجهاز أضغط على :
1- windows + r
2- type "clearmgr"
3- Delete
- لوحة مفاتيح تحتوي على Emoji :
اضغط على زر windows + . معا
- لحذف اي عنصر بشكل نهائي من الجهاز :
اضغط على shift + delete
- لقفل الجهاز بشكل فوري :
إضغط windows + l
أدوات المتصفح تفيد المبرمجين1 :
- GO Full Page:
تأخذ صورة كاملة للموقع من وإلى .
-Enhanced GitHub :
تضيف بعض الخصائص على موقع GitHub لتسهيل الاستخدام مثل :إضافة حجم وزر تحميل لكل ملف
-Enable Right Click :
تمكين النقر بزر الماوس الأيمن في بعض المواقع التي لا تسمح بذلك
5 مفاهيم رئيسية لأي لغة برمجية 🖥️🖥️:
1- المتغيرات Variables:
2- Control Structure : loop , while , for , if ..etc
3-Syntax :
كل لغة برمجية لها وطريقة وأوامر معينة في الكتابة
4-Data Structure
5-Tools : كل لغة برمجية لها العديد من الادوات الخاصة بها
5 مفاهيم رئيسية لأي لغة برمجية 🖥️🖥️:
1- المتغيرات Variables:
2- Control Structure : loop , while , for , if ..etc
3-Syntax :
كل لغة برمجية لها وطريقة وأوامر معينة في الكتابة
4-Data Structure
5-Tools : كل لغة برمجية لها العديد من الادوات الخاصة بها
بعض الاختصارات التي يجب أن يعرفها مطور الويب 💻💻 :
- DOM
Document Object Model
-FTP
File Transfer Protocol
-GUI
Graphical User Interface
- MVC
Model View Controller
-Json
JavaScript Object Notation
-IDE :
Integrated Development Environment
5 مفاهيم رئيسية لأي لغة برمجية 🖥️🖥️:
1- المتغيرات Variables:
2- Control Structure : loop , while , for , if ..etc
3-Syntax :
كل لغة برمجية لها وطريقة وأوامر معينة في الكتابة
4-Data Structure
5-Tools : كل لغة برمجية لها العديد من الادوات الخاصة بها
GSAP ماهو ال
GSAP (GreenSock Animation Platform)
عبارة عن مجموعة أدوات بلغة الجافا سكريبت قوية تحول مبرمجي الويب إلى أبطال خارقين في مجال
Web Animation
حيث يمكن تحريك عناصر الويب بأداء عالي و تعمل في كل متصفح رئيسي عن طريق كتابة كود سهل وبسيط جدا
#ثريد اليوم
الفرق بين #برمجة الموقع من الصفر أو #الووردبريس ؟
الووردبريس : نظام إدارة محتوى سهل الإستخدام ومجاني ،
لا يحتاج لغات برمجة مثل php ،
ممكن أي شخص يعمل لك موقع كامل وجاهز من غير ما يعرف يكتب سطر برمجي واحد بإستخدام الووردبريس !!!
@PProgrammer_
@programming_4
#ثريد اليوم : ماذا يقصد ب RESTِ API ؟
بالبداية ماذا يقصد ب API :
ِِApplication Programming Interface
راح أشرح لكم المعنى عن طريق مثال سمعته :
المطعم ينقسم إلى قسمين :
1 - مكان الخدمة اللي يجلسوا فيه زبائن 🍱 : مرتب ونظيف  , هذا هو الفرونت إند Front-end لاي موقع
3 نقاط للحفاظ على الحماس والشغف أثناء تعلم البرمجة :
1- التوقف عن مشاهدة الكثير من الدورات 📺: (عانيت من دي النقطة شخصيا خصوصا في الدورات الطويلة)
2- بناء مشروع حقيقي (عامل محفز جدا 👍)
3- الانضمام الى المجتمعات البرمجية والتعرف على المبرمجين اللذين مروا بنفس التجربة 👩💻🧑💻
اذا كنت مبرمج مبتدي او تفكر في تعلم البرمجة :
- البرمجة ليست محصورة على طلاب الحاسب
- الرياضيات ليست اهم شيء
- لاتحتاج الى جهاز احترافي وغالي
- يمكن تعلم البرمجة تعلما ذاتيا
- أفضل طريقة لتصبح مبرمج هي أن تبدأ تبرمج
- لا تحتاج الى الإلمام بكل شي
أكبر عائق يواجه مبرمج الويب أو التطبيق عند إنشاء موقع شخصي
التصميم تتفقون ؟
صار لي أكثر من شهرين مو قادرة أخلص موقعي بسبب انه
عندي خيال مبدع لكن أفتقر الى مهارة التصميم
إيش تقترحوا علي ؟
نصائح مهمة لكتابة كود CSS نظيف ومرتب :
- تجنب إستخدام important إلا عند الحاجة
- عدم تكرار الخصائص في كل الكلاسات (يفضل جمع المتشابهة في كلاس منفصل)
- إستخدام الاختصارات :
padding : 20px 10px 10px 30px ;
بدلا من : padding-top:20px; padding-right:10px;
مفاهيم خاطئة عن البرمجة :
- لازم أكون ممتاز في الرياضيات عشان أتعلم البرمجة - مو ضروري
- كبرت على تعلم البرمجة - لا يهم العمر
- راح أتعلم أفضل لغة برمجة - مافي أفضل لغة برمجة في لغة مناسبة
- أحتاج إلى شهادة جامعية - البرمجة مهارة يمكن إكتسابها عن طريق التعلم الذاتي
-