اذهب إلى المحتوى

Mustafa Suleiman

الأعضاء
  • المساهمات

    9974
  • تاريخ الانضمام

  • تاريخ آخر زيارة

  • عدد الأيام التي تصدر بها

    302

كل منشورات العضو Mustafa Suleiman

  1. ببساطة، الـ Virtual DOM (الشجرة الظاهرية للعناصر) هو جزء أساسي من كيفية تحديث وعرض الواجهات في React. أي عند تحميل واجهة المستخدم لأول مرة، تقوم React بإنشاء نسخة Virtual DOM من DOM الحقيقي. وبالتالي هو مفهوم برمجي نحتفظ فيه بالتمثيل المثالي أو الافتراضي لواجهة المستخدم ضمن الذاكرة مع مزامنته مع DOM الحقيقي عن طريق مكتبة مثل React DOM، وتُدعى تلك العمليّة بالمطابقة (reconciliation). وتتكون العناصر من مكونات React التي قد تكون قطعًا صغيرة من الواجهة مثل الزر، النص، أو حتى مكونات أكبر مثل قائمة أو نموذج. ولفهم مفهوم الـ Virtual DOM بشكل بسيط وسهل، تحدث العملية بالمراحل التالية: تمثيل الواجهة (UI) في React عن طريق مكونات (Components)، والتي تتألف من عناصر DOM. عندما يحدث تغيير في البيانات أو الحالة (state) في التطبيق، يقوم React بتحديث الـ Virtual DOM بدلاً من تحديث العناصر الفعلية في DOM. بعد التحديث، يقوم React بمقارنة الـ Virtual DOM الجديد مع الـ Virtual DOM السابق. يتم اكتشاف الفروق (التغييرات) بين الـ Virtual DOM الجديد والقديم باستخدام خوارزمية فعالة. وبالتالي اعتمادًا على الفروق التي تم اكتشافها، يتم تحديث الـ Virtual DOM بشكل انعكاسي، حيث يتم تحديث فقط العناصر التي تغيرت فعليًا. يتم تحديث العناصر في DOM الفعلي بناءًا على التغييرات التي تمثلها الـ Virtual DOM. وبالتالي تخيل أنك تريد تغيير لون قطعة واحدة على اللوحة، مع الـ Virtual DOM، يمكنك ببساطة تغيير لونها على النسخة الورقية، ثم تحديث اللوحة الحقيقية فقط في تلك المنطقة، وذلك أسرع بكثير من إعادة رسم اللوحة بأكملها. بنفس المنطق، تخيل أنك تريد إضافة قطعة جديدة إلى اللوحة، ومع الـ Virtual DOM، تستطيع ببساطة إضافة موقعها ولونها على النسخة الورقية، ثم تحديث اللوحة الحقيقية فقط في تلك المنطقة، مما يوفر عليك الوقت والطاقة. https://wiki.hsoub.com/React/faq_internals
  2. تلك معضلة شائعة في بدايات تعلم البرمجة، ففي البداية تكون الأكواد بسيطة وسهلة ومع مرور الوقت تزداد الأكواد غزارة وصعوبة، ويتسائل المُتعلم هل يجب علي حفظ كل ذلك؟ عملية التعلم تقترن بالحفظ لا خلاف في ذلك، بالطبع ذلك يأتي بعد الاستيعاب، ولا أنصحك إطلاقًا بنسخ ولصق الكود دونّ فهم آلية عمل الكود ولماذا هو مكتوب بهذا الشكل، فأنت تضر نفسك أكثر ما تنفعها بتلك بنسخك ولصقكك للكود، نعم تقوم بكتابة أكواد بسرعة لكن دونّ فائدة عائدة عليك. مع الوقت ستعتاد على ما تستخدمه ويصبح الحفظ أسهل والتعلم أسهل فأسهل، وبالطبع ستنسى بعض الأشياء التي لا تستخدمها بكثرة ولا مشكلة في ذلك الجميع بنفس الحال ويقوم بالبحث عما يريده ويستخدمه مباشرًة لأنه مستوعب لما يبحث عنه لكن يريد طريقة كتابته أو تذكر بعض الوظائف والخصائص وما شابه لكنه يعلم أنه يوجد في اللغة أمر معين يقوم بتلك الوظيفة وهكذا. أي المبرمج لا يحفظ كل شيء بل يفهم ما يقوم بدراسته، ويحفظ الأمور التي سيحتاجها بشكل متكرر ويبحث عما يريد استخدامه أو تذكره، لكن بالطبع هناك أمور أساسية يجب حفظها في اللغة أو الإطار أو المكتبة. وحفظ دون فهم يعني أنك ستنسى سريعًا وستضطر إلى الدراسة مرة أخرى لأنك لم تفهم بشكل جيد. وستجد تفصيل هنا:
  3. من خلال المستند الرسمي: https://github.com/Ankit404butfound/PyWhatKit أو من خلال اليوتيوب ابحث عن شرح مكتبة pywhatkit
  4. بالطبع تستطيع ذلك، يجب أن يكون لديك حساب WhatsApp Web مفتوحًا على متصفح Chrome وتأكد من تسجيل دخولك إلى نفس حساب WhatsApp الذي تريد إرسال الرسالة منه على هاتفك. وستحتاج إلى اسم المجموعة أو رقم هاتف أحد أعضاء المجموعة، ثم استخدم الدالة sendwhatmsg_to_group لإرسال الرسالة إلى المجموعة.
  5. لا مشكلة في ذلك، فبايثون لغة مرنة وشائعة الاستخدام، وتستطيع من خلالها تطوير أي شيء تقريبًا. كبداية ستحتاج إلى مكتبات مثل pandas لإدارة وتحليل البيانات بجانب مكتبة NumPy للعمليات الحسابية على المصفوفات، وتطبيق Django أو Flask كإطار عمل لتطوير واجهة المستخدم والتفاعل مع قاعدة البيانات، أيضاً استخدام مكتبات مثل Matplotlib لرسم الرسوم البيانية إذا كنت بحاجة إلى تصور بيانات المبيعات والمخازن. وبالطبع تستطيع استخدام SQLite لإدارة قواعد البيانات أو قاعدة بيانات أخرى مثل PostgreSQL أو MySQL
  6. ليست خاصة فقط بأتمتة مهام علي الواتس، بل تشمل ميزاتها ما يلي: مهام الواتس اب: إرسال رسائل إلى جهات الاتصال أو مجموعات WhatsApp في وقت محدد. إرسال الصور إلى جهات الاتصال أو مجموعات WhatsApp. مهام يوتيوب: تشغيل مقاطع فيديو YouTube. البحث عن مقاطع فيديو YouTube. مهام أخرى: تحويل النص إلى خط اليد. تحويل الصور إلى ASCII Art. إرسال بريد إلكتروني مع رمز HTML. التحكم بجهاز الكمبيوتر عن بعد باستخدام الهاتف (نظام التشغيل Windows فقط). وكأمثلة على استخدام مكتبة pywhatkit: إرسال رسائل تهنئة أعياد الميلاد تلقائيًا إلى جهات الاتصال. إنشاء محتوى إبداعي مثل تحويل النصوص إلى رسومات خطية. أتمتة مهام روتينية مثل تشغيل مقاطع فيديو YouTube أو البحث عن معلومات. وهناك بعض المكتبات المشابهة ومنها whatsapp-web-automator لأتمتة مهام WhatsApp، بالإضافة إلى youtube-livestreaming-api للتحكم في بث YouTube المباشر.
  7. يوجد مؤتمرات عالمية مثل: ICML: المؤتمر الدولي لتعلم الآلة (ICML) هو من أقدم وأعرق المؤتمرات في مجال الذكاء الاصطناعي، يركز على البحث الأساسي في تعلم الآلة. AAAI: المؤتمر الوطني الأمريكي للذكاء الاصطناعي (AAAI) هو مؤتمر شامل يغطي جميع مجالات الذكاء الاصطناعي، بما في ذلك البحث والتطبيقات. IJCAI: المؤتمر الدولي المشترك للذكاء الاصطناعي (IJCAI) هو مؤتمر دولي رفيع المستوى يركز على البحث الأساسي والتطبيقات في الذكاء الاصطناعي. CVPR: مؤتمر الرؤية الحاسوبية والتعرف على الأنماط (CVPR) هو مؤتمر رائد في مجال الرؤية الحاسوبية ومعالجة الصور. ACL: المؤتمر السنوي للرابطة اللغوية الحاسوبية (ACL) هو مؤتمر رئيسي في مجال معالجة اللغة الطبيعية. مؤتمرات إقليمية مثل: WAIC: المؤتمر العالمي للذكاء الاصطناعي (WAIC) هو مؤتمر سنوي يقام في شنغهاي، الصين، يركز على التطبيقات التجارية للذكاء الاصطناعي. AI Arabia: مؤتمر الذكاء الاصطناعي العربي هو مؤتمر سنوي يقام في دبي، الإمارات العربية المتحدة، يركز على تطبيقات الذكاء الاصطناعي في المنطقة العربية. AI Africa: مؤتمر الذكاء الاصطناعي الأفريقي هو مؤتمر سنوي يقام في كيب تاون، جنوب إفريقيا، يركز على تطبيقات الذكاء الاصطناعي في القارة الأفريقية. وتلك ليست قائمة شاملة، بل هي مجرد أمثلة على بعض المؤتمرات المماثلة لـ NeurIPS. ويوجد العديد من المؤتمرات المتخصصة في مجالات معينة من مجالات الذكاء الاصطناعي، مثل: المعالجة العصبية: مؤتمر NIPS (NeurIPS) الرؤية الحاسوبية: مؤتمر ICCV معالجة اللغة الطبيعية: مؤتمر EMNLP الروبوتات: مؤتمر ICRA الفائدة منها تكمن في الاستفادة من محتواها، لذا إن كان المحتوى الخاص بالمؤتمر سيفيدك إذن يمكنك متابعتها، ولحضورها يجب أن تكون مدعو أو أن يكون المؤتمر متاح لحضوره عن طريق شراء تذكرة مثلاً أو ما شابه، ومن أوجه الاستفادة: تقدم المؤتمرات فرصة رائعة للتعرف على أحدث الأبحاث والتطورات في مجال الذكاء الاصطناعي من خلال حضور العروض التقديمية وورش العمل والجلسات النقاشية. فرصة مثالية للتواصل مع خبراء آخرين في مجال الذكاء الاصطناعي، سواء من خلال حضور جلسات الأسئلة والأجوبة أو التواصل بشكل مباشر مع الخبراء خلال الفعاليات الاجتماعية. البحث عن فرص العمل في مجال الذكاء الاصطناعي، حيث يمكن للمطورين التواصل مع الشركات والمؤسسات التي تبحث عن موظفين جدد.
  8. لا يوجد ما يسمى بأسرع الطرق وأسهلها، فلو كان هناك ما ذكرت لوجدت الجميع توجه إليها، كل الطرق تحتاج إلى إمتلاك مهارات ووقت ومجهود لكي تجني ثمار تعبك، والطرق السهلة إن وجدت العائد الخاص بها ضعيف جدًا والمنافسة بها كبيرة، ومن بين الطرق التي ذكرتها لعل أسهلها هو التيك توك. وبخصوص المهارات المطلوبة في العمل الحر وطرق التعلم ستجد تفصيل هنا:
  9. المشكلة الأولى خاصة بأنك لم تقبل بعض تراخيص Android SDK المطلوبة، وعليك تنفيذ الأمر التالي في منفذ الأوامر: flutter doctor --android-licenses ثم اضغط على y للقبول عند الطلب. ستحتاج إلى القيام بذلك لكل التراخيص غير المقبولة. المشكلة الثانية هي أنه عليك تحميل مجموعة العمل "Desktop development with C++" من خلال الرابط التالي: https://visualstudio.microsoft.com/downloads/ واختر إصدار Community، ثم أثناء التثبيت اختر خيار Desktop development with C++:
  10. الأمر محير بالفعل، ويجعلك تتسائل هل نحن بحاجة إلى واجهة خلفية عند استخدام Next.js؟ أولاً Next.js مبني على بيئة Node.js بالفعل، أي مضمن بداخله Node.js. ومشاريع Next.js وNode.js تستطيع نشرهم على سيرفر عادي ولا يشترط أن نشر تطبيقات Next.js على منصة تدعم الـ serverless. وتستطيع من خلال Next.js إنشاء واجهة خلفية لتطبيقك بالفعل، من خلال إنشاء API's والتعامل مع قاعدة البيانات، فكما ذكرت الإطار مبني فوق بيئة Node.js. وبشكل مفصل لنتعرف أولاً على دورة حياة طلب الجزء الخلفي وتبدو تقريبًا كما يلي: المصادقة التفويض فك تسلسل الطلب (= ضمني في NodeJS / أو اللغات ديناميكية أي يحدث تلقائيًا في الخلفية) التحقق من صحة الطلب استرجاع الكائنات ذات الصلة business logic (كيفية عمل الخادم وكيفية تفاعله مع البيانات) الآثار الجانبية Side effects (ليس فقط التخزين في قاعدة البيانات، ولكن إرسال البريد الإلكتروني، واستدعاء خدمة خارجية أخرى، إلخ) ربط نموذج البيانات برد API تنطبق تلك الخطوات سواء كنت تستخدم GraphQL أو REST أو gRPC أو أي بروتوكول آخر. وكل ذلك تستطيع تسطيع تنفيذه من خلال Next.js لا مشكلة في ذلك، وبشكل مختصر الإطار ممتاز جدًا ويغنيك عن إنشاء واجهة خلفية بشكل منفصل في حال كان المشروع يتمحور أكثر نحو الواجهة الأمامية، أما في حالة العكس فستحتاج إلى واجهة خلفية منفصلة للتعامل مع الأمور المعقدة.
  11. كتابة الأحرف العربية في C++ مشابهة لكتابة الأحرف اللاتينية تستطيع استخدام wcout أو wprintf لطباعة الأحرف العربية كالتالي: #include <iostream> int main() { // تعريف الرسالة باللغة العربية std::wstring message = L"مرحباً بالعالم!"; // طباعة الرسالة على شاشة العرض std::wcout << message << std::endl; return 0; } std::wstring message = L"مرحباً بالعالم!" هنا يُعرّف متغيرًا سلسلة باسم message ويهيّئه بالنص العربي "مرحباً بالعالم!" وتشير البادئة L إلى أن السلسلة هي سلسلة عريضة، وهي ضرورية لتخزين الأحرف العربية.
  12. لن يتمكن أي شخص من مساعدتك، بدون ذكر ما هي التقنيات التي يعمل بها الموقع، أيضًا هل البطء عند التحميل لأول مرة أم أثناء استخدام الموقع، ومن الأفضل توفير صورة لتقرير الـ Lighthouse في الكونسول كالتالي:
  13. قم أولاً بحذف مجلد.gradle ومن المفترض أن تجده في المسار التالي: C:\Users\<USERNAME>\. gradle في حال كان مخفيًا قم بإظهار المجلدات والملفات المخفية ثم احذفه. أعد الآن بناء المشروع وتفقد هل المشكلة اختفت أم لا. وفي حال استمرت تأكد من أنّ لغة نظام الويندوز لديك هي الإنجليزية وليس العربية ثم أعد تشغيل الحاسوب، وفي حال استمرت المشكلة حاول استخدام الإصدار 3.0 من flutter إذا كان لديك إصدار أعلى.
  14. يجب عمل صيانة للاب توب فالمشكلة لديك هي أن المعالج بحاجة إلى تغيير المعجون الحراري الخاص به أي المعجون الذي يتم وضعه فوقه ثم وضع المروحة فوق المعجون من أجل إمتصاص الحرارة.
  15. لديك دالة IF أو IFS. الطريقة الأولى باستخدام دالة IF متداخلة: =IF(A2="أ",300,IF(A2="ب",600,IF(A2="ج",200,""))) A2: هو الخلية التي تحتوي على الموقع. "أ": هو الشرط الأول، وهو أن يكون الموقع "أ". 300: هو القيمة التي يتم إرجاعها إذا تحقق الشرط الأول. "ب": هو الشرط الثاني، وهو أن يكون الموقع "ب". 600: هو القيمة التي يتم إرجاعها إذا تحقق الشرط الثاني. "ج": هو الشرط الثالث، وهو أن يكون الموقع "ج". 200: هو القيمة التي يتم إرجاعها إذا تحقق الشرط الثالث. "": هو القيمة التي يتم إرجاعها إذا لم يتحقق أي من الشروط. الطريقة الثانية باستخدام دالة IFS: =IFS(A2="أ",300,A2="ب",600,A2="ج",200) A2: هو الخلية التي تحتوي على الموقع. "أ": هو الشرط الأول، وهو أن يكون الموقع "أ". 300: هو القيمة التي يتم إرجاعها إذا تحقق الشرط الأول. "ب": هو الشرط الثاني، وهو أن يكون الموقع "ب". 600: هو القيمة التي يتم إرجاعها إذا تحقق الشرط الثاني. "ج": هو الشرط الثالث، وهو أن يكون الموقع "ج". 200: هو القيمة التي يتم إرجاعها إذا تحقق الشرط الثالث.
  16. بخصوص مشاريع django نقوم بإنشاء ملف باسم: .gitignore ونضع به التالي: # Django # *.log *.pot *.pyc __pycache__ db.sqlite3 media # Backup files # *.bak # If you are using PyCharm # # User-specific stuff .idea/**/workspace.xml .idea/**/tasks.xml .idea/**/usage.statistics.xml .idea/**/dictionaries .idea/**/shelf # AWS User-specific .idea/**/aws.xml # Generated files .idea/**/contentModel.xml # Sensitive or high-churn files .idea/**/dataSources/ .idea/**/dataSources.ids .idea/**/dataSources.local.xml .idea/**/sqlDataSources.xml .idea/**/dynamic.xml .idea/**/uiDesigner.xml .idea/**/dbnavigator.xml # Gradle .idea/**/gradle.xml .idea/**/libraries # File-based project format *.iws # IntelliJ out/ # JIRA plugin atlassian-ide-plugin.xml # Python # *.py[cod] *$py.class # Distribution / packaging .Python build/ develop-eggs/ dist/ downloads/ eggs/ .eggs/ lib/ lib64/ parts/ sdist/ var/ wheels/ *.whl *.egg-info/ .installed.cfg *.egg *.manifest *.spec # Installer logs pip-log.txt pip-delete-this-directory.txt # Unit test / coverage reports htmlcov/ .tox/ .coverage .coverage.* .cache .pytest_cache/ nosetests.xml coverage.xml *.cover .hypothesis/ # Jupyter Notebook .ipynb_checkpoints # pyenv .python-version # celery celerybeat-schedule.* # SageMath parsed files *.sage.py # Environments .env .venv env/ venv/ ENV/ env.bak/ venv.bak/ # mkdocs documentation /site # mypy .mypy_cache/ # Sublime Text # *.tmlanguage.cache *.tmPreferences.cache *.stTheme.cache *.sublime-workspace *.sublime-project # sftp configuration file sftp-config.json # Package control specific files Package Control.last-run Control.ca-list Control.ca-bundle Control.system-ca-bundle GitHub.sublime-settings # Visual Studio Code # .vscode/* !.vscode/settings.json !.vscode/tasks.json !.vscode/launch.json !.vscode/extensions.json .history
  17. أرجو التعليق أسفل فيديو الدورة لمساعدتك بشكل أفضل. لرفع مشروع إلى المستودع علينا تنفيذ الأوامر التالية بالترتيب في مسار مجلد المشروع في منفذ الأوامر: git init // ثم git add README.md // ثم git commit -m "first commit" // ثم git branch -M main // ثم git remote add origin https://github.com/ اسم المستخدم/repoName.git // ثم git push -u origin main وسيفيدك قراءة التالي:
  18. لا عند إجراء تغييرات في الإعدادات فقط.
  19. قمت بتشغيل xampp كمسؤول وأعد الخطوات مرة ثم حاول التشغيل:
  20. المشكلة لديك بالفعل بسبب oracle، حيث حيث يوجد خدمة service خاصة بها تعمل على منفذ 8080، وهو نفس المنفذ الذي يعمل عليه Tomcat. ولو قمت بإغلاق الـ service التي تحمل اسم tnslsnr.exe من خلال الـ task manager سيتم حل المشكلة. لكن نحن لا نريد تعطيل oracle أو التسبب في مشكلة، لذا لنقم بتغيير المنفذ الذي يعمل عليه Tomcat من خلال الضغط على config ثم service and port settings ثم اختر tomcat ثم قم بتغيير المنفذ إلى 7070 مثلاً واحفظ save.
  21. هناك طرق مختلفة لتنفيذ ذلك، منها: 1- استخدام مؤقت: أضف مؤقتًا يبدأ العد التنازلي من تاريخ الدفع الحالي إلى تاريخ الدفع القادم. قبل يوم أو يومين من تاريخ الدفع القادم، قارن قيمة المؤقت مع 0. إذا كانت قيمة المؤقت أقل من أو تساوي 0، اعرض إشعارًا للمستخدم. 2- استخدام قاعدة البيانات: أضف عمودًا جديدًا إلى جدول الطلاب لتخزين تاريخ الدفع القادم. قبل يوم أو يومين من تاريخ الدفع القادم، استفسر من قاعدة البيانات عن جميع الطلاب الذين يكون تاريخ دفعهم القادم هو نفس التاريخ. لكل طالب تم العثور عليه، اعرض إشعارًا للمستخدم. 3- استخدام خدمة إشعارات خارجية: يتوفر العديد من الخدمات الخارجية التي تقدم إشعارات للمستخدمين، مثل Firebase Cloud Messaging أو Amazon Simple Notification Service (SNS). أو الإعتماد على مكتبة مثل ToastNotificationManager لإرسال إشعارات في تطبيق الويندوز، أو عن طريق البريد من خلال مكتبة مثل System.Net.Mail ومن الأفضل تضمين معلومات مهمة في الإشعار، مثل تاريخ الدفع القادم والمبلغ المستحق، أيضًا تضمين رابط لصفحة الدفع في الإشعار.
  22. بناءًا على ما ذكرته، فأنا لا أنصحك تمامًا بإكمال الدراسة في الجامعة التي ذكرتها، فالشهادة مهمة نعم لكن ليس بذلك القدر في مجال البرمجة فهي تعطيك أفضلية وتجعلك تحتك بالأساسيات أكثر وتجعلك مميز عن شخص لما يحصل على شهادة في علوم الحاسوب. فإن لم تتحصل على ما سبق فما فائدة الدراسة لمدة 4 إلى 6 سنوات إذن، في حال كانت الشهادة مدعومة وبتكلفة منخفضة أي جامعة حكومية فلا مشكلة الشهادة الجامعية مهمة بالطبع في عالمنا العربي. لكن التكلفة مرتفعة والعائد ضعيف من حيث تحصيل المعلومات واكتساب المهارات، إذن استثمار غير جيد. فكر في التعليم على أنه استثمار في نفسك، وستتغير نظرتك تجاهه، يمكنك الدراسة في أكاديمية حسوب وإتباع مسار برمجي محدد مثل مسار الواجهة الأمامية أو الخلفية وخلافه وتحديد وقت يتراوح من 6 أشهر إلى سنة للإنتهاء من ذلك المسار. ويوجد بديل مجاني لما تدرسه بالجامعة السورية، وهو المحتوى الخاص بـ OSSU: https://github.com/ossu/computer-science
  23. بالنسبة لمنصة فيسبوك فالأمر صعب جدًا من خلال الصفحات، بينما من خلال المجموعات الأمر ممكن، من خلال إنشاء محتوى يهتم به أعضاء تلك المجموعة مثل مشاركة ما تصنعه مثلاً في حال كان من ضمن اهتمامات الجروب مثل لوحة فنية مثلاً في جروب يهتم بالفن وهكذا، وسيتسائل الجميع عن أعمالك ويمكنك مشاركتهم ذلك على الخاص. أو يمكنك الدفع لمالكي المجموعات الكبيرة والمشهورة والإعلان لديهم في المجموعة. ولديك منصة تويتر بها حرية أكبر وداعمة للقضية الفلسطينية بنسبة كبيرة جدًا، بغض النظر عن بعض القيود ولكن ما باليد حيلة مقارنًة بالمنصات الأخرى. بالنسبة لانستغرام يمكنك بدلاً من الإعلان محاولة إنشاء فيديوهات للترويج بدلاً من الصور فذلك النوع من المحتوى ينتشر بشكل أسرع، أيضًا هناك أشخاص مؤثرين تستطيع الإعلان لديهم.
  24. ما الحاجة إلى إنشاء أكثر من سيرفر؟ يكفي سيرفر واحد فقط، وهو serves لديك، نضغط عليه ثم نضغط على Databases بزر الفأرة الأيمن ثم نختر create من أجل إنشاء قاعدة بيانات جديدة: في حال استمرت المشكلة أرجو إعادة تشغيل الحاسوب، من أجل إعادة تشغيل الـ services المسؤولة عن خادم postgres
  25. حاليًا لا تشغل بالك كثيرًا بأنواع البرمجة وخلافه، فبعد دراسة الدورة والتطبيق العملي سيصبح لديك مفهوم عن ما هية الواجهة الأمامية والواجهة الخلفية. وببساطة وبدون تفاصيل معقدة، الواجهة الأمامية أصبح بجسم السيارة من طلاء وزخارف وأدوات لاستخدام السيارة، لكن هل ستسير السيارة بالشكل فقط؟ بالطبع فهي بحاجة إلى وجود محرك لكي تعمل وذلك التشبيه بالضبط هو الفرق بين الواجهة الأمامية والخلفية. حيث الواجهة الأمامية Frontend: هو الجزء الذي يراه المستخدم ويتفاعل معه في الموقع الإلكتروني. يشمل التصميم، الألوان، الخطوط، الصور، الأزرار، القوائم، كل ما هو مرئي على الشاشة. يعتمد على لغات برمجة مثل HTML و CSS و JavaScript. يركز على تجربة المستخدم وسهولة الاستخدام. أما الواجهة الخلفية Backend: هو الجزء الذي لا يراه المستخدم، و هو مسؤول عن معالجة البيانات و تشغيل الموقع. يشمل قاعدة البيانات، معالجة الطلبات، تخزين المعلومات، ربط الموقع بالتطبيقات الخارجية. يعتمد على لغات برمجة مثل Python و Java و PHP. يركز على الوظائف و الأداء. كمثال: Frontend: عندما تضغط على زر "إرسال" في نموذج على موقع إلكتروني. Backend: معالجة البيانات المدخلة في النموذج، تخزينها في قاعدة البيانات، إرسال رسالة بريد إلكتروني. هل هناك مواقع تعمل بدون واجهة خلفية؟ بالطبع وهي مواقع static بحيث لا يتغير محتواها ولا حاجة إلى تخزين بيانات في الواجهة الخلفية بها، او من الممكن أن تكون مواقع Dynamic (يتغير محتواها) لكن ليس بحاجة أيضًا إلى واجهة خلفية حيث يكفي أن نقوم بجلب بيانات من خلال API ونعرض تلك البيانات في موقعنا بناءًا على رغبة المستخدم. وستجد تفصيل أكثر ذكرته سابقًا هنا:
×
×
  • أضف...