أفضل كورسات عربية لتعلّم JavaScript للمبتدئين: 🔥


1️⃣ كورس جافاسكريبت للمهندس أسامة الزيرو

https://www.youtube.com/playlist?list=PLDoPjvoNmBAx3kiplQR_oeDqLDBUDYwVv


2️⃣ كورس جافاسكريبت من أكاديمية ترميز

https://www.youtube.com/playlist?list=PLYyqC4bNbCIeLEjcSPO61bsGPKEvYceb0


3️⃣ كورس جافاسكريبت من قناة أتعلم في ساعة

https://www.youtube.com/playlist?list=PLeWmXrh00479AIgmrP7dG0-IM8NlaHgnR


4️⃣ كورس جافاسكريبت من قناة عبدالرحمن جمال

https://www.youtube.com/playlist?list=PLknwEmKsW8OuTqUDaFRBiAViDZ5uI3VcE


5️⃣ كورسات جافاسكريبت من منصة سطر
المستوى الأول:
https://satr.codes/courses/MxhtosVATL/view


المستوى الثاني:
https://satr.codes/courses/lnCDammOOq/view


المستوى الثالث:
https://satr.codes/courses/cKCPvecdYe/view

نصائح لل front end
‏قبل البدء بأي مشروع اتبع مايلي
‏١-اجعل تصميمك مناسب لشاشات الجوال قبل ان تفكر ان تجعلها مناسبة لشاشات الكمبيوتر
‏٢- اجعل حجم النص كبيرآ بما يكفي لقراءته من اصغر شاشة الى اكبر شاشة
‏٣- استخدم وحدة القياس em بدلا من px

٤-استخدم النسب المئوية لملائمة حجم الشاشة بدلآ من الأعداد الثابتة
‏٥- قم بازالة العناصر الغير ضرورية حتى يصبح تطبيقك سريعا وخفيفآ
‏٦- استخدم حجم الزر الصحيح لاتجعل أزرارك صغيرة اجعلها كبيرة بما يكفي لعرضها بشكل واضح في اصغر الاجهزة

7 مواقع لأكواد Frontend قصيرة، ممكن تساعدك بمشاريعك أو تستلهم منها أفكار جديدة 💛🔥

1: موقع Free Frontend
https://freefrontend.com/

2: موقع Codeply
https://www.codeply.com/

3: موقع 30 Seconds of Code
https://www.30secondsofcode.org/

4: موقع Code Sandbox
https://codesandbox.io/explore

5: موقع TaillwindComponents
https://tailwindcomponents.com/components

6: موقع Codepen
https://codepen.io/

7: موقع CSS Deck
https://cssdeck.com/

كورس رياكت من الصفر الى احتراف مجانا😍😍
https://youtube.com/playlist?list=PLpr1Lg_f0v3ojNKR4WzZ_SEXhiKBHDQmB

4 قنوات يوتيوب ( عربية ) لتعلّم الـ Frontend، أضمن لك لو تابعت معاها حتنقلك لمستوى متطوّر جدًا 😍😍


1️⃣ قناة الزيرو ويب سكول 🔥
https://www.youtube.com/c/ElzeroInfo


2️⃣ قناة عبدالرحمن جمال 🔥
https://www.youtube.com/c/AbdelrahmanGamal


3️⃣ قناة أكاديمية ترميز 🔥
https://www.youtube.com/channel/UCjRxQhyzA8wLypJfq6P7opQ


4️⃣ قناة اتعلم في ساعة 🔥
https://www.youtube.com/channel/UCs8PwUcH93uchrEZkB8ltNw

افضل القنوات العربية لتعلم البرمجة


🔹Elzero Web School
https://www.youtube.com/@ElzeroWebSchool
تهدف القناة لتمكين شباب الوطن العربي من تعلم  البرمجة بسلوب جميل  و مواكبة التطور التكنولوجي


🔹Barmej
https://www.youtube.com/@Barmej

برمح.كوم هي منصة تعليمية عربية تهدف إلى إثراء المحتوى العربي لتعلم للغات البرمجة وتنمية مهارات البرمجة للعالم العربي. 


