محمد ربيع زليول

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

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

أولًا، وقبل إختيار أي مجال، يجب عليك التعرف على المجالات والإختلافات بينها، وبعد ذلك قم بإختيار المجال الذي تحبه، والذي وجدت أنك أقرب إليه. ولفهم المجالات سأحاول شرح الطريقة التي يمر بها إعداد المواقع الكبيرة: في المواقع الكبيرة وبعد تحديد الأهداف ومحتويات الموقع من طرف الإداريين: يقوم فريق "تصميم الواجهات" بصياغة تصور وإعداد تصاميم عن طريق برنامج الفوتوشوب وبرامج أخرى، تحتوي التصاميم على إرشادات ومتطلبات الإداريين، وهي تمثل عرض توضيحيًا للطريقة التي سيكون عليها الموقع أو تطبيق الهاتف، كما أنهم يحددون الخطوط والألوان المستخدمة ... في المرحلة الثانية، تقدم التصاميم "لمطوري الواجهات"، دور مطور الواجهات هو تحويل هذه التصاميم التي يمكننا أن نقول عليها صورًا، إلى موقع حقيقي عن طريق إستخدام لغات ك HTML، CSS والجافا سكربت. بعد ذلك يمر هذا الموقع لمرحلة أخرى، وهي المرحلة التي يتم ربط الواجهة بها، مع قواعدة البيانات وجعل هذه المواقع مواقع تفاعلية، تقبل إدخال المعلومات وعرضها، والتعليق بها والإعجاب بها ...، وهذا هو دور مطور النظم الخلفية Backend. هذه هي مراحل إنشاء المواقع، وهذا بإختصار دور كل من مصمم واجهات المواقع ومطور واجهات المواقع وأخيرًا مبرمجو Backend. ملحوظة: في المشاريع الصغيرة، يمكن لشخص أن مصمم ومطورًا في نفس الوقت، بمعنى أن يقوم بخطوتين او أكثر في نفس الوقت، وهناك من يستغني مرحلة التصميم. حاولت إعطائك تعريفًا مختصرًا عن كل دور، يمكنك الحصول على معلومات أكثر من خلال صفحات الدورات من هنا: تطوير واجهات المستخدم تطوير التطبيقات باستخدام لغة JavaScript تطوير تطبيقات الويب باستخدام لغة PHP تطوير تطبيقات الجوال باستخدام تقنيات الويب ستجد في هذه الصفحات شرحًا لكل دور ولكل مسار، يمكنك بعد فهمك لمختلف المسارات إختيار المسار الأقرب إليك وإتباعه.

البرمجة الكائنية التوجه هي العمود الفقري للعديد من اللغات البرمجية، لكنها ليست الوحيدة، هناك أنماط أخرى في البرمجة سأذكر منها الأنماط التالية: Functional procedural Event-driven من خلال كلامك فهمت أنك بدأت تدرس بعض الأشياء المعقدة وبدأت الأمور تصبح صعبة لديك، وهذا شيء عادي، كلما زاد تعمقنا في دراسة شيء ما، زادت صعوبة إستعابنا له. بالنسبة لمصادر التعلم، فأنا لا أفضل الكتب البرمجية، لأنها رغم إحتوائها على محتوى جيد، لكن توجد بها تفاصيل غير مفيدة، ولو حاولت فهمها ستضيع وقتك لا أكثر، ولن تحتاجها فيما بعد. أنا أفضل التعلم عن طريق الفيديو وأفضل الدروس التطبيقية على الدروس النظرية، لأن الهذف يبقى في الأخير تطبيق ما تعلمه. أؤمن أن البرمجة ولدت لحل المشاكل، فأنا أقوم بتعلم الأشياء الجديدة، عندما تواجهني مشكلة معينة، أحاول دائمًا دراسة الأشياء بسطحية في البداية، ولا أخوض فيها كثيرًا، أحصل على العناوين الرئيسية ثم أتوجه لتطبيق ما تعلمته ﻷنه وعند التطبيق تفهم الأشياء وماهيتها، وبعد التطبيق وفهم الموضوع، يمكنني العودة ودراسة التفاصيل. لا أدري ما هي المواضيع التي صعب عليك فهمها، إن كنت تتحدث عن Design Patterns مثلًا فهذا الموقع يشرح المواضيع بشكل مبسط ورائع: الموقع. إذا حددت لي ما أنت في طور تعلمه يمكنني تقديم بعض المصادر الجيدة لك.

