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.

⏱ 1 ч 43 мин 📚 4 уроков 🎧 Аудиоверсия

О курсе

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
  • 💬 Личный AI-наставник
    Застрял на уроке? Спроси встроенного наставника о чём угодно, в любой момент.
  • 🎧 Аудиоверсия включена
    Учитесь в дороге — экран не нужен
  • ♾️ Пожизненный доступ
    Возвращайтесь в любое время, без срока
  • 📱 Телефон или компьютер
    Работает везде и на любом устройстве
  • 💸 Возврат в течение 30 дней
    Без вопросов
  • Кратко и по делу
    1 ч 43 мин практического материала

Отзывы

Отзывов пока нет — поделитесь своим первым.

Написать отзыв

После отправки попросим войти — черновик сохранится.

Студенты также прошли

Next.js App Router и рендеринг через практические миссии

Создайте прочную основу в Next.js, изучая App Router, современные стратегии рендеринга и компоненты React Server с помощью письменных упражнений.
★ 4.9 (17)
$4.99

React Router 6: Навигация и маршрутизация для веб-приложений

Разберитесь, как управлять навигацией, вложенными маршрутами и данными в приложениях React, создав практический проект по аренде жилья для путешествий.
★ 4.8 (16)
$4.99

Рендеринг на стороне сервера с использованием React, Redux и Express.

Освойте изоморфный JavaScript, создавая безопасные и высокопроизводительные приложения React с серверным рендерингом, управлением состоянием Redux и Express.
★ 4.7 (3,890)
$4.99

Создание динамических веб-приложений с использованием React и Firebase

Научитесь создавать интерактивные интерфейсы для фронтенда и интегрировать серверные сервисы в режиме реального времени для современных одностраничных приложений.
★ 4.7 (3,934)
$4.99

Часто спрашивают

Что нужно для прохождения курса? +

Только смартфон или компьютер с доступом в интернет. Никаких установок и оборудования.

Как оплатить? +

Банковской картой через Stripe или криптовалютой. Данные карты обрабатывает Stripe — мы их не храним.

Можно ли вернуть деньги? +

Да — полный возврат в течение 30 дней, без вопросов.

Как долго будут доступны материалы? +

Навсегда. После покупки курс остаётся с вами — возвращайтесь в любое время.

Получу ли я сертификат? +

Да. По окончании выдаётся сертификат, который можно добавить в профиль LinkedIn.

Подходит для специалистов в
IT Дизайн Финансы Маркетинг Медицина Образование HoReCa Производство