حقيبة المبرمج

SharohatCode SharohatCode

حقيبة المبرمج

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

الذكاء الاصطناعي (AI Assistants)

Gemini

ممتاز في تحليل الصور وتحديث المعلومات.

مجاني

Claude AI

منافس قوي يتميز بكتابة كود نظيف وسياق طبيعي.

مجاني

Deepseek

الافضل بعد Cluad ai لكتابة وتصحيح الكود.

مجاني

ChatGPT

المساعد الذكي الأشهر لكتابة وتصحيح الكود.

مجاني

بيئة العمل (Environment)

VS Code

المحرر الأقوى والأساسي لأي مبرمج.

أساسي

Git SCM

نظام إدارة النسخ (Version Control) والتعامل مع GitHub.

أساسي

Notion

الأداة الشاملة لتنظيم مهامك وملاحظات التعلم.

مجاني

Postman

الأداة الأهم لمطوري الباك اند لاختبار الـ APIs.

مجاني

التصميم والأيقونات (UI Resources)

Google Fonts

مكتبة الخطوط الأساسية لأي موقع ويب.

مجاني

Lucide Icons

مكتبة أيقونات عصرية وخفيفة جداً (أخف من FontAwesome).

مفتوح المصدر

Font Awesome

المكتبة الكلاسيكية للأيقونات، تدعم كل شيء.

مجاني

Favicon.io

تحويل الصور والنصوص إلى أيقونة الموقع (Favicon).

جديد

Color Hunt

لوحات ألوان جاهزة ومتناسقة لمشاريعك.

أدوات مساعدة (Developer Tools)

Prettier

إضافة VS Code لتنسيق وترتيب الكود تلقائياً.

مهم

Formspark

خدمة تحويل نماذج الاتصال إلى إيميل بدون كود خلفي.

Flexbox Labs

أداة بصرية رائعة لفهم وتجربة Flexbox Layouts.

مفيد

Carbon

حول الكود الخاص بك إلى صور جميلة للمشاركة.

Can I Use

تأكد من توافق خصائص CSS/JS مع جميع المتصفحات.

HTML Minifier

ضغط كود HTML لتقليل حجمه قبل الرفع.

الصور والوسائط (Assets)

Placehold.co

خدمة سريعة لتوليد صور "مؤقتة" بمقاسات مختلفة.

Unsplash

صور فوتوغرافية عالية الجودة ومجانية تماماً.

unDraw

رسومات فيكتور (SVG) مفتوحة المصدر وعصرية.

ImgBB

استضافة مجانية وسريعة لرفع الصور.

TinyPNG

ضغط حجم الصور بذكاء لتسريع موقعك.

الحركة والأنيميشن (Animation)

Animate.css

مكتبة CSS جاهزة لإضافة حركات بسيطة وسريعة.

LottieFiles

مكتبة ضخمة للأنيميشن عالي الجودة وخفيف الوزن (JSON).

Trend

GSAP

أقوى مكتبة أنيميشن (JavaScript) احترافية.

Pro

AOS Library

مكتبة خفيفة لتحريك العناصر عند نزول الصفحة (Scroll).

الباك اند وبايثون (Backend)

FastAPI

أسرع إطار عمل بايثون لبناء APIs حديثة.

سريع جداً

Supabase

بديل Firebase مفتوح المصدر (قواعد بيانات + مصادقة).

موصى به

Django

إطار عمل بايثون قوي وشامل لبناء تطبيقات الويب.

Framework

Flask

إطار عمل بايثون خفيف وسريع (Micro-framework).

Framework

JSON Placeholder

API وهمي مجاني لتجربة وعرض البيانات (Testing).

SQL Fiddle

تجربة وكتابة أكواد قواعد البيانات (SQL) أونلاين.

تحديات برمجية (Practice)

Frontend Mentor

تحديات بناء مشاريع حقيقية لتحسين مهاراتك في الويب.

موصى به

CSS Battle

تحديات ممتعة لكتابة كود CSS ورسم الأشكال.

LeetCode

تحديات برمجيه متدرجة المستوي لكل اللغات

Codewars

تحديات منطقية (Logic) لتحسين تفكيرك البرمجي.

الاستضافة والنشر (Deployment)

GitHub

منصة استضافة الكود والمشاريع مفتوحة المصدر.

أساسي

Vercel

أفضل استضافة لمشاريع Next.js و React.

Render

أفضل بديل مجاني لـ Heroku لاستضافة الباك اند.

مجاني

Netlify

استضافة ممتازة وسهلة للمواقع الثابتة (Static).

مراجع التعلم (References)

Elzero Web School

المرجع العربي الأول والأقوى لتعلم البرمجة.

عربي

MDN Web Docs

المرجع والوثائق الرسمية للويب من موزيلا.

W3Schools

مرجع سريع وبسيط للأكواد والأمثلة.

CSS-Tricks

مرجع قوي في تعلم CSS ونصائح.
العودة للصفحة الرئيسية



function initializeIntersectionObserver(elements,options={threshold:0.1,rootMargin:'0px 0px -50px 0px'}){const observer=new IntersectionObserver((entries)=>{entries.forEach(entry=>{if(entry.isIntersecting){entry.target.style.opacity='1';entry.target.style.transform='translateY(0)'}})},options);elements.forEach(el=>{el.style.opacity='0';el.style.transform='translateY(30px)';el.style.transition='opacity 0.6s ease, transform 0.6s ease';observer.observe(el)})} function initializeSmoothScrolling(){document.querySelectorAll('a[href^="#"]').forEach(anchor=>{anchor.addEventListener('click',function(e){e.preventDefault();const target=document.querySelector(this.getAttribute('href'));if(target){target.scrollIntoView({behavior:'smooth',block:'start'})}})})} function initializeLazyLoading(images){const imageObserver=new IntersectionObserver((entries,observer)=>{entries.forEach(entry=>{if(entry.isIntersecting){const img=entry.target;img.src=img.dataset.src||img.src;img.classList.remove('lazy');imageObserver.unobserve(img)}})});images.forEach(img=>{img.dataset.src=img.src;img.classList.add('lazy');imageObserver.observe(img)})} function debounce(func,wait){let timeout;return function executedFunction(...args){const later=()=>{clearTimeout(timeout);func(...args)};clearTimeout(timeout);timeout=setTimeout(later,wait)}} document.addEventListener('DOMContentLoaded',()=>{initializeSmoothScrolling();initializeLazyLoading(document.querySelectorAll('img'));initializeHeroSection();initializeFeaturedLessons();initializeBeginnersGuide();initializeRecentProjects();initializeNewsletter();initializeFAQ();initializeLatestArticles()})