المشكلة هنا، هي مشكلة توافق مع الهاتف، صفحة HTML الخاصة بك، تحتاج لإضافة بعض الأكواد لتصبح صفحة متجاوبة مع مختلف أحجام الشاشات. لعمل هذا هناك عدة إختيارات متاحة سأذكرها في الأسطر القادمة، لكن تأكد اولًا من إضافة هذا الوسم في جزء head الخاص بصفحتك. <meta name="viewport" content="width=device-width, initial-scale=1.0"> الوسم السابق يسمى «التكبير الذكي» (smart zoom) وهو وسم يُستخدم في الأساس لتعديل حجم الصفحة بشكل متناسب، أعتقد انه سيحسن من مظهر الصفحة قليلًا. المهم لعمل صفحات HTML متجاوبة يمكنك: 1. إستخدام خاصية media query: بحيث تقوم بتحديد أبعاد العناصر لكل حجم من أحجام الشاشة، مثلًا تقوم بكتابة التالي: @media screen and (max-width: 1200px) { .menu { width: 100%; } } @media screen and (min-width: 1200px) { .menu { width: 30%; } } ومعنى الكود أعلاه، أنه إن كان حجم الشاشة أصغر من 1200 بكسل سيكون menu بعرض 100%، أما إن كان حجم الشاشة أكبر من 1200 بكسل إجعل menu يحصل على 30% من حجم الشاشة. وهكذا تقوم بذلك بالنسبة لعناصر HTML الخاص بك حيث تحدد أبعادها في مجموعة من قياسات الشاشة وغالبًا ما تستخدم القياسات التالية: ( 320 بكسل، 480 بكسل، 600 بكسل، 768 بكسل، 900 بكسل، 1024 بكسل، 1200 بكسل). يمكنك الحصول على تفاصيل أكبر من خلال هذا الرابط: مدخل إلى شبكات CSS العصرية (CSS Grids). 2.إستخدام شبكات CSS العصرية (CSS Grids): تزوّدك شبكات CSS بطريقة سريعة لبناء المواقع المتجاوبة، حيث أنها تساعد في تعديل تموضع عناصر HTML الخاصة بك عن شبكة من الأسطر rows والأعمدة columns والخلايا cells، لا تقلق ستجد في الرابط التالي شرح كامل لإستخدامها: مدخل إلى شبكات CSS العصرية (CSS Grids). 3.إستخدام إيطارات عمل: هناك العديد من إيطارات العمل التي ستوفر عليك الوقت، وستساعدك في جعل القالب الخاص بك متجاوب عن طريق إضافة بعض كلاسات CSS لكود HTML الخاص بك وأذكر من بينها: Boostrap: تعرّف على Bootstrap 3 ونظامه الشّبكي (Grid System) Foundation: أساسيات إطار عمل Foundation: النّظام الشّبكي Skeleton: وهي مكتبة صغيرة وبسيطة لعمل تصاميم متجاوبة ( أستخدمها شخصيًا في المشاريع الصغيرة).

أعتقد أن دورة تطوير التطبيقات باستخدام لغة JavaScript دورة مناسبة لك، لأنه عن طريق هذه الدورة وعن طريق لغة JavaScript يمكنك إنشاء تطبيقات ويب بإستخدام React.js، وفي نفس الوقت يمكنك تعلم إنشاء تطبيقات الهواتف للأندرويد و IOS عن طريق React Native. الدورة تبدأ من أساسيات Javascript، ثم تنتقل لشرح طريقة بناء تطبيقات ويب بإستخدام React.js، كما أنها تشرح Node.js التي يمكنك من خلالها تطوير النظم الخلفية، وأخيرًا الدورة تعلمك بناء تطبيقات الجوال عن طريق React native، وبطبيعة الحال ستمكن من تطبيق ما تعلمته خلال الدورة أولًا بالإضافة لمشروع تطوير تطبيق محادثة شبيه بتطبيق WhatsApp. يمكنك الإطلاع على مزيد من التفاصيل من خلال الرابط التالي: تطوير التطبيقات باستخدام لغة JavaScript.

