Web Development Code
前往频道在 Telegram
قناة خاصه بتطوير الويب ونشر مشاريع الويب وكل مايخص الويب الادمن : @Noureldin13 #Html #Css #Bootstrap #JavaScript #ReactJs #Php #NodeJs #Mysql #MongoDB Buy ads: https://telega.io/c/codedevelopment جروب المناقشة : @codedevchat
显示更多5 867
订阅者
无数据24 小时
-137 天
-7130 天
帖子存档
\n\n* npm run build \n* cordova platform add android or cordova platform add ios if isset errors \n* npm fund \n* cordova platform add android or cordova platform add ios\nfinally \n* cordova emulate android or cordova emulate ios ============================= Good Luck By Mounib Kamhaz :) =============================\n\n@codedevelopment","datePublished":"2020-12-24T09:31:02Z","dateModified":"2020-12-24T09:31:02Z","author":{"@type":"Organization","name":"Web Development Code","url":"https://telemetr.io/ch/channels/1223506462-codedevelopment","image":"https://img.tlmtr.io/c/1kNHVc/5958775435800196285?ty=x"},"publisher":{"@type":"Organization","name":"Web Development Code","url":"https://telemetr.io/ch/channels/1223506462-codedevelopment","image":"https://img.tlmtr.io/c/1kNHVc/5958775435800196285?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":340},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":4}]}},{"@type":"ListItem","position":20,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/ch/channels/1223506462-codedevelopment/posts/48","url":"https://telemetr.io/ch/channels/1223506462-codedevelopment/posts/48","mainEntityOfPage":"https://telemetr.io/ch/channels/1223506462-codedevelopment/posts/48","headline":"قريبا هنزل الشرح باذن الله","articleBody":"قريبا هنزل الشرح باذن الله","datePublished":"2020-12-23T11:37:57Z","dateModified":"2020-12-23T11:37:57Z","author":{"@type":"Organization","name":"Web Development Code","url":"https://telemetr.io/ch/channels/1223506462-codedevelopment","image":"https://img.tlmtr.io/c/1kNHVc/5958775435800196285?ty=x"},"publisher":{"@type":"Organization","name":"Web Development Code","url":"https://telemetr.io/ch/channels/1223506462-codedevelopment","image":"https://img.tlmtr.io/c/1kNHVc/5958775435800196285?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":302},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":1}]}}]}
5 867
دليل مجموعات وقنوات التليجرام المفيدة 👍🏼 ----------- دليل القنوات : https://t.me/qnwat ------------ دليل المجموعات : https://t.me/groupat ل مجموعات وقنوات التليجرام المفيدة 👍🏼 ----------- دليل القنوات : https://t.me/qnwat ------------ دليل المجموعات : https://t.me/groupat
5 867
كيفية عمل ساعة بواسطة React Js
السورس كود:
https://codepen.io/mounibkamhaz/pen/WNGdedo
لمتابعتي على codepen
https://codepen.io/mounibkamhaz
@codedevelopment
5 867
نلقي نظرة اليوم على اساسيات اي موقع و التي هي
HTML و CSS و JavaScript
HTML
هو الهيكل العظمي لموقع الويب الخاص بك
CSS
هو مظهر موقعك هذا يحدد كيف سيبدو موقعك
JavaScript
هو العقل المدبر لموقعك
@codedevelopment
5 867
مواقع تهم كل مبرمج 😉
1- stackoverflow.com
طبعا دا اهمهم ودا لان اي سؤال او اي مشكله تقف معاك فمجال البرمجة خصوصا هتلاقيها وقفت مع كزا حد قبلك وهتلاقي ناس كتير مجاوبين عليها وطبعا بيجيبلك افضل الاجابات بالترتيب، ولو عندزم سؤال محدش سأله قبل كدا ممكن تكتبه وناس تجاوب عليك
2- codeacademy.com
من أهم وأشهر المواقع اللى بتقدم محتوى كبير لتعلم البرمجة والتكويد والموقع درس عليه أكتر من 45 مليون شخص لغات كتيرة مثل HTML & CSS, JavaScript and SQL حتى Bash/Shell, Python, Ruby and C++
3- teamtreehouse.com
موقع يقدم محتوى رائع فى مجال تصميم المواقع والبرمجة. الموقع بيقدملك فترة تجريبية لمدة 7 أيام وبعدها الدراسة بتكون ب 25 دولار شهريا
4- github.com
أكتر من 3 مليون مطور حول العالم موجودين ع الموقع بيناقشوا ويديروها مشروعات ويعدلوا أخطاء وبيشتغلوا مع بعض
5- codewars.com
التعلم ع الموقع بيكون مختلف وممتع لانه بيكون عبارة عن تحديات اسمها.
6- codeavengers.com
موقع رائع عليه كورسات لمراحل مختلفة حتى الأطفال من سن 5 سنوات ومافوق
7- khanacademy.org
من أهم المواقع اللى بتقدم محتوى مجانى رائع فى مجالات مختلفة
8- codeanywhere.com
الموقع يحتوى على أكثر من 350 مليون من ملفات الأكواد مفتوحة المصدر
9- codota.com
موقع مفيد جدا لمطورى تطبيقات الأندرويد تقدر تأخد أكواد التطبيقات وكل حاجة تحتاجها تخص تطبيقات الأندرويد من عليه
10- https://codepen.io/
الموقع عبارة عن شبكة تواصل اجتماعى بين المبرمجين من خلاله يتم التواصل بينهم ومشاركة الأكواد ومناقشتها
11- codeproject.com
موقع تابع لشركة مايكروسوفت للمبرمجين موجود عليه الآف المبرمجين.
@codedevelopment
5 867
لمن يريد يتعلم React js بسهولة
ليش بدك تتعلمها ؟ لأن سوق العمل طالبها و لأن شركة الفيسبوك عاملة هاي الغة و الي هي عبارة عن مكتبة جافاسكربت تقدر تتعلمها من قنوات اليوتيوب في ناس كتير شرحتها و لكن موقع لغة داعم لغة العربية يعني تقدر تدرسها و تابع تحديثاتها و اي شي عن لغة ب ( لغة العربية )
رابط لغة بلعربي : هنا
@codedevelopment
5 867
مواقع مهمه لمصممين المواقع ❤
موقع تختار منه نوع الخط
https://fonts.google.com
موقع تختار منه صور الموقع
https://www.pexels.com/
موقع تختار منه ألوان التصميم
https://coolors.co/
موقع تختار منه الأيقونات
https://fontawesome.com
موقع تتعلم منه تريكات تعملها بال CSS
https://css-tricks.com/
لو اي حاجه وقفت معاك وانت بتشتغل روح على الموقع هذا هتلاقي الاجابه
stackoverflow.com
طبعا وارد انك تنسى syntax خاص بكود معين ف تروح بقا على الموقع ده وهتلاقي بنية الكود الصحيحة
https://syntaxdb.com
موقع هتلاقي فيه كل الادوات اللي تحتاجها ک فرونت اند
http://frontendtools.com/
هذا موقع في ملخصات للغات برمجة كتير ممكن تحتاجه ف حطيته معاهم
http://overapi.com/
هذا موقع تعرف منه سرعة الموقع بتاعك
https://gtmetrix.com/
@codedevelopment
5 867
ال flex هو تقنية في css لترتيب العناصر على خط واحد، أفقي (الوضع الإفتراضي) أوعامودي.
- يتم وضع display:flex للعنصر الاب الذي يحتوي العناصر المراد ترتيبها.
- الوضع الإفتراضي، إنه العناصر تقرب من بعضها وتصير على الجهة اليسار من الcontainer.
- الآن تبدأ بالتحكم في الاب والابناء لوضع الترتيب اللي يناسبك.
📍في خصائص يجب وضعها هلى container مثل:
flex-direction: column;
اذا كنت تحتاج ترتيب الابناء بوضع عامودي. لكن سيكون الابناء برضو ملاصقين لبعض في الأعلى.
- الا اذا استخدمت احد الخصائص المحددة لتغيير هذا الترتيب.
مثلاً:
justify-content: center;
هذه مثلاً ستحعل الابناء في منتصف الcontainer بالعرض
وايضا:
align-items: center;
ستجعل الابناء في منتصف الاب عامودياً
وهذه الخصائص لها قيم أخرى مثل
flex-end, space-between, space-around, space-evenly
توجد ايضاً خاصية أخرى للcontainer وهي:
Align-content
وهي تتحكم بوضع كل العناصر الابناء ككتلة واحدة. وليس كل عنصر على حدة.
وتقبل قيم مثل:
flex-start, flex-end, center, stretch, space-between, space-around
📍خصائص الأبناء:
مجموعك من الخصائص يتم وضعها على الابناء للتحكم في سلوكهم داخل الاب.
Order
للتحكم في ترتيب الابناء داخل العنصر الاب.
flex-grow
للتحكم في كل عنصر، هل يتمدد او لا مع زيادة مساحة الاب
flex-shrink
للتحكم في كل عنصر، هل يتقلص او لا مع تناقص مساحة الاب.
flex-basis
للتحكم في عرض العنصر الابن واعطاؤه عرض معين.
align-self
هنا يمكنك تغيير القيمة المحددة مسبقاً في align-items لعنصر معين دون بقية الابناء.
هذه خلاصة اوامر الflex
بتحتاج انك تعطي القيم المناسبة في المكان المناسب لتحصل على الترتيب اللي بدك ياه.
لو ترسل شو بالضبط اللي بدك تعمله، ممكن اساعدك في اكواد مخصصة لحل المشكلة.
5 867
Convert Your React Js App To Android Or Ios With Cordova By Mounib Kamhaz
React js With Cordova
* npm install -g cordova
* npm run eject
if isset errors
* git add .
* git commit -m 'first commit';
* npm run eject
* go to config -> paths.js -> appBuild: resolveApp('www'),
* go to package.json and add after private -> "homepage": "./",
* cordova create MyApp com.example.myapp myapp
* go to MyApp and copy config.xml to your project
* go to src -> index.js and add this function
const startApp = () => {
// paste all your js code here (ex: #root ...) }
if (window.cordova){ document.addEventListener('deviceready', startApp, false);
} else { startApp(); }
* go to public -> index.html and add this code
<!-- meta tag -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
and add this before body
<script type="text/javascript" src="cordova.js"></script>
* npm run build
* cordova platform add android or cordova platform add ios if isset errors
* npm fund
* cordova platform add android or cordova platform add ios
finally
* cordova emulate android or cordova emulate ios ============================= Good Luck By Mounib Kamhaz :) =============================
@codedevelopment