🔹Muhammed Essa
https://www.youtube.com/@MuhammedEssa
القناة يهدف لتعليم جميع لغات البرمجة منها الويب والكومبيوتر واجهزة الهواتف واللوحية وجميع الشهادات الي تخص اللغات والسيرفرات بانواعها


🔹CodeZilla
https://www.youtube.com/@Codezilla
تهدف قناة لتعليم البرمجة باللغة العربية، مقدمة اليكم من خبراء مجال التعليم و البرمجة، مجانا، و تناسب جميع الاعمار


🔹Nour Homsi
https://www.youtube.com/@NourHomsi
تقدّم القناة دروسا في التصميم الاعلاني و تصميم الويب بالاضافة إلى مختلف مجالات التكنولوجيا بدأت هذه القناة من فكرة بسيطة،

تضامنا مع الظروف الراهنة حاليا سيتم إيقاف نشر ليوم غد الثلاثاء
اللهم ارحم موتانا واشف جرحانا

مصادري السرية في التصميم ! (الجزء الاول )

كل مصمم لديه مصادر تساعده وتسهل عليه العمل ك مصمم.
سأشارك معك مجموعة من المصادر.

لتعلم تصميم ال UI
Lapa Learn
lapa.ninja/learn/
Netguru
netguru.com/design-process
Udacity
eu.udacity.com
Checklist Design
checklist.design

أدوات الذكاء الاصطناعي
Khroma
http://khroma.co/
Lets Enhance
letsenhance.io
Color Mind
http://colormind.io/
Fronty
fronty.com

لنقل تصاميمك إلى مستوى آخر
Vectary
https://www.vectary.com/
Bravo
https://www.bravostudio.app/
Voiceflow
https://www.voiceflow.com/
Ditto Words
dittowords.com

ألعاب لتحسين مستواك
Can't Unsee
https://cantunsee.space/
Color Method
https://color.method.ac/
The Bezier Game
https://bezier.method.ac/
KERNTYPE
https://type.method.ac/

هل كان هذا مفيدا؟

مجموعة مواقع مفيدة ستسهل عليك الكثير 🔥

Logomaker.com
موقع يسمح لك بإنشاء شعار ( لوجو ) مجانا لصفحتك او شركتك

M3aarf.com
كورسات مجانية في مختلف المحالات مع شهادات معترف بها

Foulabook.com
موقع فيه ألاف الكتب للتحميل مجانا. | بصيغة PDF

Free4talk.com
موقع اسطوري للتدرب على الانجليزية فيه العديد من الغرف الصوتية للدردشة

ifada-ar.com
موقع رائع جدا فيه مقالات تعليمية و شروحات في مختلف المجالات

أفضل أدوات الذكـاء الاصطناعي

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

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

Uizard
uizard.io
هي أداة نماذج أولية سريعة يقوم بمسح الرسم التخطيطي الخاص بك ويحوله إلى تصميمات فعلية.

ChatGPT
chat.openai.com
يساعدك في العديد من الأشياء المتعلقة بالتصميم ، مثل البحث وإنشاء الأنماط وعملية التفكير وغير ذلك الكثير.

Microsoft Designer
designer.microsoft.com
تطبيق تصميم رسومي يساعدك على إنشاء منشورات ودعوات ورسومات وغيرها بجودة احترافية على وسائل التواصل الاجتماعي. إنه في الوصول التجريبي في الوقت الحالي.

Autodraw
autodraw.com
يستخدم خوارزمية لتخمين ما تريده ليرسم. يمكنه تخمين مئات الرسومات للمساعدة يصنع أي شيء مرئي سريع ومجاني.

Magician
magician.design
هو مكون إضافي فريد من نوعه لـفيجما يحتوي على الثلاث وظائف ، التي تنشئ رموزًا ونصوصًا وصورًا بناءً على النص الذي تكتبه مما يعزز الكفاءة بشكل كبير.

