that is awesome actualy, so this just made me change my mind on some things with my multi layout app. this just made it way cleaner i used the original videos for your sidebar with 1 level :) thanks man!
Thank you so much for this amazing tutorial on Angular! Your explanations were clear and really helped me understand the concepts better. I appreciate the effort you put into creating this content. Keep up the great work!
If you haven't already, a video on using the host {} in the Component header and the various elements you can set in it would be a good video. Reducing the # of DIVs is a great benefit for example
@@ZoaibKhan its Adam :) I would love to know your thoughts on a couple of things. How would you approach a multi layout project, where admin and user both have your sidenav with their own dashboard example /admin/dashboard & /app/dashboard but then you have a public layout that has a nav bar across the header like bootstrap almost with login/reset password etc.... Would you make a base layout and extend that in the admin/user layouts and override the menu at the component level? I also would love to you how your thoughts on proper project layout for example you use pages/dashboard then you have components like components/sidenav, when you have a project that gets very large do you see benefits from this type layout I have a project that each page is basically a components and then it has a module that barrels the sub components. I have a core module that wraps and barrels interceptors and things like that and the i have shared/services/models and things of that nature. Thanks Zoaib!
Oh, sorry for that, Adam :) For a multi layout project, there are multiple ways to do this. One is what you suggested, keep a sidenav and the header in the base layout. Then we use some flag in our state in a service (or signal store, whatever) and show and hide them according to the flag. The other option is to just add the sidenav where needed - so you don't need it in the public facing one - so you can keep a parent component for the authenticated routes only (with an auth guard obviously). Maybe naming it as AuthenticatedLayout And keep the other one as the PublicLayout - with the boostrap like header as parent there. I like the second one, personally. Just seems a bit more organized and will allow you to protect the admin and user routes as well using auth guards. For the project structure, I'd kept pages to contain the top level components linked to routes. And the components basically contain reusable parts of those pages - so things like e.g. common buttons, form control elements, things which are shared. About keeping sub components in a separate module (assuming they're NgModules), the only downside is lack of tree shaking - and which is also the problem with the infamous shared modules that've been very common in the Angular world. Devs just end up adding any common stuff there and it keeps getting imported everywhere - unnecessarily bloating up pages when we don't need them. We can keep barrel files though - and also arrays of shared components to use in components when we need a bunch of them. Being mindful that a lot of unrelated stuff is not stuffed into one place. So yeah, that's a short overview. Hope that helps :)
@@ZoaibKhan awesome answers Thank you so much!! I hear ya on the shared component getting put everywhere LOL!!! i might have done that but now that we have standalone its forcing me to rethink this which is a good thing :) Thanks again brother I look forward to your next video! :)
hai zoaib, you are doing a brilliant work in helping people like me, can you make a continuation of this same project with an addition of a dark mode toggler in the toolbar this time, in which when clicked the sun icon changes into a moon icon and vice versa?????
Hey Akhil, thanks 🙏 This is quite a simple change, not sure if it'll be worth a whole video. I already have a dark mode video with material - you can check that out for reference for now. I may add the dark mode and toggle to a starter template containing these components...let's see :)
I have not bought the source code, but i passed your videos many time and completed the Navigation Menu. Only one thing i could not do that, how to apply the color theme.
