مرحب بيكم في قناتنا التعليمية ⚡️🔥
سنقوم بالنشر والكورسات ان شاءالله ⚡️🔥
بعد دخول كل الاعضاء
ستكون المحاضرات عبارة عن نصوص وصور وفيديوهات قصيرة

يرجى التفاعل والاسئلة في التعليقات لتعم الفائدة

🎬 مقدمة كورس Web Scraping and Automation
هل فكرت يومًا كيف تقوم بعض المواقع بجمع ملايين البيانات خلال لحظات؟ أو كيف يمكن لتطبيق بسيط أن يجلب أسعار المنتجات من 5 مواقع مختلفة خلال ثوانٍ؟
في هذا الكورس الخفيف الظريف والمفيد جدًا، سنأخذك في رحلة ممتعة من الصفر حتى بناء أدوات قوية لجمع البيانات، التفاعل مع المواقع، واستخدام APIs لبناء مشاريع مفيدة في حياتك العملية والبرمجية.
ستتعلم:
كيف تفهم المواقع من الداخل.
كيف تستخرج أي بيانات تريدها.
كيف تتجاوز العقبات الأمنية.
وكيف تبني أدوات تشبه أدوات الذكاء الاصطناعي المنتشرة اليوم.
الكورس عملي، مبني على مشاريع، وسهل لأي مبتدئ حتى لو لم يكن لديه خبرة سابقة في البرمجة.
🧠 بايثون فقط، وأفكار ستفتح لك مجالات كبيرة في العمل الحر أو تطوير أدواتك الخاصة.
جهّز حاسوبك، افتح المتصفح، واستعد لدخول عالم لم تره من قبل!

:)

المحاضره الاولى ...

## 🧠 المحاضرة الأولى: فهم بنية الويب وتعامل الآلات معها

### 🎯 أهداف المحاضرة:

* فهم كيف تعمل المواقع من الداخل.
* التمييز بين HTML، CSS، وJavaScript.
* فهم ما هي البيانات القابلة للاستخلاص.
* نظرة على الأدوات التي تساعدنا في تحليل المواقع.
* تجهيز بيئة العمل للبدء بـ Web Scraping وAutomation.

---

## 🖼️ صورة توضيحية

"كيف يرى الإنسان الموقع، وكيف تراه الآلة":


---

## 🧩 1. ما هو Web Scraping؟

> Web Scraping هو عملية استخراج البيانات من المواقع بطريقة منظمة.

مثال: استخراج عناوين مقالات من موقع إخباري، أو أسعار منتجات من متجر إلكتروني.

---

## 🌐 2. ما هي مكونات صفحة الويب؟

كل موقع يتكون غالبًا من 3 أجزاء أساسية:

| المكون     | الوصف        | المثال                           |
| ---------- | ------------ | -------------------------------- |
| HTML       | هيكل المحتوى | <h1>عنوان</h1>                 |
| CSS        | تنسيق الشكل  | اللون، الخط، الترتيب             |
| JavaScript | وظائف وتفاعل | إظهار عناصر، ملء بيانات تلقائيًا |

---

## 🛠️ 3. كيف تفهم الآلة صفحة HTML؟

> عندما نزور صفحة ويب، المتصفح يعرض لنا الشكل النهائي. لكن عند البرمجة، نحصل فقط على الكود الخام (HTML).

### مثال على كود HTML لمنتج:

<div class="product">
  <h2 class="noscript">هاتف سامسونج A54</h2>
  <span class="price">5999 EGP</span>
</div>

### عند استخدام Web Scraping نبحث عن:

* العناصر <div>, <h2>, <span>…
* الفئات class="product"…

---

## 🔍 4. أدوات لفهم هيكل المواقع

### 📌 أفضل الطرق:

1. Inspect Element في المتصفح (كليك يمين > فحص)
2. أدوات المطور (Developer Tools) في Chrome أو Firefox
3. أداة Select في BeautifulSoup وSelenium لاحقًا في الكورس

---

## 💻 5. تثبيت الأدوات المطلوبة (بيئة العمل)

قبل أن نبدأ في الأكواد، نحتاج لتجهيز الآتي:

### ✅ Python (يفضل 3.10 أو أحدث)

