محمد_عاطف

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

الأمر بسيط أولا يجب تثبيت الحزمة من خلال الأمر التالي : pip install requests بعد ذلك لإرسال طلب GET للحصول على البيانات من الخادم نستخدم الكود التالي : import requests response = requests.get("https://jsonplaceholder.typicode.com/posts/1") # طباعة كود الاستجابة (مثلاً 200 يعني OK) print(response.status_code) # طباعة النص الكامل للاستجابة print(response.text) # إذا كانت الاستجابة JSON يمكنك تحويلها إلى dict data = response.json() print(data["title"]) ولإرسال طلب POST لإرسال البيانات إلى الخادم مثل إرسال نموذج Form : import requests url = "https://jsonplaceholder.typicode.com/posts" payload = { "title": "test", "body": "test post", "userId": 1 } response = requests.post(url, json=payload) print(response.status_code) print(response.json()) وإليك الطرق التالية للتتعامل مع الاستجابة (response) : print(response.status_code) # كود الاستجابة print(response.text) # النص الكامل كنص عادي print(response.json()) # إذا كانت استجابة JSON print(response.headers) # معلومات ال headers وإليك مزيد من التفاصيل من خلال المقال التالي :

توجد عدة أسباب لذلك ولكن ما نتأكد منه أنه يتم إستقبال ال token بطريقة خاطئة. فمثلا من الممكن أن ال token يتم إرساله بشكل خاطئ فبعض المواقع تتطلب إرسال ال token مثلا من خلال وضع كلمة Bearer قبله هكذا مثلا : Authorization: Bearer <token> أو من الممكن أن ال token صلاحيته قصيرة جدا ولهذا فإن تاريخ إنتهاءه ينتهي قبل أن يتم إستخدامه. أيضا من الممكن أن ال token غير صحيح . ولهذا يجب عليك قراءة وثيقة ال API والنظر إلى طريقة إرسال ال token الصحيحة . وأيضا التأكد من إستخدام ال token الصحيح . إذا ظلت المشكلة هل يمكنك توضيح كيف تقوم بإرسال الطلب وتضمين ال token مع توضيح الموقع المستخدم للإطلاع على كيفية إستقباله لل token.

يوجد العديد من المواقع المجانية ولكن بالطبع لها قيود وعدد من الإستخدامات الشهرية التي لا يمكن تخطيها إلا بإشتراك . فمثلا يوجد موقع ExchangeRate Host وهو مجاني بالكامل ويدعم معظم العملات ولكن يوجد قيد وهو 100 طلب فقط خلال الشهر. أيضا يوجد FreeCurrencyAPI وهو مجاني للاستخدام الأساسي ويتطلب تسجيل للحصول على مفتاح API. يوجد أيضا CurrencyFreaks وهو مجاني مع مفتاح API. و أيضا ExchangeRatesAPI. ونعم يمكن إستخدام فقط java script دون الحاجة إلى خادم فقط تقوم بإرسال الطلبات من خلال fetch في جافاسكريبت : const API_KEY = 'your api key here'; fetch(`https://api.exchangerate.host/latest?base=USD&symbols=USD,EUR&access_key=${API_KEY}`) .then(response => response.json()) .then(data => { const usd = data.rates.USD; const eur = data.rates.EUR; document.getElementById('usd').textContent = usd; document.getElementById('eur').textContent = eur; }) .catch(error => { console.error('حدث خطأ:', error); }); ولكن المشكلة الأساسية هنا أن ال api key الخاص بك مكشوف للجميع ويمكن لأى شخص الإطلاع عليه وإستخدامه لو كان مدفوعا أو حتى مجانيا مما يجعل الموقع الخاص بك عرضة للإختراق أو إستخدام خاطئ . لهذا الأفضل إستخدام واجهة خلفية ترسل لها الطلب وفي الواجهة الخلفية تستخدم ال api key لإرسال الطلب ومن ثم إعادة البيانات دون عرض ال api key في الواجهة.

يمكن إنشاء API من خلال إطار عمل Flask بسهولة ويدعم بالطبع عمليات الإنشاء والقراءة والتعديل والحذف بسهولة . يمكنك قراءة الإجابة التالية لمزيد من التفاصيل حول ما هو ال API وكيفية إستخدام Flask في إنشاءه : ويوجد العديد من المقالات والدروس هنا على الأكاديمية يمكن الإطلاع عليها من خلال التالي : https://academy.hsoub.com/programming/python/flask/

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