لو ممكن توضح السؤال أكثر، حتى أستطيع إجابتك؟

لتصميم قالب وردبريس، عليك القيام أولًا بعمل قالب ثابت عن طريق لغات HTML وCSS. ثم تحويل القالب إلى قالب ووردبريس. ستجد في الروابط أسفله سلسلة تشرح تحويل قالب HTML ساكِن إلى قالب ووردبريس متجاوب. كيف تحوِّل قالب HTML ساكِن إلى قالب ووردبريس متجاوب: التحضير للتحويل، نسخ الملفات وتفعيل القالب كيف تحوِّل قالب HTML ساكِن إلى قالب ووردبريس متجاوب: تخصيص الموقع كيف تحوِّل قالب HTML ساكِن إلى قالب ووردبريس متجاوب: ملف index ، single و page كيف تحوِّل قالب HTML ساكِن إلى قالب ووردبريس متجاوب: ملفات حول الموقع، الاتصال، البحث والتعليقات

بالنسبة لل hover يمكنك عمله بالطريقة التالية: تخيل معي أنك تملك عنصر A وعنصر B <div id="itemA">Item A</div> <div id="itemB">Item B</div> يمكنك إضافة CSS بالشكل التالي، بحيث إذا تم عمل hover على العنصر A سيتغير style العنصر B: #itemA:hover + #itemB { background: red } اما بالنسبة لل click فعليك إضافة أكواد بالجافا سكربت لتغير استيل عنصر A عند الضغط على العنصر B. بالنسبة للكود الخاص بك، أقترح عليك جمع عناصر h4 مع الأيقونات i كالتالي: <div class="items-nav"> <div class="active"> <i class="fas fa-home fa-lg"></i> <h4 class="active">home</h4> </div> <div> <i class="fas fa-user fa-lg"></i> <h4>about</h4> </div> <div> <i class="fas fa-cogs fa-lg"></i> <h4>resume</h4> </div> <div> <i class="fas fa-home fa-lg active"></i> <h4>service</h4> </div> <div> <i class="fas fa-clipboard fa-lg"></i> <h4>portofilo</h4> </div> <div> <i class="far fa-address-card fa-lg"></i> <h4>blog</h4> </div> <div> <i class="fab fa-blogger-b fa-lg"></i> <h4>contact</h4> </div> </div> هكذا سيسهل عليك التعامل مع العناصر، كأنها عنصر واحد.

فقط قومي بتشغل الكود عن طريق الضغط مرتين على ملف index.html، المشكلة التي تظهر لك فقط من editor الذي تشتغلين به، بعد فتح الكود على المتصفح ( عن طريق الضغط مرتين على ملف index.html )، سيشتغل الكود بشكل جيد ( ستلاحظين أن عبارة Hello اختفت وظهرت عبارة Hello in js).

هل تضهر نفس المشكلة؟ إن أمكن إرسال صورة بالمشكلة والكود للتحقق.

يحتوي الكود الخاص بك على خطأ بسيط. قمت بتكرار النداء لملف file.js مرتين، قمي بحذف النداء الأول. الكود الخاص بك: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Learn JavaScript</title> <script src="file.js"></script> <!-- قمت بتكرار هذا السطر مرتين --> </head> <body> <div id="text">Hello</div> <script src="file.js"></script> <!-- قمت بتكرار هذا السطر مرتين --> </body> </html> بعد حذف النداء الاول، يصبح الكود كالتالي: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Learn JavaScript</title> </head> <body> <div id="text">Hello</div> <script src="file.js"></script> <!-- يجب وضع ملف سكربت في آخر الصفحة هنا --> </body> </html> المشكلة هنا في الترتيب، يجب أولًا أن تظهر العناصر ثم نقوم بنداء كود الجافا سكربت. عند قيامك بنداء كود الجافا سكربت أولًا، عنصر document يكون غير محمل بعد، كما أن بقية العناصر كالعنصر الذي يحتوي على id="text" لم يتم إنشائه بعد، ولذلك تضهر المشكلة Error document is not defined أو من الممكن أن يظهر مشكل ك Cannot set property 'innerHTML' of null.

