Great video ! Thanks a lot ! It save my life about to skipping the MFE but your video made it possible for me to works on. Request, A video about ci/cd would be very interesting too.
I am working on a Nx and Angular v17 application which I am creating as MFE. This video from Sebastian is one of the best I have come across in my research as it explains key concepts. It would be great to get some more videos explaining (with examples) the concepts behind libs, features (feature shell) etc. I would also like to see a video on how to share styles and assets between apps and libs easily as this is not explained very well in the Nx documentation. Great work - love your content.
hey, I'm also working on a project where i use angular and react to create mfe and use single spa. Do you have any suggestions where i can find a way to share data between the mfe. thanks in advance.
It's nice of you to share your knowledge, but I have a criticism to make. Adjust the VSCode screen so that we can see the paths you are taking to create the MFe's and start the projects.
Hello, Sebastian. I've got a similar setup, but when I click on a remote routerLink (/cart in your case) from the host app (/host), I get the error "This localhost page can’t be found HTTP ERROR 404". At 44:00, if you refresh your tab, does the same happen?
Excellent question regarding the nginx config - maybe I should make a tutorial about it (?) as I think it might be to difficult to explain in the comments here (also it differs based on deploy-approach) @@nadeemramsing669
Hi Sebastian, Thanks For this video once you go to product page and refresh the page with browser reload button, whole application breaks and throwing errors(Can not GET /dist/apps/host/product ), Please check 45:56. if we go back to host routing and comeback to product route its working. but direct calling product routing its not working. seems like routing issue, How to fix this issue ? thanks in advance
Great video ! Thanks a lot ! A video about ci/cd would be very interesting too, and also a video on how to add ssr on the Host and remotes, since it is very usefull and used. If it is possible to implement of course ..
I was just searching it and got at the same time.. thanks a lot.. could you please do one large playlist with better ui and concepts to understand both mono repo and remote
Hi Sebastian, nice video, is it possible to have this same approach with packages.json files per application? That is, I can have angular applications with different versions in a productive environment, or also apps with different versions of libraries but that work with each other.
Hey mate. Excellent question! Nx supports one package json for all projects. This simplifies lifecycle management (upgrading, maintaining externats packages for the whole organisation. Its also easier to resolve vulnerabilities, and it is good in terms of many aspects such as; shared libs and fetures. More info can be found here: nx.dev/concepts/more-concepts/dependency-management
Hi, I got stuck at the very beginning of this video (10 minutes). When I try to run the host locally, everything compiles correctly, but I get an error in the browser console: TypeError: Cannot read properties of undefined (reading 'call') and Cannot use import statement outside a module (at styles.js:1:1). From what I see, the problem is quite old, but no one gave the correct solution. I'm using Angular 16 and node 20
@@DevBySeb Yes, I do everything just like you. This error does not appear when I use CLI commands to create components (eg nx g @nx/angular:host dashboard). It's very strange. it seems that the NX generator in VSC is not working properly for me, or I have the wrong configuration for the NX generator :/
Hello, good tutorial bro. i am from argentina I have the following problem. The images of my assets are shown broken when I launch my mf-login together with the main but if I run it individually the mf-login the image is displayed correctly.
Hello my friend, and thank you! It should work out of box, given the baseHrefs are set. Can you ensure that the baseHrefs are correctly set and that a leading slash for the images is set e.g: ”/assets/…”. I will double check this during the week!
Lot of thanks Sebastian. What I was expected and searching it and i got at the same time thanks a lot man.. its a great time. Could you please do some video for mono repo with shared asset folder and multi repo concept to integrate multiple repo apps. With auth and session, cookies concepts
Is any idea about how to resolved (NX Daemon process terminated and closed the connection error). i have tried lot . reset, restore, clear cache, reinstall, migrate, etc. and i have mallualy start the daemon. daemon was started but while run the nx serve command again got the same error. its dosen't work for me. it was totally blocking @@DevBySeb
@@DevBySeb Projects created in the Angular console, using modularization, I tried to use the project from the official documentation with the Angular library, but I was unable to send it to sonarqube
@@arozendojr we are utilizing sonarqube for scanning with quality gates set up, which runs in our CI pipeline per pull request level. We utilize an npm package to publish it. I believe its called sonarscanner or something similar. So it is possible.
@@DevBySeb My problem is nx creating an angular library, I would like to send everything from git to sonarquibe, I discovered that the angular library is a complete project, a separate directory in sonarquibe is mandatory
Great video ! Thanks a lot ! It save my life about to skipping the MFE but your video made it possible for me to works on.
Request, A video about ci/cd would be very interesting too.
Thanks for that tip mate! I will do one for sure! 🙏🏼
Welcome back Sebastian, glad to see you upload new content. Also the resolution is only 360p if you didn't notice, the text is barely visible
Thanks mate! Omg - I will look into this - thanks for letting me know!
Seems like RUclips is still processing the video - a better quality should be available in 30-60 minutes. :)
Up 'n running in good quality now! :)
Thanks a lot man, after a long search I found the real use of Micro-Frontend in this video 😇
Thanks for watching mate, hope you liked it 🙏🏼🙏🏼
I am working on a Nx and Angular v17 application which I am creating as MFE. This video from Sebastian is one of the best I have come across in my research as it explains key concepts. It would be great to get some more videos explaining (with examples) the concepts behind libs, features (feature shell) etc. I would also like to see a video on how to share styles and assets between apps and libs easily as this is not explained very well in the Nx documentation. Great work - love your content.
Thanks for your awesome feedback mate 🙏🏼 I will add that to my todo-list of videos. Once again - thank you 🙏🏼
hey,
I'm also working on a project where i use angular and react to create mfe and use single spa. Do you have any suggestions where i can find a way to share data between the mfe.
thanks in advance.
Have you looked at Zustand or Jotai?
@@alanrutter3273 will look into that
Hi i'm also working on angular 17 could you please share the MFE project git link for reference
It's nice of you to share your knowledge, but I have a criticism to make. Adjust the VSCode screen so that we can see the paths you are taking to create the MFe's and start the projects.
Amazing video, once again... thank you!
Thanks and thank you for watching mate 🙏🏼
What a awesome video
Thanks mate 🙏🏼🙏🏼
Awesome video, thanks for sharing! ❤
Thank you brother 🙏🏼🙏🏼
Hello, Sebastian. I've got a similar setup, but when I click on a remote routerLink (/cart in your case) from the host app (/host), I get the error "This localhost page can’t be found HTTP ERROR 404". At 44:00, if you refresh your tab, does the same happen?
Hello mate, did you change the paths in the webpack.prod file? And did you setup the baseHrefs to point toward the correct url? :)
@@DevBySeb I am also going to replicate your code today and see if same happens on deployment.
@@DevBySeb Re How would be declare your nginx configuration so that your remote apps are accessible via routing in your host app?
Did it work to replicate it mate?@@nadeemramsing669
Excellent question regarding the nginx config - maybe I should make a tutorial about it (?) as I think it might be to difficult to explain in the comments here (also it differs based on deploy-approach) @@nadeemramsing669
Hi Sebastian, Thanks For this video
once you go to product page and refresh the page with browser reload button, whole application breaks and throwing errors(Can not GET /dist/apps/host/product ), Please check 45:56.
if we go back to host routing and comeback to product route its working. but direct calling product routing its not working. seems like routing issue, How to fix this issue ? thanks in advance
Sorry for a late respons mate. I would think of utilizing baseHrefs. If that doesnt work, proxies could be used in nginx and apaches .htaccess files
Great video ! Thanks a lot ! A video about ci/cd would be very interesting too, and also a video on how to add ssr on the Host and remotes, since it is very usefull and used.
If it is possible to implement of course ..
Thanks for the feedback and sorry for the late response. I will do that for sure when I get some more time over 🙏🏼
I was just searching it and got at the same time.. thanks a lot.. could you please do one large playlist with better ui and concepts to understand both mono repo and remote
Will do that for sure mate! Thanks for watching by the way! 🙌🏼
Great video👏
🙏🏼🙏🏼🙏🏼
Hi Sebastian, nice video, is it possible to have this same approach with packages.json files per application?
That is, I can have angular applications with different versions in a productive environment, or also apps with different versions of libraries but that work with each other.
Hey mate. Excellent question! Nx supports one package json for all projects. This simplifies lifecycle management (upgrading, maintaining externats packages for the whole organisation. Its also easier to resolve vulnerabilities, and it is good in terms of many aspects such as; shared libs and fetures. More info can be found here: nx.dev/concepts/more-concepts/dependency-management
Hi, I got stuck at the very beginning of this video (10 minutes). When I try to run the host locally, everything compiles correctly, but I get an error in the browser console: TypeError: Cannot read properties of undefined (reading 'call') and Cannot use import statement outside a module (at styles.js:1:1). From what I see, the problem is quite old, but no one gave the correct solution. I'm using Angular 16 and node 20
Thanks for sharing mate. I haven’t seen that issue before, are you serving the application in the same way as I do?
@@DevBySeb Yes, I do everything just like you. This error does not appear when I use CLI commands to create components (eg nx g @nx/angular:host dashboard). It's very strange. it seems that the NX generator in VSC is not working properly for me, or I have the wrong configuration for the NX generator :/
Hello, good tutorial bro. i am from argentina
I have the following problem.
The images of my assets are shown broken when I launch my mf-login together with the main but if I run it individually the mf-login the image is displayed correctly.
Hello my friend, and thank you! It should work out of box, given the baseHrefs are set. Can you ensure that the baseHrefs are correctly set and that a leading slash for the images is set e.g: ”/assets/…”.
I will double check this during the week!
@@DevBySeb
Do you know any way to apply rules by applications? For example, each application is taken by a team and only that team has permission.
Can we get the url to the github repo of this source code?
Hello Sebastian when I create my remote application I am not able to see my entry.module.ts file please help my node version is 18.18.1
Hello mate, is it possible for you to test the same versions as I use in the video?
Lot of thanks Sebastian. What I was expected and searching it and i got at the same time thanks a lot man.. its a great time. Could you please do some video for mono repo with shared asset folder and multi repo concept to integrate multiple repo apps. With auth and session, cookies concepts
Thank you for watching mate. I will put it on my list of todos - Thanks! 🙏🏼
Is any idea about how to resolved (NX Daemon process terminated and closed the connection error). i have tried lot . reset, restore, clear cache, reinstall, migrate, etc. and i have mallualy start the daemon. daemon was started but while run the nx serve command again got the same error. its dosen't work for me. it was totally blocking @@DevBySeb
Is it possible to have access to the github project ?
Thanks for watching mate, I will check if I still have that code 🙏🏼
Have you already sent the project made with nx to sonarqube?
This existing project or projects in general?
@@DevBySeb Projects created in the Angular console, using modularization, I tried to use the project from the official documentation with the Angular library, but I was unable to send it to sonarqube
@@arozendojr we are utilizing sonarqube for scanning with quality gates set up, which runs in our CI pipeline per pull request level. We utilize an npm package to publish it. I believe its called sonarscanner or something similar. So it is possible.
@@DevBySeb My problem is nx creating an angular library, I would like to send everything from git to sonarquibe, I discovered that the angular library is a complete project, a separate directory in sonarquibe is mandatory
Gold!!
Thanks mate 🙏🏼🙏🏼🙏🏼
I guess you're knowing what are doing, but it's chaos in your presentation
Thanks for the feedback. I will try to do better.
where is the rest of the screen 😶
Thanks for the feedback mate, I’ll try to improve on that front 🙏🏼