الفرق بين REST و GraphQL من حيث الأداء وسهولة الاستخدام يعتمد بشكل كبير على طبيعة مشروعك وما تريد تنفيذه فيه. أولا إن REST (Representational State Transfer) هو نمط معماري يستخدم بشكل كبير لبناء واجهات برمجة التطبيقات (APIs) ويعتمد على مفهوم الموارد (Resources) والتي يتم تحديدها بواسطة عناوين URL. للوصول إلى بيانات معينة وتقوم بإجراء طلبات HTTP مثل GET و POST و PUT و DELETE إلى Endpoints محددة حيث كل نقطة نهاية تعيد مجموعة ثابتة من البيانات. أما GraphQL هي لغة استعلام لواجهات برمجة التطبيقات ووقت تشغيل لتنفيذ تلك الاستعلامات باستخدام البيانات الموجودة لديك فبدلا من نقاط نهاية متعددة أى عدة عناوين URL توفر GraphQL نقطة نهاية واحدة ويرسل العميل استعلام يحدد فيه البيانات التي يحتاجها والخادم يعيد البيانات المطلوبة فقط. وإن REST : طريقة الوصول لكل نوع من البيانات عبر URL خاص مثلا /users أو /posts وهكذا. وهو يعيد كل البيانات المحددة في الخادم. قد تحتاج لعدة طلبات للحصول على البيانات المترابطة إذا كان يوجد علاقات بين البيانات . سيتوجب عليك تعديل ال endpoint إذا تم تغير اى من الاحتياجات. أما GraphQL : فهو عبارة عن طلب واحد أى URL واحد فقط ويتم تحديد ما تريده داخل الطلب نفسه. يعيد فقط البيانات التي تطلبها بدقة دون أى زيادة. يمكن جمع كل البيانات المطلوبة في طلب واحد تستطيع تحديد الشكل النهائي للبيانات أفضل في تقليل كمية البيانات لكن من الممكن أن يكون معقد أكثر من REST. إذا يمكنك إختيار REST إذا كان المشروع بسيط أو صغير والفريق معتاد على REST وليس لديه خبرة في GraphQL أو لديك نظام يعتمد على التخزين المؤقت (caching) والتطبيق لديك يحتاج لدعم واسع من الأدوات أو مكتبات جاهزة . ويمكنك إختيار GraphQL إذا كان التطبيق معقد ويتعامل مع علاقات كثيرة بين البيانات و تحتاج لطلب بيانات بشكل مرن ومخصص حسب الحاجة وأيضا تريد تقليل عدد الطلبات المرسلة أو أنك تبني تطبيقات front-end تستهلك بيانات كثيرة مثل React أو mobile apps. وإليك مزيد من التفاصيل حول GraphQL :

إن ال encodeURIComponent هي دالة في JavaScript ونستخدمها لترميز أى تشفير جزء من عنوان URL . ووظيفتها الأساسية هي التأكد من أن القيم التي يتم إدخالها في عنوان URL لا تحتوي على رموز قد تجعل الرابط يتم كتابته بشكل خاطئ. فمثلا عند إرسال بيانات عبر URL هناك رموز معينة لها حالات خاصة، مثل: & يفصل بين المعاملات. = يفصل بين الاسم والقيمة #, /, ? إلخ. وإذا لم نقم بترميز هذه الرموز بشكل صحيح سيقوم المتصفح أو الخادم بفهمها بطريقة خاطئة. const param = "name=mohamed&age=25"; console.log(encodeURI(param)); // name=mohamed&age=25 // لم يتم ترميز ال = أو & console.log(encodeURIComponent(param)); // name%3Dmohamed%26age%3D25 // هنا تم تريز كل الرموز الخاصة إذا نستخدم encodeURIComponent عندما نريد ترميز قيم فردية داخل رابط مثل اسم مستخدم أو كلمة بحث. ونستخدم encodeURI فقط إذا كنا نريد ترميز الرابط بالكامل وتريد الحفاظ على علامات مثل ? و &. وإليك التالي لمزيد من التفاصيل :