كورس برمجة تطبيقات اندرويد بتقنية فلاتر من الصفر إلى الاحتراف 😍😍
https://youtube.com/playlist?list=PLw6Y5u47CYq47oDw63bMqkq06fjuoK_GJ

5 ألعاب للمصممين
إليك مجموعة من الألعاب الإبداعية التي ستتمكن من خلالها تعلم مواضيع مختلفة مثل الطباعة أو الألوان وغيرها.

What The Hex?
http://yizzle.com/whatthehex/
للمصممين الجدد يمكنكم من خلال هذه اللعبة التعرف على درجات الألوان المختلفة .

CSS Diner
flukeout.github.io
الهدف من هذه اللعبة هو كتابة كود محدد CSS مثالي ، وكل مستوى يزداد صعوبة.

I Shot The Serif
tothepoint.co.uk/us/fun/i-shot-the-serif/
اللعبة مسببة للإدمان بشكل كبير وستساعدك على معرفة الفرق بين أنماط خط serif و sans-serif.

Kern Type
type.method.ac/
لجميع محبي الخطأ المطبعي! لعبة تساعدك على تعلم تقنين الأحرف.

Pixact ly
pixact.ly/
لعبة على الإنترنت تختبر مدى معرفتك بالبكسل إنها ليست سهلة

بوست جديد لا تنسو اللايك والحفظ😍😍
https://www.instagram.com/p/CofSbBtt2x1/?igshid=OGQ2MjdiOTE=

10 مشاريع Frontend رهيبة للتدريب وتطوير مهارتك.. باستخدام HTML و CSS فقط 👏🏻⚡️


1:: بناء موقع بخلفية فيديو
https://www.youtube.com/watch?v=8MgpE2DTTKA


2:: بناء صفحة هبوط احترافية
https://www.youtube.com/watch?v=X1dz0xRbSJc


3:: بناء صفحة دخول وتسجيل احترافية
https://www.youtube.com/watch?v=cxm5bCCa9OA&t=6s


4:: صفحة هبوط بصورة خلفية بكامل الشاشة
https://www.youtube.com/watch?v=hVdTQWASliE


5:: متجر إلكتروني
https://www.youtube.com/watch?v=yQimoqo0-7g


6:: بناء موقع وكالة إبداعية
https://www.youtube.com/watch?v=lvYnfMOUOJY


7:: بناء موقع زجاجي
https://www.youtube.com/watch?v=O7WbVj5apxU


8:: بناء سكشن فريق العمل بطريقة إبداعية
https://www.youtube.com/watch?v=Q22Tli-D4mw


9:: صفحة هبوط لمنتج واحد
https://www.youtube.com/watch?v=61R5kn_kYwY


10:: صفحة الأسعار أو الباقات
https://www.youtube.com/watch?v=SWyuQMCTxCQ

ريلز جديد ومفيد🔥🔥
https://www.instagram.com/reel/CohxcZrAeRH/?igshid=YmMyMTA2M2Y=

ما هو إطار ANGULAR، أهم ميزاته، سلبياته و متى تستخدمه ؟
للـ Angular تاريخ كبير، فهي أول إطار عمل (Framwrok) من تطوير شركة جوجل ، أول إصدار لها كان سنة 2016 و حملت إسم AngularJS، و كانت حينها تستخدم بشكل كبير فقط في صناعة صفحات الويب SAP (Single Application Page) و هي مواقع الويب التي تقوم بعملها دون تحديث الصفحة ( مثلا عند البحث في موقع ستجد انه أخذك لصفحة نتائج البحث  وخرج من الصفحة التي كنت انت بها لكن مع هذه التقنية سوف يظهر لك النتائج دون تحديث الصفحة سوف تظل بنفس الصفحة )، ثم بعدها جائت إصدارات أخرى مثل إصدار Angular 2 سنة 2017 إلى حين إصدار Angular 10 والان الاصدار 11 ولكن هو مازال غير مستقر بالقدر الكافي  .
تعتمد الـ Angular على معمارية MVC  اختصار لــ (Model–view–controller)
بحيث تفصل بين العمل الخلفي الذي يتم من خلاله بناء قواعد المشروع، و العمل الأمامي الذي يتم من خلاله بناء واجهة المشروع، و هو ما يميز Angular على إطارات جافاسكربت أخرى.

