Тёмный

Module Federation. Микрофронтенды с помощью Webpack 

Чеботаев Роман. Frontend Blog
Просмотров 9 тыс.
50% 1

➡️ Telegram t.me/frontend_...
➡️ Boosty boosty.to/roma...
➡️ VK fronten...
Module Federation. Микрофронтенды с помощью Webpack
Module Federation - это подход к разработке веб-приложений в среде JavaScript, который позволяет динамически подгружать модули (код) из других приложений в рамках одного браузера. Этот подход позволяет создавать масштабируемые и гибкие приложения, где различные части приложения могут быть разработаны и поддерживаться независимо друг от друга. Module Federation обеспечивает возможность создания распределенных, модульных и легко масштабируемых систем на основе современных технологий веб-разработки.
Module Federation позволяет создавать "микросервисы на фронтенде" путем динамической загрузки модулей с других приложений или даже с других доменов. Это способствует улучшенной модульности, повторному использованию кода и упрощению совместной работы над различными частями приложения. Кроме того, Module Federation может быть использован для построения сложных взаимодействий между отдельными приложениями, обеспечивая гибкость и масштабируемость веб-приложений. Этот подход особенно актуален в контексте современных требований к разработке веб-приложений, таких как микросервисная архитектура, где каждая часть приложения может быть разработана и развернута независимо, а затем интегрирована в единое приложение с помощью динамической загрузки модулей.

Опубликовано:

 

2 окт 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 26   
@romanchebotaev_frontendblog
@romanchebotaev_frontendblog 17 дней назад
Канал в телеграме с полезным контентом ➡Telegram t.me/frontend_blog_tg
@danilapisarev7963
@danilapisarev7963 Год назад
Большое спасибо! Очень полезный материал
@Начинающийпрограммист-ю2щ
Очень толково
@garvae
@garvae 3 месяца назад
Спасибо за видео! Скоро займусь проектом, где основой будет приложение на Реакт, а в некоторых местах должны подключаться микрофронтенды на React/Angular. Пока вопросов много остается (буду ресерчить), например: - Как это будет влиять на SEO для гугла? - Как это будет влиять на бандл / чанки, загружаемые юзером?
@aldarbazarov9827
@aldarbazarov9827 Год назад
Спасибо, полезное видео! Про webpack всегда интересно посмотреть!
@Tigran-ig5to
@Tigran-ig5to 21 день назад
От душ! Очень понятно и интересно. Спасибо
@MegaDjeday
@MegaDjeday 10 месяцев назад
Спасибо! Самое доступное объяснение!!!
@ivanglinskii124
@ivanglinskii124 Месяц назад
всё классно, четко, лаконично. Один из лучших видосов на ютубе по данной теме. Хотелось бы увидеть продолжение на различных фреймворках и shared библиотек. Роман, планируется ли продолжение данной тематики?
@VakiTaki
@VakiTaki 4 месяца назад
Спасибо, сейчас тоже стоит задача связать микрофронтендом приложения на реакт и вью, все на Вите, вообще все голову сломал как это сделать, еще немного идей подкинул, спс , блин научите уже кто нибудь, заплачу, отблагодарю, плииизз)
@strogalev
@strogalev 2 месяца назад
Спасибо! Как раз такое искал, а то либо одни картинки со схемами, то видео на 1.5 часа. Успехов тебе и каналу
@MikAleinik
@MikAleinik Год назад
Спасибо, очень полезное видео.
@wave103x
@wave103x 3 месяца назад
шикарные пояснения и в целом видео
@АлександрМалыхин-х1ю
А разве не важно подключать app1 в container с помощью react.lazy?
@vladyslavnosenko1740
@vladyslavnosenko1740 11 месяцев назад
react.lazy будет работает в контексте сборки одного приложения. Тут большой бенефит в том, что приложения независимы друг от друга и могут быть написаны даже на разных фреймворках, лишь бы сборщиком был webpack
@denisu9286
@denisu9286 7 месяцев назад
Спасибо, очень полезно
@МихаилБронников-ш9х
@МихаилБронников-ш9х 5 месяцев назад
Спасибо
@velkinvv
@velkinvv Год назад
что за переключение между приложениями используется? Это сторонний стофт?
@romanchebotaev_frontendblog
Встроенный Stage Manager. Появился в MacOS Ventura
@sanspeur-uz4zy
@sanspeur-uz4zy 11 месяцев назад
Балдеж
@ssurrokk
@ssurrokk 9 месяцев назад
спасибо
@airpodsclub6443
@airpodsclub6443 Год назад
классный видос, спасибо
@user-hruser
@user-hruser Год назад
Минус, нужен постоянно рабочий сервер
@romanchebotaev_frontendblog
Только что бы отдавать статику
@ПавелРубан-е5м
@ПавелРубан-е5м 7 месяцев назад
​@@romanchebotaev_frontendblog а что такое статика ? (Это статические чанки которые за счёт вебпака отправляются? ) Можете привести пример? Что ещё есть помимо статики? Динамические запросы (fetch/xhr)
@tahrizade
@tahrizade 7 месяцев назад
а что это нам дает ?? плюс в чем ? какой полз от этого ? я не как не могу понять это 🤔🤔
@Начинающийпрограммист-ю2щ
По идее, импорт будет работать даже если у тебя одна компонента на реакте; а другая на ангуляре и все будет работать Суть деления все на микросервисы (микрофрониенд) в том, что у тебя может быть огромный проект, над которым работают 3 команды и каждая команда разрабатывает по сути отдельный софт, который пишут на разных фроемворках. В конце тебе нужно скрестить это все в один проект и вот тут и нужен этот пакет. На таких маленьких программах, как в видео такое не очевидно, но ролик просто демонстрация
Далее
Five Module Federation/Micro-Frontend Mistakes
28:09
Просмотров 48 тыс.
Vite and Module Federation Makes Micro-Frontends EASY!
27:36