بإمكانك عرض فكرتك على موقع مستقل https://mostaql.com للبحث عن مستقلين لإنجاز المشروع المطلوب, قم باضافة مشروعك مع تحديد الميزانية المناسبة, سوف تجد هناك عروض مناسبة إن شاء الله للقيام به. يمكنك حينها مقارنة العروض، والاطلاع على اعمال المستقلين السابقة واختيار ما يناسبك، سيساعدك هذا في معرفة أدق لتكلفة.

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

يمكنك البحث عن بعض الدوارات على اليوتوب أو دورات مجانية على منصة Udemy، هناك أيضًا بعض الكوبونات التي تستطيع من خلالها الحصول على بعض الدورات المدفوعة بشكل مجاني. بالنسبة ل C# و Xamarin، يمكنك أن تحصل على محتوى جيد من خلال هذه القناة على اليوتوب: القناة. تحتوي القناة على سلسلة لشرح sql server لكني لم يسبق لي مشاهدتها.

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

ما الذي تستخدمه؟ هي نفس الطريقة بالنسبة ل google وfacebook و Twitter، الكل يعتمد على الطريقة.

إن كنت تستخدم express، أنصحك بإستخدام مكتبة passport، تقدم المكتبة خيارات لتسجيل الدخول عن طريق مختلف مواقع التواصل الإجتماعي، والتي من بينها Twitter طبعًا.

لإضافة تسجيل الدخول عن طريق تويتر يجب عليك أولًا القيام بالخطوات التالية: التسجيل كمطور على تويتر: يمكن القيام بذلك من هذا الرابط. إنشاء تطبيق على منصة Twitter: يمكنك إنشاء تطبيق من خلال الرابط التالي، قم بالدخول وانشاء تطبيق عن طريق ملئ الحقول الازمة، حقل callback URL هو الرابط الذي ستقوم من خلاله بإعادة توجيه المستخدم بعد تسجيله للدخول، كما أنه عليك التأكد من تحديد الخيار "السماح باستخدام هذا التطبيق لتسجيل الدخول باستخدام Twitter". احصل على مفاتيحك: بعد إنشاء تطبيقك ، ستتمكن من الحصول على مفتاحي العميل Consumer Key و Consumer Secret من علامة التبويب Keys and Access Tokens في صفحة التطبيق. تحقق من أذوناتك: إذا كنت ترغب في استرداد البريد الإلكتروني للمستخدم لتسجيله في تطبيقك ، فعليك تغيير أذوناتك في تبويب الأذونات في صفحة التطبيق. حدد الخيار "طلب عنوان بريد إلكتروني من المستخدمين". ثم عليك البحث عن مكتبة للقيام بعملية تسجيل الدخول، تختلف المكتبات من لغة برمجية لأخرى وتحتاج هذه المكتبات Consumer Key و Consumer Secret للعمل.

اولًا علينا أن نتفق على أن تطبيقات الويب هي المواقع، وتطبيقات الهاتف هي تطبيقات Android و IOS. إذن مثلًا دورة تطوير تطبيقات الويب باستخدام لغة PHP أو دورة تطوير تطبيقات الويب باستخدام لغة Ruby، هي دورات لتعلم إنشاء المواقع وفي كل دورة اللغة البرمجية المستعملة في إنشاء المواقع مختلفة. أما دورة تطوير تطبيقات الجوال باستخدام تقنيات الويب فهي دورة تعلمك تطوير تطبيقات الجوال، عن طريق لغات في وقت مضى كانت تستخدم فقط في تطوير المواقع، وهذه اللغات هي HTML وCSS وJavaScript بالإضافة لإيطار عمل cordova. أما دورة تطوير التطبيقات باستخدام لغة JavaScript، فهي دورة تعلمك تطوير المواقع ( تطبيقات الويب ) بالإضافة لتطوير تطبيقات الهواتف على منصتي Android و IOS.

لن تحتاج لمعارف سابقة لمتابعة دورة تطوير تطبيقات الجوال باستخدام تقنيات الويب لأن الدورة ستبدأ معك من الصفر. يمكنك الحصول على تفاصيل الدورة من خلال الصفحة التالية: دورة تطوير تطبيقات الجوال باستخدام تقنيات الويب.

نعم المشكلة من الكود التالي، قم بحذفه. div#lastnews div#HTML8 { background: transparent; padding: 0; border: 0; margin: 0; } #lastnews:before { content: "آخر الأخبار" !important; }