[تحميل من الموقع الرسمي](https://www.python.org/downloads/)

### ✅ مكتبات Python:

pip install requests beautifulsoup4 lxml selenium

| مكتبة            | الاستخدام                                    |
| ---------------- | -------------------------------------------- |
| requests       | لجلب الصفحات                                 |
| beautifulsoup4 | لتحليل صفحات HTML                            |
| lxml           | لتحسين سرعة التحليل                          |
| selenium       | للتفاعل مع المواقع التي تعتمد على JavaScript |

---

## 🔒 6. الفرق بين المواقع "الساهلة" و"المعقدة"

| نوع الموقع      | الوصف                            | طريقة التعامل                   |
| --------------- | -------------------------------- | ------------------------------- |
| HTML ثابت       | يظهر مباشرة عند الفتح            | استخدم requests + BeautifulSoup |
| محتوى JS        | لا يظهر إلا بعد تشغيل JavaScript | استخدم Selenium أو Puppeteer    |
| محمي بطرق أمنية | مثل Cloudflare أو CAPTCHA        | تقنيات متقدمة لاحقًا بالكورس    |

---

## 💬 تمرين المحاضرة:

افتح الموقع التالي:
[https://quotes.toscrape.com/](https://quotes.toscrape.com/)

ثم:

* افتح Inspect.
* حاول معرفة الكود الذي يحتوي على اقتباس.
* انسخ Tag + class الخاص به.

---

## 🧭 ماذا سنتعلم لاحقًا؟

في المحاضرات التالية:

* كيفية جلب الصفحة بالكامل بالكود.
* كيف تحلل الصفحة وتستخرج البيانات.
* كيف تتعامل مع الصفحات المحمية.
* كيف تنشئ أدوات أو تطبيقات تجمع البيانات تلقائيًا.

---

## ✅ المهام المنزلية (تحفيزية):

1. جرب فتح 3 مواقع مختلفة واستخدم Inspect لمعرفة أماكن البيانات.
2. جهز Python وبيئة العمل المذكورة.
3. اقرأ عن HTML Tags الأساسية مثل: div, span, ul, li, a, img.

---



:)

المحاضره الثانيه...

🧠 المحاضرة الثانية: الفهم العملي لبنية صفحات الويب (HTML + DOM)
🎯 أهداف المحاضرة:
التعرف على مكونات صفحة الويب.
فهم طريقة هيكلة العناصر داخل الصفحة (DOM Tree).
تعلم كيفية الوصول للعناصر المهمة باستخدام أدوات المطور (DevTools).
التهيئة لاستخدام مكتبات مثل BeautifulSoup.

🧩 محتوى المحاضرة:
1. ما هي صفحة الويب فعلًا؟
هيكل صفحة الويب مبني باستخدام:

HTML (HyperText Markup Language): يحدد المحتوى (نصوص، صور، أزرار...).

CSS: يحدد الشكل والتصميم.

JavaScript: يضيف تفاعلية ديناميكية.

في Web Scraping، نحن نهتم بـ HTML لأن البيانات التي نريد جمعها تكون موجودة فيه.

2. عناصر HTML الأساسية التي نحتاج لفهمها:
العنصر الوظيفة مثال
<div> حاوية عامة للعناصر <div class="product"> ... </div>
<a> رابط <a href="...">اسم المنتج</a>
<span> عنصر نصي صغير <span class="price">25$</span>
<img> صورة <img src="image.jpg">
رائع! إليك الآن شرحًا أعمق ومبسّطًا مع صورة توضيحية لواحدة من أكثر المفاهيم تعقيدًا للمبتدئين في هذه المرحلة، وهي:
🧠 ما هو DOM؟ وكيف نفهمه خطوة بخطوة؟
🎯 أولاً: ما المقصود بـ DOM؟
DOM = Document Object Model
هو الطريقة التي يتم بها تمثيل الصفحة داخليًا في المتصفح، وهو مثل شجرة عائلة، تحتوي على عناصر داخل عناصر.
مثال واقعي:
إذا كنت ترى صفحة تحتوي على قائمة منتجات، فإن كل منتج يعتبر "فرع" في الشجرة، وهذا الفرع يحتوي على أوراق مثل (اسم المنتج، سعره، صورته).
📦 مثال على بنية HTML:
<html> <body> <div class="product"> <h2 class="noscript">اسم المنتج</h2> <span class="price">$29.99</span> <img src="image.jpg"> </div> </body> </html>
لو نظرنا لهذا الكود كبنية DOM:
<html> هو الجذر.
تحته <body>
داخل <body> يوجد <div> يمثل منتج.
داخل <div> توجد العقد (Nodes) التالية:
<h2> للعنوان
<span> للسعر
<img> للصورة
🔍 كيف أستخدم أدوات المطور (DevTools) لفحص هذه العناصر؟
افتح أي موقع واضغط F12.
اختر أداة التحديد (رمز السهم أو العدسة 🔍).
اضغط على اسم منتج، وسيظهر لك الكود الخاص به مثل:
<h2 class="noscript">اسم المنتج</h2>
هذا يخبرك أن عنوان المنتج داخل عنصر h2 وله class="noscript".
هذه البيانات هي ما سنستهدفه في Python عند استخدام مكتبة BeautifulSoup.
🧪 تجربة عملية:
ادخل إلى الموقع التالي:
👉 https://books.toscrape.com
افتح أدوات المطور.
اضغط على اسم كتاب.
راقب الكود. هل الاسم داخل <h3> أو <a> أو <div>؟
جرب تتبع السعر أيضًا بنفس الطريقة.



🧠 تلميح للمحاضرة القادمة:
الآن بعد ما عرفنا كيف نفهم البيانات داخل صفحات الويب، سنتعلم كيف نكتب كود Python يستخدم requests و BeautifulSoup لاستخلاص هذه البيانات برمجيًا.

ان شاءالله كل اسبوع فيه ساعة في محادثة جماعية للاجابة وتوضيح كل الاسئلة 🔥🔥

المحاضره الثالثه...

🧠 المحاضرة الثالثة: التعامل مع العناصر الديناميكية باستخدام Selenium
🎯 أهداف المحاضرة:
فهم الفرق بين المواقع الثابتة والديناميكية.
التعرف على Selenium للتعامل مع المواقع الديناميكية.
استخراج البيانات من صفحات تعتمد على JavaScript.
تنفيذ بعض الأوامر العملية مثل النقر، الكتابة، الانتظار.