Material Best Practices | #AngularAesthetics

Hi friends! In this video Emma Twersky talks about three UI best practices in her ngTube Angular Material demo. Enjoy!

Find the commits for each step here:

Continue the conversation online!

0:00 Introduction
0:35 Recap of the ngTube app
1:15 Component schematics
4:44 More reusable components
7:22 Unique app prefixes
7:50 Material feature modules
10:00 Best practices summary

[RajSekharK]

"not keeping all material modules at one shared place and importing in all other feature modules". This was my most imp take away. My big doubt till now got cleared. thanks.

[akmalkrmv]

Great work, very interesting, especially featured module with imports, was using for a long time. For a next video I would be glad to see more about matTable in depth, performances and best practices.

[ambersand]

That's brilliant. Well done you. I'm not front-end but this made so much sense. Thank you again!!

[zohar]

thanks for that, it is well explained and good that you also added the bundle size thing, that is important

[karthiksampathkumaryo]

Very nice explanation Emma, keep it up!

[g-luu]

Awesome stuff. Please do continue with best practices

[yogabija]

Keep up with the great videos! Thanks.

[talhasiddiqi]

While Ng material is a good way to get a good looking website off the ground quickly, it suffers heavily from customisability issues. Everything from trying to align the mat icon with another element to trying to fit a mat tabs inside a flexbox takes more effort than it should

[stunna]

Great video! Do you guys plan making a video on how to configure sidenav animation ?(half-mode, closed, opened etc)

[jeromemoulin]

Super video !! Do you will add flex-layout in next angular-material version ^^?

[rogyvoje]

Biggest mistake I see in every Angular project is SharedModule, which grows like crazy and impacts the bundle size extremely. I saw an Angular project with the same SharedModule and inital file is 10mb. Do not create SharedModule, I know its easy to create one small SharedModule in the beginning, but it is bad decesion in the long run!

[arditdaku]

First comment 😁😁. Thanks for the video very useful, i hope we will have more videos on these topics. Thank you!

[sidhantchaurasia]

Does anyone know the code theme being used here

[hansschenker]

Emma you blink very often with your right eye - do you want to sign me something? !^_^!

[hansschenker]

Is it a good practice to create a separate Angular Module for Import of all Material Imports and put that Material Imports Module in a shared folder where every component which needs a Material Module can import it from there?

[whatnexttech]

What is the name of the theme that she use in VScode plz ?

[Krilllind]

Did you catch the bug you introduce by performing rename operation on "video"? You changed a CSS class name from "video-..." to "video?-..."😏

[larryamisola]

Please add support for CSP. Will be great if the solution will come from Angular. Not point us to csp website. Particularly with regards with style-src, angular material generates this <style> tag during prod build. Many dont like to use unsafe-inline due to security concerns. I hope Angular team can support this style-src 'safe' specially for ngMaterial.

[jesuszagal]

Before: 676 KB
After: 671 KB
Are you kidding?