بالنسبة لكود الجافا سكربت فهو غير مكتوب بالطريقة الإعتيادية، "الكود مشفر". المهم بعد محاولة لقراءة محتواه وبحثي داخل أكواده، وجدت أن كود جافاسكربت المشفر ليس هو المسؤول عن الحركة والتوقف لكن الحركة والتوقف لها علاقة بوسم <Marquee>. السطر 50 يبدأ بالكود التالي: var _0x96be = [ '<marquee behavior="scroll" onmouseover="this.setAttribute(\'scrollamount\', 0, 0);" onmouseout="this.setAttribute(\'scrollamount\', 6, 0);" قم بتغير هذا الجزء ليصبح كالتالي: var _0x96be = [ '<marquee behavior="scroll" onmouseover="this.stop();" onmouseout="this.start();" ملاحظة: لم تحدث معي المشكلة الثانية. الكود الكامل بعد إضافة خاصية التوقف. الكود.

بالنسبة للمصادر فهي متواجدة، سواءًا على xamarin أو flutter. لغة C# قريبة من VB لكن هناك اختلافات، أما بالنسبة ل flutter فهي تعتمد على لغة Dart، وهي لغة مختلفة عن جافا و VB ... flutter غنية جدًا، تحتوي على العديد من المكتبات ولها دعم قوي من جوجل، وهي حديثة بالمقارنة ب Xamarin لذلك أنصحك بتعلمها لقوتها ولأنها مطلوبة في سوق الشغل بشكل كبير.

هناك أشياء يجب معرفتها أولًا، مهما كانت قدرة هذا المحول على تحويل تطبيقات Android إلى IOS يجب الإنتباه لإختلافات جوهرية بين النظامين ومن بينها: إختلاف بين تجربة التنقل في نظام Android و iOS. مثلًا تعتمد هواتف Android على 3 أزرار للتنقل ،("المنزل" و "الخلف" و "تعدد المهام"). أما iPhone بها زر "رئيسي" واحد فقط. إختلاف واجهات المستخدم (UI) لنظامي التشغيل Android و iOS. حيث يستخدم Android الـ 'Material design'، أما iOS فيعتمد على "Flat design". عليك أن تضع في اعتبارك قدرة هذا المحول ودعمه لجميع الإصدارات. إختلاف المكتبات وأطر عمل في هذين النظامين وبالتالي سنحتاج إلى أدوات ومكتبات متوافقة مع النظامين. تطبيقات IOS يجب عليها إحترام إرشادات مراجعة متجر التطبيقات، وهذه الإجراءات غير مطبقة في متجر جوجل بلاي. كما لاحظت الاختلافات بين النظامين كبيرة، وهناك صعوبة في تحويل التطبيق من لغة برمجية لأخرى، كما أنك ستواجه مشاكل في نقل المكتبات والواجهات وفي تجربة المستخدم.. المهم: من خلال بحثي في الإنترنت وجدت التالي: كان هنالك موقع لشركة ناشئة تدعى MechDome تتيح أداة لتحويل apk لل IOS لكن الموقع توقف حاليًا، على حسب المقالات أن الأداة تدعم تحويل تطبيقات تعتمد فقط المكتبات الرئيسية لجافا، لكني وجدت موقع الشركة خارج الخدمة فلم يتسنى لي التحقق من الخدمة. كما أنني وجدت أداة J2ObjC من جوجل لتحويل كود جافا إلى كود Objective C، لكنها طبعا لا تدعم الواجهات UI، يمكنك الإطلاع عليها من هنا: مكتبة J2ObjC. اذن تتبقى لك الحلول التالية: إنشاء تطبيق جديد بإستخدام لغة سويفت، ونقل نفس المميزات الموجودة على تطبيق الأندرويد إلى التطبيق الجديد، وطبعًا سيمكنك هذا من الحصول على تطبيق بأداء عالي، بتجربة مشابهة للتطبيقات الأصيلة المعدة بالسويفت، يمكنك الإعتماد على كود Android للإلهام فقط. أو يمكنك أن تقوم بعمل التطبيق الجديد عن طريق flutter أو react native، وبهذا التطبيق الجديد سيعمل على المنصتين بأداء جيد.