Видео

Awesome 🎉🎉🎉🎉🎉🎉

you were part of bossfight yea?

hi want angular version your used in this project do you have a folder structure for angular 17 and 18 I checked the latest angular version it have a standalone composennt and signals that application faster and better than previous angular version.

Your content is so good, thanks man!

What a awesome video <3. Thanks man!

16:20 both useCallback and useEffect will run when the component mounts so should get rid of the useEffect actually.

I love you, man. I've looking for this explanation for a long time.

Great video!!!! Just wanted to hint that you are talking a lot about separation of concerns and alias etc. You should definitely check out Nx. Once I used it I never worked without it anymore.

Wonderful video. Thank you very much

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

nice project, can you also upload a video for the design of this project?

What font vs code. Thank bro

Hi Sebastian! nice video, i just have few observations: - avoid calling the "subscribe" method by your self, if its possible to use the async pipe, use it, if it's not, so don't forget to unsubscribe (usually in the ngOnDestroy method of your component). - name your variables in a way you can easily identify them! because you named you variable as "data", your html template file end up having somthing: {{ data.data | json}}, which can be considered as "code smells". - it's ok to have a "Perform" class but why not use it as a parent class for the DataService instead of instantiate an object in the component?

hey @Sebastian Persson, I need help setting up module federation with Angular for two separate applications in different folders. One folder/project/workspace contains the components I have developed, while another separate folder/project/workspace has my web application. I want to load the components remotely into the web application using module federation. Is this possible? If so, how can I achieve it?

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 ..

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.

Very clear demonstration in such a short span of time. Thank you!

I thought it was nice of you to demonstrate and explain how to configure a Micro-Frontend with Nx. Thanks for sharing some of your knowledge.

Can we get the url to the github repo of this source code?

Great video mate, did you already migrate to angular 17 syntax?

Good tips! Thanks for your sharing :)

nice brother give us more angular best practices, we need it

Ta

Awesome video, thanks for sharing! ❤

Overall it was a great content, it covers so many concepts that I was not aware how to use in project. But most of the time it feels likes you are coding yourself instead of explaining clearly what and why the step is needed. Looking forward for more structured and well organised tutorial on this channel in future. Thank you

Not working for angular 18

Very good idea, thanks for sharing! But i see a problem using this aproach with other RxJS Operators, because the output is no Observable. See this example: perform = this.route.paramMap.pipe( switchMap((paramMap) => { // produces error because we do not return an Observable for switchMap return new Perform(this.myService.getData(paramMap.get("myId"))) }), ); If you return an observable using of() you can not subscribe with the async pipe on the perform observable, because the action does not get subscibed... Any ideas?

Good explanation / Bad presentation Please make sure to present the whole screen. Most of the presentation is hard to know where exactly are you positioned and what are you doing. Stop clicking so fast and switching between the files unnecessarily. Give a brief introduction of the tools and their usage. I know this is not a tutorial for NX extension but not everybody has the same experience/knowledge. Thanks so much for making and sharing this content. It's so valuable :)

The most comprehensive resource on CVA, covering custom error component and two custom input components!

Hello my friend, using this components in a form cause the form.pristine = false, do you have this issue ?

*most people don't care how you look. you wasted one third of the screen so we can see you*

Brilliant tutorial. Thank you so much!

When i add the component and use a formGroup, when i reset the form with this.form.reset(); the component causes infinit loop in writeValue function in control-value-acessor, can you have this problem ? Edit: i fix this error: in writeValue function (this.control && this.control.value!=value) resolve to me.

How to load assets folder images of web app in host application.

Awesome content!

Does this tutorial has prerequisite of nest js or it is taught along with coding?

Hi mate. How can i bind angular 13 with angular 17?

Your explanation is very good, to the point! This video really help me

I have a react app where i have consumed many react mfe through lazyload exposed by mfe app. but now I am exposing angular app through webpack.config.js but I am not able to consume angualr app in my app.js where is all routing.

I have a react app where i have consumed many react mfe through lazyload exposed by mfe app. but now I am exposing angular app through webpack.config.js but I am not able to consume angualr app in my app.js where is all routing.

Well explained!. In case anyone looking for the `mutate` to `update` refactoring code, here it is. protected upsertResource = (resource: ResourceType<T>) => { const index = this.resources().findIndex((res) => (res.id = resource.id)); if (index == -1) { this.resources.set([...this.resources(), resource]); } else { this.resources.update((res) => { res[index] = resource; return res; }); } };

Been working with Angular for over 4 years, and I've finally decided to work on a React project at my current job, and honestly this video really helps bridge the gap between Angular and Cr- I mean, React. Man do I love Angular.

Does it work if the lib project is not same repository? I have struggle when using translation module(@ngx-translate/core). My remote and host project is not same repository (total independently). It can't load TranslateSerice when access remote url from host. Please create a sample about that

Thanks for the video, I've been looking specifically for something like this! Although I'm pretty senior with Angular now and have worked with it for 7+ years, the market is forcing me to learn React. Let's see how long it'll take me after Angular )

Hello again) Found out another problem trying to removeControl() in formGroup. I get an error: "here is no formcontrol instance attached to form control element" It happens in directive, registerOnChange method, when doing tap((val) => fn(val)) I m using your approach in my project, but cant get rid of this error. Could you advise how to fix it? Thanks!

If the page have so many search filed, isnt it a hell to put all the valuchanges in the constructor??

hello i have this problem when implementing the id in the findOneBy: Object literal may only specify known properties, and 'id' does not exist in type 'FindOptionsWhere<Account> | FindOptionsWhere<Account>[]'.

I have a problem when trying form.reset() from parent component. Maximum call stack size exceeded. Could you check it out please?

what if all the components are standalone including app.component.ts? we must make standalone: false or remove it entirely?

Great