يمكن ذلك من خلال خاصية background-clip مع text-fill-color أو background-image لتطبيق تدرج ألوان على النص. وإليك الكود من خلال إستخدام تدرج الألوان (Gradient) هكذا : <!DOCTYPE html> <html lang="ar" dir="rtl"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> .gradient-text { font-size: 48px; font-weight: bold; background: linear-gradient(to right, #ff3333, #96ff33, #9966ff); -webkit-background-clip: text; background-clip: text; color: transparent; } </style> </head> <body> <h1 class="gradient-text">Build for everyone</h1> </body> </html> حيث إستخدمنا الخاصية linear-gradient .

وعليكم السلام ورحمة الله وبركاته. حاليا النماذح المدفوعة فقط هي نماذج openAi أى GPT أما النماذج الأخرى التي سنستخدمها في الدروس الأخرى مثل Bert و Llama هي نماذج مجانية لن تحتاج إلى دفع أى شئ إضافى. ويجب عليك معرفة أن openAi كانت توفر سابقا 5 دولار مجانا عند إنشاء أى حساب جديد وكان الطلاب ليسوا مجبرين على شراء أى شئ . ولكن بالطبع مع التحديثات المستمرة والسريعة في الذكاء الإصطناعي وفي openAi خصوصا تم إلغاء هذه الخطوة فلم يتم إضافة أى رصيد مجاني عند إنشاء حساب جديد لهذا ستحتاج لشحن رصيد ب 5 دولار فقط وسيفي بالغرض لمتابعة الدروس. ولكن لو أردت عدم الدفع لا مشلكة يمكنك متابعة الدروس نظريا دون التطبيق العملي ولن يوجد أى مشكلة في ذلك . إذا أردت الإستفسار أكثر بخصوص هذا الجزء في الإختبار يمكنك محادثة مركز المساعدة وسيوضحون كل شئ لك بشكل أفضل .

يجب التأكد من تفعيل مساعد Anaconda حتى يظهر لديك . يرجى البحث عن زر أو خيار Anaconda Assistant في شريط الأدوات في الأعلى لديك في ال Notebook أو في الجانب لديك. وعادة ما يوجد خيار باسم Chat-based Python Help أو Anaconda Toolbox يرجى الضغط عليه لفتح المساعد : يمكنك إستخدام الإختصارات مباشرة لتشغيل المساعد حيث غالبا ما يكون Ctrl + Shift + A هو الإختصار لتفعيل المساعد. أيضا إذا كنت قد قمت بتسجيل الخروج من حساب Anaconda Cloud يجب إعادة تسجيل الدخول ليعمل مرة أخرى.

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

تأكد من إستيراد التنسيقات هكذا حيث لم تقم بتضمينها : import AOS from "aos"; import "aos/dist/aos.css"; بعد ذلك تأكد من وضع الكود التالي في useEffect : useEffect(() => { AOS.init(); AOS.refresh(); }, []); إذا إستمرت المشكلة قم بإرفاق ملف المشروع للإطلاع عليه.

نعم هذه هي المكتبة يمكنك التمرير إلى الأسفل والضعط على github للذهاب إلى مستودع المكتبة ورؤية الأمثلة الخاصة بها وكيفية تثبيتها وإستخدامها في الموقع الذي في الصورة هذا ما تقوم به المكتبة عن التمرير لأسفل.

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

وعليكم السلام ورحمة الله وبركاته. لاحظ أنك أولا قمت باستخدام plt.subplot(2,2,2) مرتين بدون رسم في المرة الأولى وهذا سيؤدي إلى مشكلة بسبب التعارض. يمكنك إذا أردت وضع الكود بأكمله في دالة وذلك منعا للتكرار لو تقوم بتنفيذ الكود أكثر من مرة : import matplotlib.pyplot as plt import seaborn as sns def plot_demographics(data_train, data_train_demographics): plt.figure(figsize=(12, 8)) # الرسم البياني الأول: KDE Plot plt.subplot(2, 2, 1) sns.kdeplot(data_train_demographics['adult_child'], fill=True, color='skyblue', bw_adjust=0.5) plt.title("KDE Plot of Age") plt.xlabel("Age") # الرسم البياني الثاني: Histogram plt.subplot(2, 2, 2) sns.histplot(data_train_demographics['hla_match_dqb1_high'], kde=False, color='skyblue') plt.title('Distribution of HLA Match DQB1 High') plt.xlabel("HLA Match DQB1 High") plt.ylabel("Count") # الرسم البياني الثالث: Count Plot ل TCE IMM Match plt.subplot(2, 2, 3) sns.countplot(data=data_train, x='tce_imm_match', color='blue') plt.title('Distribution of TCE IMM Match') plt.xlabel("TCE IMM Match") plt.ylabel("Count") # الرسم البياني الرابع: Count Plot ل HLA NMDP 6 plt.subplot(2, 2, 4) sns.countplot(data=data_train, x='hla_nmdp_6', color='blue') plt.title('Distribution of HLA NMDP 6') plt.xlabel("HLA NMDP 6") plt.ylabel("Count") plt.tight_layout() plt.show() # استدعاء الدالة و تمرير البيانات لها plot_demographics(data_train, data_train_demographics) أما لو أردت إستعمال OOP حيث تجعل لكل رسم دالة خاصة به وذلك لرسمه دون تكرار للأكواد يمكنك إستخدام التالي : import matplotlib.pyplot as plt import seaborn as sns class DemographicVisualizer: def __init__(self, data_train, data_train_demographics, figsize=(12, 8)): self.data_train = data_train self.data_train_demographics = data_train_demographics self.figsize = figsize self.colors = {'kde': 'skyblue', 'count': 'blue'} def plot_kde(self, ax, column, title, xlabel): sns.kdeplot(self.data_train_demographics[column], fill=True, color=self.colors['kde'], bw_adjust=0.5, ax=ax) ax.set_title(title) ax.set_xlabel(xlabel) def plot_histogram(self, ax, column, title, xlabel, ylabel): sns.histplot(self.data_train_demographics[column], kde=False, color=self.colors['kde'], ax=ax) ax.set_title(title) ax.set_xlabel(xlabel) ax.set_ylabel(ylabel) def plot_count(self, ax, column, title, xlabel, ylabel, data_source='data_train'): data = self.data_train if data_source == 'data_train' else self.data_train_demographics sns.countplot(data=data, x=column, color=self.colors['count'], ax=ax) ax.set_title(title) ax.set_xlabel(xlabel) ax.set_ylabel(ylabel) def plot_all(self): fig, axes = plt.subplots(2, 2, figsize=self.figsize) # الرسم البياني الأول: KDE Plot self.plot_kde(axes[0, 0], 'adult_child', 'KDE Plot of Age', 'Age') # الرسم البياني الثاني: Histogram self.plot_histogram(axes[0, 1], 'hla_match_dqb1_high', 'Distribution of HLA Match DQB1 High', 'HLA Match DQB1 High', 'Count') # الرسم البياني الثالث: Count Plot ل TCE IMM Match self.plot_count(axes[1, 0], 'tce_imm_match', 'Distribution of TCE IMM Match', 'TCE IMM Match', 'Count', data_source='data_train') # الرسم البياني الرابع: Count Plot ل HLA NMDP 6 self.plot_count(axes[1, 1], 'hla_nmdp_6', 'Distribution of HLA NMDP 6', 'HLA NMDP 6', 'Count', data_source='data_train') plt.tight_layout() plt.show() # استخدام الكائن visualizer = DemographicVisualizer(data_train, data_train_demographics) visualizer.plot_all() وهكذا وضعنا كل رسم في دالة داخل الصنف حيث يمكنك إستخدامها وطباعتها بشكل منفصل . وأيضا قمنا بتجميع طباعة جميع الرسومات في الدالة plot_all وبمجرد إستدعائها يصبح الكود كما الكود الذي أرفقته أنت.

يمكنك إستخدام مكتبة AOS لإضافة animation للموقع وجعل شكله أفضل وجذاب . يمكنك إضافة نموذج بداخل modal مثلا عند الضعط على زر Contact Me يظهر به النموذج وفيه بيانات الطبيب أو نموذج يتم إرساله لحجز الموعد. يمكنك إضافة قسم للتقيمات وأراء العملاء وتجعل المستخدمين يقيمون الخدمة. الموقع بسيط لهذا لا توجد إضافات كثيرة يمكنك العمل عليها .

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

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

وعليكم السلام ورحمة الله وبركاته . إذا قمت بالذهاب إلى موقع PageSpeed Insights وأظهر لك أن 64% performance فستجد أنه يخبرك بالمشاكل الموجودة والنصائح التي تجعل النسبة تزيد لديك. أولا أنصحك بإستخدام مكتبة lazyload في جافاسكريبت نظرا لوجود الكثير من الصور لديك وهذا الأمر سيجعل النسبة ترتفع كثيرا . حيث تلك المكتبة لا تقوم بتحميل الصور جميعا مرة واحدة عند تحميل الصفحة . بل تقوم بتحميل فقط الصور بمجرد دخولها إلى الجزء الظهار في الشاشة في المتصفح . فمثلا لو جميع الصور في أسفل الموقع لن يتم إرسال طلب بإحضار الصور إلى عند التمرير لأسفل وبمجرد دخول صورة إلى نافذة المتصفح يتم إرسال الطلب وعرضها في الموقع. أيضا يفضل إستخدام ال pagination إذا كان يتم عرض محتوى دايناميكي وذلك لمنع تكبير محتوى HTML بشكل يؤثر على الأداء. أيضا من المهم جدا أن تضع للعناصر مثل الصور أو العناصر التي يتم تحميلها من ال API أى التي تأخذ وقتا لإحضارها من مصدر خارجي أن تجعل لها طول وعرض ثابتين . وذلك لتجنب إزاحة المحتوي فهذا الأمر مهم ويتم إحتسابه من ضمن الأداء . حيث مثلا تخيل أن هناك زر أسفل أعلى صورة مثلا ولم يتم تحميلها حتى الآن والمستخدم يرد الضغط على جزء أسفل الصورة ولكن بمجرد تحميل الصورة تجد أن الصورة أخذت طول وعرض مما أزاح المحتوى وجعل المستخدم يضغط على الزر الخاطئ ومن الممكن أن هذا الزر يفعل إجرار لا يريده المستخدم . وهذا الأمر يقلل تجربة المستخدم والتي تقلل من الأداء. أيضا يفضل عدم تضمين ملفات js ليست مستخدمه ولو كنت لا تستخدم cdn أن تقوم بتفعيل ال cache فلا يتم تحميل الملفات الثابته كل مرة .

يتم حفظ التنبؤ والإحتمالات في جدول prediction : وإذا ذهبت إلى : http://127.0.0.1:5000/dashboard ستجد أنه يحضر النتائج التي تم حفظها في جدول prediction : إذا أردت حفظ أى بيانات أخرى يمكنك تعديل الجدول بما تريده وإضافة البيانات في ملف api.py في هذا السطر : pr = Prediction(result=y, proba=probs, user=current_user._get_current_object())

هل تقصد أن يتم إعادة توجيه المستخدم عند تسجيل الدخول أو إنشاء حساب جديد إلى صفحة ال predict ؟ إذا كان كذلك فيجب عليك في ملف auth.py أن تقوم بإعادة التوجيه إلى auth.predictفي login . وفي register تقوم أولا بتسجيل دخول المستخدم بعد إنشاءه وبعدها تقوم بتوجيه هكذا : from flask import Blueprint, render_template, request, redirect, url_for, flash from flask_login import login_user, logout_user, login_required from models import db, User bp = Blueprint('auth', __name__) @bp.route('/register', methods=['GET', 'POST']) def register(): if request.method == 'POST': u, p = request.form['username'], request.form['password'] if User.query.filter_by(username=u).first(): flash('اسم المستخدم موجود') else: user = User(username=u) user.set_password(p) db.session.add(user) db.session.commit() flash('تم التسجيل') login_user(user) return redirect(url_for('auth.predict')) return render_template('register.html') @bp.route('/login', methods=['GET', 'POST']) def login(): if request.method == 'POST': u = User.query.filter_by(username=request.form['username']).first() if u and u.check_password(request.form['password']): login_user(u) return redirect(url_for('auth.predict')) flash('بيانات غير صحيحة') return render_template('login.html') @bp.route('/predict', methods=['GET']) @login_required def predict(): return render_template('predict.html') @bp.route('/logout') def logout(): logout_user() return redirect(url_for('auth.login')) def load_user(user_id): return User.query.get(int(user_id)) وإنه بالفعل يتم حفظ البيانات في قاعدة البيانات ويجب أن تظهر لك في dbGate ولكن تأكد من الإتصال بقاعدة البيانات الصحيحة . فلو ذهبت إلى dashboard ستجد أنه يتم إعادة السجلات السابقة بالتنبؤ لهذا المستخدم.

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

هذا بسبب أنك لم تضع العناصر بداخل عنصر cards كما تفعل في دالة burger . لذلك يجب إضافة العنصر : <div class="cards"> بعد سطر 45 و 82 و 118 في ملف script.js . script.js

هل أنت مشترك في دورة تطوير الألعاب هنا ؟ إذا كان كذلك فإنه يتم شرح بالفعل كيفية إضافة الصور إلى مشروع godot وإستخدامها وإذا كانت تواجهك مشكلة في هذا الأمر فيرجى أسفل الدرس الخاص الذي به مشكلتك أن تقوم بوضع سؤالك هنا أسفل صندوق التعليقات. ولكن إليك الطريقة بالتفصيل . تأكد أولا أن الصورة لديك بصيغة تدعمها Godot مثل .png أو .jpg. وببساطة يمكنك سحب الصورة من المكان الموجودة فيه وتوجيها إلى برنامج godot وأن تفلتها داخل نافذة Godot في القسم الخاص ب FileSystem في الأسفل : ولإظهار الصورة داخل المشهد فممن شجرة العقد (Scene Tree) على اليسار قم بالضغط على + لإضافة عقدة جديدة وقم بإختيار Sprite2D أو TextureRect حسب نوع الاستخدام : ومن خصائص العقدة على اليمين (Inspector) سترى خاصية اسمها Texture قم بالضغط عليها ثم اختر الصورة التي أضفتها من الملفات : الآن سترى الصورة ظهرت داخل نافذة اللعبة.