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

كل الأنشطة

تحدث تلقائيًا

  1. الساعة الماضية
  2. جرب هذا الحل ولكن كانت النتيجة height: 50%;
  3. الخطأ الأول فى عنصر section الذى يحوى id يساوى Home لقد قمت باعطائه الخاصية margin-top: 150px; لهذا تجد المسافة كبيرة لذلك قم بتغيرها الى 60px وسيعمل معك . اما بالنسبة للمشكلة الثانية فانت قمت بوضع الخاصية min-height: 100%; اى تشغل اصغير طول للفيديو هو 100% . ولذلك الحل هو استخدام الخاصية height لكن اعطائها قيمة ب هكذا height: 50%;
  4. ذلك هو المشروع بالتعديلات التي أخبرتك بها، مع تقليل حجم صورة الهاتف إلى 50%. وتعديل تنسيق الفيديو إلى: section#Home video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: -100; } project-web.rar
  5. يمكنك تحميل صفحة مختلفة تحوي الترجمة للغة أخرى عند الضغط على الزر الذي تريد، وهي طريقة مستخدمة بكثرة في المواقع الالكترونية بشكل عام. أي أن الرابط الحالي من الممكن أن يكون www.example.com/en للصفحة باللغة الانكليزية مثلا، والرابط التالي للغة العربية www.example.com/ar ونستخدم الزر في هذه الحالة للتنقل فقط بين الصفحتين الانكليزية والعربية: <button onclick="changeURL()">Change URL</button> <script> function changeURL() { // Change the URL to a new page window.location.href = 'https://www.example.com/ar'; } </script>
  6. عندي مشكلتين ان هناك مسافه بين ال navbar و سيكشن Home والثانيه ان خلفية الفيديو تظعر في جميع السكاشن وانا معطي كل الصفحه خلفيه ثابته 1.zip
  7. من صفحة آخر التحديثات هنا: https://academy.hsoub.com/release-notes/
  8. اليوم
  9. بخصوص التدريب، نحن الآن على أعتاب الصيف وبه ستجد summer internships وقد بدأت الآن، على مواقع التوظيف ابحث عن Summer internship أو summer training وستجد فرص مختلفة سواء في بلدك أو عن بُعد remote. ويمكنك السؤال في المجموعات التي تهتم بالبرمجة في بلدك عن فرص Summer internship، لكن عليك تجهيز الـ CV الخاص بك وتنسيقه بشكل جيد وبسيط ويمكنك الاستفادة من ميزة "بعد إتمامك للدورة سيتم الإطّلاع على سيرتك الذاتية من قبل المختصّين لدينا وتقديم ارشادات مخصّصة لك لتحسينها وكذلك على ملفّك الشخصي في مواقع العمل الحر." عليك توفير الـ CV وإرساله لمركز المساعدة للإطلاع عليه.
  10. توجد اكثر من طريق لدعم تعدد اللغات ولكن اشهرهم واكثرهم شيوعا باستخدام مكتبة جافاسكريبت خارجية تسمى "i18next". هذه المكتبة تسمح بإدارة اللغات بشكل مركزي وتبديل اللغة على الصفحة دون الحاجة لإعادة تحميلها. إعداد i18next لتبديل اللغات 1. إضافة المكتبات: لنبدأ بإضافة المكتبات اللازمة في ذيل الصفحة (HTML footer): <script src="https://unpkg.com/i18next@21.5.3/i18next.min.js"></script> <script src="https://unpkg.com/jquery@3.6.0/jquery.min.js"></script> <script src="https://unpkg.com/i18next-browser-languagedetector@6.1.1/i18next-browser-languagedetector.min.js"></script> 2. تحضير ملفات اللغة: نعمل ملفات JSON لكل لغة عايزين ندعمها. يعني لو الإنجليزية والبنغالية: // en.json { "greeting": "Hello" } // bn.json { "greeting": "হ্যালো" } 3. تهيئة i18next: هنهيء i18next في ملف JavaScript: i18next.use(i18nextBrowserLanguageDetector).init({ resources: { en: { translation: { "greeting": "Hello" } }, bn: { translation: { "greeting": "হ্যালো" } } }, fallbackLng: 'en', detection: { order: ['querystring', 'cookie', 'localStorage', 'navigator', 'htmlTag'], caches: ['cookie'] } }, function(err, t) { // معالجة DOM باستخدام jQuery لتحديث النصوص updateContent(); }); function updateContent() { $('body').find('[data-i18n]').each(function() { var $this = $(this); var key = $this.data('i18n'); $this.text(i18next.t(key)); }); } 4. تحديث HTML لاستخدام i18next: تأكد إن العناصر اللي عايز تغير لغتها معمول لها السمة data-i18n: <body> <center> <div class="switch"> <input id="language-toggle" class="check-toggle check-toggle-round-flat" type="checkbox" onclick="toggleLanguage()"> <label for="language-toggle"></label> <span class="on">BN</span> <span class="off">EN</span> </div> <h1 data-i18n="greeting">Hello</h1> </center> </body> 5. تبديل اللغات: نضيف دالة لتبديل اللغة لما الزرار يتغير: function toggleLanguage() { var newLang = i18next.language === 'en' ? 'bn' : 'en'; i18next.changeLanguage(newLang, function(err, t) { if (err) return console.error('Something went wrong loading', err); updateContent(); }); } استخدام i18next بيسهل إدارة اللغات وتبديلها، وبيسمح بزيادة دعم لغات تانية بسهولة عن طريق إضافة ملفات JSON. كمان، الطريقة دي بتحسن تجربة المستخدم بإنه يقدر يغير اللغة من غير ما يحتاج يعيد تحميل الصفحة." ولكن يوجد طرق اخري ابسط ولكن اقل شيوعا ولكن حسب استخدام الموقع بتاعك وتفضيل اي طريقه
  11. السلام عليكم كيف يمكنني الحصول على تدريب ؟ و اين ساجد فرص اكثر في بلدي ام في الوطن العربي (عن بعد) او في الخارج عن بعد ؟
  12. كيف يمكنني جعل زر التبديل بين اللغات في الصفحة مثل هذا يعمل وينقلني إلى الصفحة باللغة الأخرى عند الضغط عليه؟ https://codepen.io/TorabRamin/pen/mqrBBj
  13. عشان تفتح الملف اللي بامتداد .رار ده، اللي فيه موقع ويب بيشمل كود اتش تي ام ال و سي اس اس و بي اتش بي، لازم يكون عندك برنامج لفك الضغط يقدر يفتح صيغة ال رار دي. فيه برامج كتير ممكن تستخدمها لكده، على حسب نظام التشغيل اللي عندك: لو ويندوز: 1- وينرار او 7 زيب: - ممكن تنزل وينرار من موقعه الرسمي https://www.win-rar.com - او تنزل 7 زيب من موقعه https://www.7-zip.org/ ومجاني - بعد ما تنزل اي واحد منهم، اضغط كليك يمين على ملف hospital.rar واختار "Extract Here" او "Extract to folder" لو ماك: 1- ذا انارشيفر او كيكا: - ممكن تنزل ذا انارشيفر من متجر تطبيقات الماك - او تنزل كيكا من موقعها الرسمي https://www.keka.io - بعد تركيب اي واحد منهم، اضغط دبل كليك على ملف hospital.rar عشان يفتحه لو لينكس: 1- انرار او بيازيب: - عشان تركب انرار، ممكن تستخدم الامر "sudo apt-get install unrar" (للتوزيعات بتاعة ديبيان/ابونتو) او حاجة شبهها في توزيعتك - ممكن تنزل بيازيب من موقعها https://peazip.github.io/ - استخدم الامر "unrar x hospital.rar" في الترمينال عشان تفك الضغط لما تفك الضغط: - هتلاقي ملفات الاتش تي ام ال و السي اس اس و البي اتش بي، ممكن تفتحها بمحرر نصوص زي فيجوال ستوديو كود او سبلايم تكست - عشان تشغل الملفات اللي فيها بي اتش بي، لازم تركب خادم محلي زي زامب او مامب: - زامب: ممكن تنزله من موقعه https://www.apachefriends.org - انقل الملفات اللي فكيتها لمجلد htdocs جوا مجلد زامب - شغل خدمات ابتشي من لوحة تحكم زامب وافتح المتصفح على localhost/اسم_المجلد عشان تشوف الموقع لو عملت كده بالخطوات دي، مفروض تقدر تفتح وتشغل ملفات الموقع بتاعك بسهولة.
  14. عندي ملف حق موقع فيه html - css - php بس الملف مو راضي يفتح فكيف افتحه
  15. من اين يمكنني الدخول الى أخر التحديثات ؟
  16. السلام عليكم المشكلة هي انه البيانات تظهر بعامود واحد فقط ولا تتوزع على باقي الاعمدة ( تم ارفاق صورة ) مع العلم بالخطوة السابعة استخدمت طريقة zip longest وعملت unpacking لا اعلم اين المشكلة بالضبط اتمنى المساعدة وشكرا import requests from bs4 import BeautifulSoup import csv from itertools import zip_longest job_title = [] company_name = [] location_name = [] skills = [] #2 use requests to fetch the url result = requests.get ("https://wuzzuf.net/search/jobs/?q=programmer&a=hpb") #3 save page content/markup src = result.content #4 create soup object to parse content soup = BeautifulSoup (src, "lxml") #5 find the elements containing info we need #-- job titles, job skills, company names, location names job_titles = soup.find_all("h2",{"class":"css-m604qf"}) company_names = soup.find_all("a",{"class":"css-17s97q8"}) locations_names = soup.find_all("span",{"class":"css-5wys0k"}) job_skills = soup.find_all("div",{"class":"css-y4udm8"}) #6 loop over returned lists to extract needed info other lists for i in range(len(job_titles)): job_title.append(job_titles[i].text) company_name.append(company_names[i].text) location_name.append(locations_names[i].text) skills.append(job_skills[i].text) #7 create csv file and fill it with values file_list = [job_title, company_name, location_name, skills] exported = zip_longest(*file_list) with open("job.csv", "w" ) as myfile: wr = csv.writer(myfile) wr.writerow(["job title", "company name", "location", "skills"]) wr.writerows(exported)
  17. البارحة
  18. كل فترة يتم إضافة دورات إلى الأكاديمية، لكن ذلك بناءًا على معايير مختلفة مثل حاجة سوق العمل إلى تلك المهارات وهل هي مطلوبة في الوقت الحالي وما هي النسبة، أيضًا نسبة المهتمين بالإشتراك بالدورة، وأمور مختلفة أخرى مثل توافق الدورة مع الدورات الأخرى في الأكاديمية. لذا، لا أعدك بأن الدورة سيتم إضافتها لكن سيتم النظر في ذلك وتنفيذ الدورات حسب الأولوية، يمكنك متابعة آخر التطورات في صفحة آخر التحديثات. حاليًا الدورة التي بها يمكنك تعلم تطوير تطبيقات الهواتف، هي دورة جافاسكريبت من خلال React Native.
  19. هل سيتم طرح في المستقبل القريب اي دورات عن تطوير الالعاب للاندرويد ان كان هناك في جدولكم ام لا هذا هو السوأل واذا كان في الجدول هل هو قريب جدا ام لا
  20. دورة علوم الحاسوب مقدمة للمبتدئين في مجال البرمجة , فهي تعرف الطالب بمكونات الحاسوب و أنظمة التشغيل بالإضافة إلى أساسيات البرمجة و التفكير المنطقي. و أي شخص يريد الدخول في مجال البرمجة فعليه البدء بهذه الدورة, أما إذا كان المتعلم يمتلك خبرة سابقة في مجال البرمجة فيمكنه تخطي هذه الدورة. و بعد أن ينهي المتعلم دورة علوم الحاسوب يستطيع اختيار المجال الذي يريد التخصص فيه و يشترك بالدورة التي تناسب هذا المجال. لذلك عليك الاستمرار بمتابعة هذه الدورة اذا كنت جديد في مجال البرمجة . وبعد الانتهاء منها تستطيع التخصص في ألعاب الأندرويد. يمكنك الاشتراك بدورة تطوير التطبيقات باستخدام لغة javascript هذه الدورة تتعلم أساسيات مكتبة react native و javascript و تقوم بتطوير تطبيق جوال, و لكن بعد أن تتعلم الأساسيات عليك أن تتوسع أكثر بالاجتهاد الشخصي لتستطيع تطوير الألعاب , هناك عدة مكتبات وإطارات تعمل مع React Native وتساعد في تطوير الألعاب بشكل فعال بعض هذه المكتبات تتضمن: Expo-THREE React Native Game Engine React Native Unity Integration React Native SpriteKit
  21. اذا اردت التخصص في مجال العاب الاندرويد من اي مجال ابدا وهل استمر في دورة علوم الحاسوب؟
  22. export default defineConfig(({ mode }) => { // Load .env const env = loadEnv(mode, process.cwd(), '') process.env = { ...process.env, ...env } return { base: './', build: { outDir: 'build', }, css: { postcss: { plugins: [ autoprefixer({}), // add options if needed ], }, }, define: { // vitejs does not support process.env so we have to redefine it 'process.env': process.env, }, esbuild: { loader: 'jsx', include: /src\/.*\.jsx?$/, exclude: [], }, optimizeDeps: { force: true, esbuildOptions: { loader: { '.js': 'jsx', }, }, }, plugins: [react()], resolve: { alias: [ { find: 'src/', replacement: `${path.resolve(__dirname, 'src')}/`, }, ], extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.scss'], }, server: { port: 90, proxy: { // https://vitejs.dev/config/server-options.html }, }, } }) الدالة لدي بهذا الشكل كيف اقوم بتعديلها؟
  23. حاول إذن تحديد خيار base في إعدادات vite في ملف vite.config: export default defineConfig({ base:'./', }); بحيث تصبح مسارات الملفات نسبية.
  24. نعم من الممكن عمل عدة واجهات بالخادم لا مشكلة بذلك وتوجد عدة طرق لتلك الطريقة. فكل واجهة تجعل لها عنوان خاص بها url . وفى هذا العنوان تقوم بتحميل الملفات الخاصة بالواجهة فقط فلنفرض ان الموقع الخاص بك هو test.com . اذا ستجعل الصفحة الخاصة بالعميل هكذا test.com/dashboard مثلا للعميل و نجعل صفحة فرعية للبائع هكذا test.com/seller/dashboard وفى كل صفحة نقوم فقط بتحميل الملفات الخاصة بها . 2. ويمكن ايضا جعل العنوان واحد اى test.com/dashboard و فى السيرفر نقوم بالتحقق من نوع المستخدم وعلى حسب نوعه نقوم بتحميل الصفحة لكل مستخدم. 3. واخيرا يمكنك استخدام sub domain للموقع الخاص بك ولكن ذلك سيجعلك تقوم بانشاء مشروعين وكل مشروع على domain مختلف هكذا : tes.com/dashboard وهذا هو ال domain الرئيسى للموقع . seller.tes.com/dashboard لاحظ هنا قد قمنا بجعل ال url الخاص بالبائع مختلف عن الرئيسى ولكنه بالفعل على نفس السيرفر ولكن يعتبر مشروعين منفصلين . وهذا سيفيدك اذا اردت مثلا انشاء تطبيقين للموبايل تطبيق للبائع والاخر للعميل او فصل المشروعين عن بعض .
  25. مرحباً أحمد , نعم يمكنك فعل ذلك من خلال تصميم عدة routes لعدة مستخدمين , ويمكنك أيضاً فحص ذلك في backend ( لجعل apis أيضاً لا يمكن الوصول إليها إلا من له صلاحية ) . بالنسبة للواجهات الأمامية , يمكنك فعل ذلك باستخدام أحد المكتبات مثل React , هذا مثال يوضح كيف يمكنك تصميم هذه المنهجية : سأقوم بإنشاء تطبيق React يحتوي على صفحتين: صفحة للعميل وصفحة للبائع. ستحتوي كل صفحة على مكوناتها الخاصة وستتحول بينهما باستخدام React Router. في ملف App.js : import React from 'react'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; import CustomerPage from './CustomerPage'; import SellerPage from './SellerPage'; function App() { return ( <Router> <div> <Switch> <Route path="/seller"> <SellerPage /> </Route> <Route path="/"> <CustomerPage /> </Route> </Switch> </div> </Router> ); } export default App; في ملف SellerPage : import React from 'react'; function SellerPage() { return ( <div> <h1>Welcome, Seller!</h1> {/* Add seller-specific components and content here */} </div> ); } export default SellerPage; في ملف CustomerPage: import React from 'react'; function CustomerPage() { return ( <div> <h1>Welcome, Customer!</h1> {/* specific components for customer */} </div> ); } export default CustomerPage; ويمكنك التعديل على هذا الكود ليتضم أيضاً عدة أدوار , أي مثلاً يمكنك فحص قيمة ما إذا كان المستخدم الحالي هو seller فقم بعرض صفحات sellers , غير ذلك قم بطباعة صفحات cutsomers.
  26. قمت بالإطلاع على الكود لديك في عربة التسوق , يوجد أخطاء في frontend و backend , إليك التوضيح التالي : في قسم Frontend : عند إضافة بعض المنتجات إلى عربة التسوق والذهاب إلى عربة التسوق , سوف نلاحظ أنها لا تقوم بعرض المنتجات قم بالذهاب إلى صفحة CartPage وقم بطباعة CartItems وسوف تجد أنها مصفوفة فارغة ولا يوجد بها منتجات , وإذا قمت بعمل inspect والذهاب إلى تبويبة Network , سوف تجد أن api cart يعمل ويرجع منتجات , إذن الخطأ هو بطريقة ملئ القيم المرجعة من api في CartItems قم بالذهاب إلى ملف hook => cart => get-all-user-cart-hook , حيث أنك تقوم هنا بتعبة CartItems من Api. ستلاحظ أنه في السطر 32 الملف أنك تقوم بإسناد القيمة res.data.products ل cartItems , قم بطباعة المتغير res وسوف تجده كما في الصور في الاعلى , لاحظ أنه لا يوجد حقل بداخله يسمى products , وإنما ما نريده هو cartItems بدلا من products , فيمكنك تعديل السطر 32 ليصبح هكذا : setCartItems(res.data.cartItems) أيضاً هناك خطأ أخر , لاحظ أن القيم المرحعة من api لا يوجد بها تفاصيل المنتج ( كأسم الصنف , والمنتج والصورة وغيره ) , أي أنه يوجد خطأ أيضاً في إرجاع القيم من api ( خطاً خاص في Backend ). سوف يظهر بعض الأخطاء الأخرى ولا تعمل الصفحة , تجاهلها بينما نقوم بحل مشكلة backend وسوف يعمل بشكل صحيح . في قسم Backend: قم بالتوجه إلى api الخاص بإرجاع المنتجات ل cart , ستجده في السطر 62 ( getLoggedUserCart ) في العنوان التالي : services => cartService.js يجب علينا إصلاح هذا api ليرجع معلومات المنتجات وليس فقط id المنتج , أي يجب عليك تعديله ليصبح كالتالي : // @desc Get logged user cart // @route GET /api/v1/cart // @access Private/User exports.getLoggedUserCart = asyncHandler(async (req, res, next) => { const cart = await Cart.findOne({user: req.user._id}).populate("cartItems.product"); if (!cart) { return next(new ApiError(`There is no cart for this user id: ${req.user._id}`, 404)); } const updatedCartItems = await Promise.all( cart.cartItems.map(async (cartItem) => { if (cartItem.product) { const productDetails = cartItem.product._doc; return {...cartItem._doc, product: productDetails}; } return cartItem; }) ); const tempCart = {...cart._doc, cartItems: updatedCartItems}; res.status(200).json({ status: "success", numOfCartItems: cart.cartItems.length, data: tempCart, }); }); وانتبه لإرجاع تفاصيل المنتج بحقل اسمه product , وذلك لأنك في frontend تستخدمه بهذا الشكل . بعد تطبيق هذه الملاحظات سوف تجد أن التطبيق يعمل بشكل صحيح كم في الصورة المرفقة يوجد أخطاء أخرى في الأزرار والتصميم وغيره من الأخطاء , ما أنصحك به قم بحل الأخطاء البرمجية أولاً ثم قم بحل أخطاء التصميم .
  1. عرض المزيد
×
×
  • أضف...