ميزات الـ Angular :

حين تتوجه الى الـ Angular ستصادف الكثير من الميزات في هذا الإطار:

أولا  الـ Angular يعتمد على الـ TypeScript فإنك ستجد سهولة كبيرة في كتابة الكود البرمجي بالجافاسكربت و ستختصر عليك الكثير في أسطر قليلة.



ثانيا سهولة تعديل الكود في الـ Angular مثالية جدا، فبفضل تقسيم الـ Compontents سيمكنك صناعة التحكم في جزء واحد من المشروع دون التأثير على باقي الأجزاء، و لإعتمادها على الجافاسكربت سيمكنك تنصيب مكتبات أخرى او إستخدام تقنيات أخرى تتماشى معها في المشروع البرمجي مثل Webpack (هو مجمعة وحدات جافا سكريبت مفتوحة المصدر.)لإدارة موارد المشروع.

-ثالثا  الميزة الأكبر للـ Angular أنها ليست محصورة فقط على مواقع الويب، بل متاحة لتطوير حتى تطبيقات الموبايل و تطبيقات سطح المكتب.

-ربعا  يعتمد الـ ANGULAR في بيئة عمله على صناعة COMPONENTS و هي أجزاء في صفحة الويب مثلا COMPONENT خاص بالتسجيل، و COMPONENT خاص بالبحث و ما الى ذلك، و في الصفحات التي تقوم ببنائها كل ما عليك فعله هو تركيب الوسم (TAG) الخاص  
بالـCOMPONENT من أجل إشتغاله، مثلا <LOGIN></LOGIN>،

و هذا يبرز سهولة في إنشاء صفحات الويب بكل سهولة.
سلبيات الـ Angular :

بالرغم من أنه إطار إحترافي و مثالي، لكن انصحك بتعلم الـ Angular في نسخته الأخيرة، فللأسف نجد أحيانا تغيير جذري او كبير جدا في الكود الخاص بالـ Angular بين النسخ .

- علي الرغم من تعدادية دعم المنصات الويب والموبيل وسطح المكتب الا  ان تطوير تطبيق ويب بالـ Angular مختلف عن تطوير تطبيق موبايل و مختلف عن تطوير تطبيق سطح المكتب، و ستجد نفسك كما لو كنت تطور بإطار آخر كليا.

- آداء الـ Angular ضعيف نسبيا مقارنة مع الـ Vuejs و React ، قد تلاحظ ان الـ vuejs أسرع من حيث الآداء مثلا.

متى تستخدم الـ Angular ؟

-في كل مرة تريد إنشاء منصة ويب متكاملة و حركية ذات ديناميكية وحيدة (SPA) تطبيقات الويب أحادية الصفحة، او حين تريد فقط إنشاء موقع بشكل أكثر إحترافية فإن الـ Angular رائعة لهذا .

- يمكن أيضا إعتماد الـ Angular في تطوير تطبيقات سطح المكتب بحيث توفر سهولة في الإستخدام و العمل.

الافضل لا تستخدام الـ Angular في تطوير تطبيقات الموبايل الا البسيط منها لانها لم ترقي الي التخصصية في هذا الجزاء بعد ولكنها قادمة وبقوه في التحديثات القريبة

🔰    مـواقـع مُـفـيـدة

أغلبية الباحثين  يلجؤون إلى Google, و لايعودون إلَّا بالقليل أو معلوماتٍ غير مؤكدة، وفي هذا المنشور تجدون أهم 12 موقع جاد في شؤون العلم والثقافة.

🔹 موقع Refseek :
محركُ بحث يوفر المصادر الأكاديمية بطريقة سهلة أكثر من مليار مصدر من الكتب والمجلات والأخبار والموسوعات
🌐 رابط الموقع :
https://www.refseek.com

