[BR][Front-End] JavaScript - Implementando Micro Front-End com Single SPA

Neste vídeo mostro como implementar uma versão simples de micro front-end utilizando o framework Single SPA, em um único projeto implementamos um contador em React e um todo list em Vue, separados por rotas.

Projeto:

Single SPA:

Redes Sociais:

[magnesioum]

Mano você e simplesmente incrível, eu sou do tipo que gosta de aprender tudo na prática, direto ao assunto mas como você explica tão bem, me faz assistir o vídeo completo ..
Cara, se um dia você montar um curso completo de react, serei o primeiro a comprar

[dfealves]

conteúdo muito bom consegui ter uma noção de como é o funcionamento. Agora preciso aplicar single-spa com angular

[testeTestandomuitosTestes]

cara você está em um nível completamente diferente, simplesmente incrível rápido e direto ao ponto, eu não entendia nada, cai de para quedas aqui no seu vídeo, seria possível explicar como é feita esta aplicação por dentro do código ( framework single SPA ), pois ele parece um react-router-dom do react, mas que difere da seguinte forma ele suporta qualquer linguagem, Mas enfim, seria possível explicar melhor como ele funciona por dentro ( como roda os processos dentro dele ) ?

Se não me engano com webpack e babel eu consigo fazer do back end node enviar uma pagina web ja rende rizada pelo back end SSR com Reactjs e Node, neste framework isso é possível, tipo eu faria parte do código para ser SSR e outra seria enviada como projeto react ?

ultima pergunta tem como escalar isso com docker e kafka eu nem sei como seria este escalonamento, mas como seria ?

[viniciusmargotti]

Cara, vídeo sensacional, muito bem explicado, já vou ver os próximos, ajudou muito Valeuuuu.

[alisonrodrigues]

já tem o vídeo da implementação de micro frontend com os Builds dos dois components ?

[alexjosesilvati]

Otima ideia de portofolio Gravado... vou anexar ao meu perfil!!

[yurirolandi]

Bom o vídeo mas a nível build code qual seria a melhor implementação ?

[DanielRios]

Sinceramente, por tudo que eu andei estudando sobre micro-frontend, eu acho que essa separação por rotas que vc fez é de longe a melhor opção, não vejo motivo pra misturar vários frameworks numa mesma página, isso só trás complexidade para a aplicação, só vejo isso como necessário num cenário de transição, mas no final das contas quando tudo estiver migrado, ficaria tudo em rotas diferentes também.

Eu só acho que complicou demais assim, acho que teria que ter sim um projeto React dentro de counter e um projeto view dentro de to-do, a questão principal é que tenha como deslocar times específicos para cada um sem precisar saber do outro e do single-spa (por isso é bom ter repositórios separados também)

[danillofidelgomes]

To assstiondo o video, otimo conteudo nao consegui nem pular partes.... uma duvida, eu conseguiria usar micro juntando Vuejs e Nuxtjs? nao sei se faz sentido mas seria pra obter pedaço da aplicação com os beneficios do ssr (um reload com ssr apenas numa parte da tela) e o restante com Vuejs simples. obrigado!

[webersonrodrigues]

Mano vc tem algum exemplo de como criar o orchestrador com vue.js?
Exemplo tenho um projeto base com vue.js que ele fosse o orchestrador.

Os outros aplicativos fossem renderizados dinamicamente dentro do meu projeto principal.
Outra coisa como usar um event-bus para os componentes se comunicarem.

[izichtl]

Muito bom, didática ótima, simples e prático!

[alienshikadai]

Se alguém poder me reponder agradeceria, eu, tem como trabalhar com a url para ir buscar os meus micro frontends? Do tipo, eu tenho uma aplicação e preciso utilizá-la na outra aplicação react, mas ele está hospedado em outro sítio, tem como fazer?

[Nazul]

É uma implementação muito boa e compreensível, como posso colocar os dois componentes na mesma visualização?

[DenissaleS]

Muito foda o video, mas Matheus como podemos configuraro service-worker com workbox em um projeto criado dessa maneira para ser um PWA?

[jimydolores]

Hola Matheus, muy buen video, estoy probando single-spa y hasta ahora todo bien de manera local, ahora quisiera probarlo en producción, estuve leyendo la documentación y mencionan algo de CI/CD, ¿Tendrás algún ejemplo de como subir la aplicación a producción? en mi caso trabajo con proyectos separados y cada uno corre en puertos distintos, espero me puedas ayudar con este tema, alguna sugerencia o consejo, gracias.

[JanynneGomes]

Matheus, excelente vídeo!!! Eestamos implementando micro-front em Angular no trabalho, precisamos quebrar a app em vários micro pra injetar em diferentes aplicações. Você planeja fazer algum exemplo em Angular?

[rlpias]

Muito bom o vídeo! Você tem algum que fale um pouco sobre como manter um estado para ambas aplicações?

[moacir]

Vídeo muito bom! Você tem planos de fazer um outro exemplo baseado não a nível de código, mas a nível de build? Me refiro a colocar um build como "fonte" para um micro frontend.

[omatheusantana]

Tentei baixar o código mas está faltando arquivos. :/

[danvilela]

A aplicação fica então com 3x o tamanho de um monolítico?