Optimizing Images in MDX with Gatsby
Learn how to automatically optimize images within MDX documents using Gatsby to ensure fast loading times and high-performance web builds.
حول هذه الدورة
Large, unoptimized images are the primary cause of slow websites and poor user experiences. When building with MDX and Gatsby, automating the optimization process is essential to prevent bulky files from slipping into your production builds. This text-only course guides you through the entire process of setting up automated image pipelines. You will learn how to configure your project so that every Markdown-style image is automatically resized, compressed, and delivered in modern, responsive formats.
What you'll learn:
- Understand the core principles of web image optimization and modern performance standards
- Configure Gatsby plugins to automatically process images embedded in MDX files
- Implement responsive, mobile-first image configurations using modern formats
- Prevent heavy, unoptimized assets from reaching your production environment
- Troubleshoot and verify image build pipelines using clear code patterns
Starting with foundational web performance concepts and image terminology, the course guides you step-by-step through configuration files and practical code snippets. You will practice setting up and testing your image pipeline through structured written exercises and examples. This course is designed for beginner developers and content creators who want to build faster websites using Gatsby and MDX, with no prior optimization experience required. Start reading today to build faster, lighter websites.
ما الذي ستحصل عليه
-
📜
شهادة إتمام
أضفها إلى ملفك على LinkedIn -
💬
Personal AI tutor
Stuck on a lesson? Ask your built-in tutor anything, any time. -
🎧
النسخة الصوتية مضمَّنة
تعلَّم أثناء تنقُّلك — دون شاشة -
♾️
وصول مدى الحياة
عُد متى شئت، بلا انتهاء -
📱
الهاتف أو الكمبيوتر
يعمل في أي مكان وعلى أي جهاز -
💸
استرداد خلال 30 يومًا
دون أسئلة -
⚡
قصير ومركَّز
1 ساعة 43 دقيقة من المحتوى التطبيقي
المراجعات
لا توجد مراجعات بعد — كن أول من يشارك تجربته.
المتعلمون أخذوا أيضًا
بناء أساس متين في Next.js عن طريق استكشاف App Router، واستراتيجيات العرض الحديثة، ومكونات React Server من خلال تمارين كتابية موجهة.
$4.99
افهم كيفية التعامل مع التنقل، المسارات المتداخلة، وإدارة البيانات في تطبيقات React عن طريق بناء مشروع عملي لتأجير السفر.
$4.99
إتقان لغة JavaScript المتماثلة عن طريق بناء تطبيقات React الآمنة والعالية الأداء التي يقدمها الخادم مع إدارة حالة Redux و Express.
$4.99
تعلم كيفية إنشاء واجهات تفاعلية أمامية ودمج خدمات خلفية آنية للتطبيقات الحديثة ذات الصفحة الواحدة.
$4.99
الأسئلة الشائعة
ما الذي أحتاجه لأخذ هذه الدورة؟ +
يكفي هاتف أو كمبيوتر متصل بالإنترنت. بدون تثبيتات أو أجهزة خاصة.
كيف يمكنني الدفع؟ +
بالبطاقة عبر Stripe أو بالعملات الرقمية. لا نخزن بيانات البطاقة — يتولى Stripe ذلك بأمان.
هل يمكنني استرداد المال؟ +
نعم — استرداد كامل خلال 30 يومًا، دون أسئلة.
إلى متى يستمر وصولي؟ +
إلى الأبد. بمجرد الشراء، الدورة لك تعود إليها متى شئت.
هل سأحصل على شهادة؟ +
نعم. عند الإتمام ستحصل على شهادة يمكنك إضافتها إلى ملفك في LinkedIn.
مصمَّم للعاملين في
التقنية
التصميم
المالية
التسويق
الرعاية الصحية
التعليم
الضيافة
التصنيع