🔹 موقع WorldCat :
محركُ بحث سهل الإستخدام يبحث في أكثر من 20 ألف مكتبة ويحتوي على أكثر من 2 مليار مصدر ويُمكنك من إيجاد أقرب مكتبة لك.
🌐 رابط الموقع :
https://www.worldcat.org

🔹 موقع Springer :
يحتوي على أكثر من 3 مليون مصدر في مختلف المجالات العلمية من مقالات وأوراق ومؤتمرات وأجزاء من كتب.
🌐 رابط الموقع :
https://link.springer.com

🔹 موقع Microsoft Academic :
يحمل نتائج بحث واسعة المحتوى للأكاديميين ويتم تحديثها باستمرار يحتوي على أكثر من 120 مليون مطبوعة.
🌐 رابط الموقع :
https://academic.microsoft.com

🔹 موقع Bioline :
محرك بحث تطوعي يعمل على جمع المقالات المنشورة في المجلات العلمية بالدول النامية مثل مصر و تركيا والعراق والأردن وغيرها
🌐 رابط الموقع :
http://www.bioline.org.br

🔹 موقع EThOS :
يحملُ أكثر من 500 ألف رسالة ماجستير و دكتوراة في جميع المجالات.
🌐 رابط الموقع :
https://ethos.bl.uk

🔹 موقع Research Paper’s in Economics :
محرك بحث يحتوي على أكثر من مليوني بحث في علم الإقتصاد والعلوم الأخرى ذات صلة.
🌐 رابط الموقع :
http://repec.org

🔹 موقع Science.gove :
محرك بحث علمي تابع للحكومة الأمريكية يجمع أكثر من 2000 موقع علمي ويحتوي على أكثر من 200 مليون ورقة و نتائج موثوقة.
🌐 رابط الموقع :
https://www.science.gov

🔹 موقع Kotobgy :
محركُ بحث كُتبي رائع جداً يحتوي على الملايين من الكتب العربية القابلة للتحميل.
🌐 رابط الموقع :
https://www.kotobgy.com

🔹  موقع Pdfdrive :
أكبر وأفضل موقع لتحميل الكتب في جميع التخصصّات بصيغة PDF يحتوي أكثر من 225 مليون كتاب جاهز للتحميل المباشر ويمكن استخدامه للدراسة.
🌐 رابط الموقع :
https://www.pdfdrive.com

🔹 موقع ISEEK Education :
محركُ بحث ممتاز يستهدف الطلاب والمعلمين والإداريين وغيرهم يحتوي على مواد موثوقة ومحررة.
🌐 رابط الموقع :
https://education.iseek.com

🔹 موقع Base-search :
من أفضل وأقوى محركات البحوث الأكاديمية توجد أكثر من 100 مليون وثيقة علمية ويقوم بالبحث في 3 آلاف مصدر، %70من المقالات مجانية.
🌐 رابط الموقع :
https://www.base-search.com

أدوات ما استغني عنها كمبرمج🚀
https://www.instagram.com/reel/Com9VxRAf8A/?igshid=YmMyMTA2M2Y=

📌موقع جدا رهيب لمطورين Front-End 👌😍
يعطيك قائمة بالاشياء اللي لازم تسويها لما تعمل تصميم جديد ب HTML / CSS / JAVASCRIPT  وحتى ال SEO ✅
ومقسم لك المهام على حسب الاهمية 🏅

https://frontendchecklist.io

مواقع مفيدة جدا ستتمنى لو عرفتها من قبل :

dictation.io
موقع يقوم بتحويل صوتك وكلامك إلى نص ، لن تحتاج للكتابة بعد الآن

3dicons.co
افضل موقع للحصول على صور 3D و ملحقات للتصميم مجانا


ilovepdf.com
موقع يسمح لك ان تقوم بالتحويل بين جميع أنواع الملفات... PDF, WORD, EXEL

shortlyai.com
موقع اعطيه عنوان البحث وسيكتب لك مقالات بإستخدام الذكاء الاصطناعي

typingclub.com
موقع رائع جدا يساعدك على ان تصبح سريع في الكتابة على الكيبورد ب 10 أصابع