Simplify with Angular Standalone Components

Simplify with Angular Standalone Components

Deborah Kurata

1 год назад

14,849 Просмотров

With standalone components, we can build our components to ... well ... stand alone ... separate from any Angular Module (NgModule).

This makes creating components easier. And it makes it clear which features each component's template uses.

Standalone components were provided in Angular version 14 as a developer preview. With Angular v15 and now v16, standalone components are stable and ready to be used in your production applications.

Let's talk about what standalone components are and how to use them.

*Content*
00:00 Standalone components
00:55 Without standalone components (using NgModule)
02:23 Review of code without standalone components
03:58 Defining a component as standalone
04:29 Walk through: Defining a component as standalone
05:35 Demo: Defining components as standalone
07:11 Running to validate our changes I
07:21 Debugging standalone component issues
08:51 Running to validate our changes II
09:15 Making a component stand alone

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
😊About Me
Hey! I'm Deborah Kurata
I'm a software developer and YouTube content creator. I speak at conferences such as VS Live and ng-conf. I write articles for freeCodeCamp. And I'm a Pluralsight author with courses in the top 10 most popular (out of 10,000+) over the past 5 years. For my work in support of software developers, I've been recognized with the Microsoft Most Valuable Professional (MVP) award, and I'm a Google Developer Expert (GDE).

Contact me on Twitter: https://twitter.com/DeborahKurata
Find my Pluralsight courses: https://www.pluralsight.com/profile/author/deborah-kurata
Access my freeCodeCamp articles: https://www.freecodecamp.org/news/author/deborah-kurata/
View my YouTube content: https://www.youtube.com/@deborah_kurata

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
#angular #bestpractices #angulartutorial #angularstandalonecomponents #standalonecomponents #demo

Тэги:

#Angular #Best_practices #Angular_tutorial #Angular_standalone #Angular_standalone_components #Demo
Ссылки и html тэги не поддерживаются


Комментарии:

@MohamedsamiKhiari
@MohamedsamiKhiari - 29.11.2023 07:34

I like you :D thank you ♥

Ответить
@warrayn10
@warrayn10 - 11.11.2023 07:51

Thank you so much for your lessons!
They are so interesting and I never get bored. I enjoy learning from you :) Thank you ☺️

Ответить
@folabi41
@folabi41 - 10.11.2023 14:21

Thanks Deborah. Do this means we should always use standalone components ?

Ответить
@drax432
@drax432 - 09.11.2023 20:16

I wish in angular 17, there is no need to specify standalone: true. It should be by default.

Ответить
@SachalChandio
@SachalChandio - 03.11.2023 23:25

you are awesome

Ответить
@shahrukhkhan3967
@shahrukhkhan3967 - 22.10.2023 08:58

You deserve millions of subscribers ❤

Ответить
@rStudius
@rStudius - 01.09.2023 18:46

Your lessons make me a better programmer. Thank you and never stop doing what you're doing :D

Ответить
@MinhTran-ts1df
@MinhTran-ts1df - 01.08.2023 17:49

Thank you Deborah, your videos are always best of the best. I'd like to know if using Standalone Components is recommended for new applications or for big project we still need to use NgModule to organize the project in modular structure? Thanks

Ответить
@Cris-pr1wl
@Cris-pr1wl - 04.07.2023 23:29

Thx! Very good! Will try it later

Ответить
@ahmedrashad494
@ahmedrashad494 - 01.06.2023 18:31

Thank you
What about loadComponent() function with standalone component in router i need explanation please

Ответить
@LarsRyeJeppesen
@LarsRyeJeppesen - 31.05.2023 00:08

Thank you

Ответить
@matteofeliciani7336
@matteofeliciani7336 - 24.05.2023 13:23

Very good Deborah. How about making a video where you show a service just for a standalone component (I'm talking about provideIn) and the impact in js dimensions?

Ответить
@jalilirfan
@jalilirfan - 22.05.2023 14:35

but I moved my imports from mgModule Declaration to imports in app component only then it works

Ответить
@sepidehmasoomi7044
@sepidehmasoomi7044 - 15.05.2023 23:32

Great! Thanks.

Ответить
@VinitNeogi
@VinitNeogi - 14.05.2023 16:12

How can we use standalone components for component libraries, apps may or may not choose to use our components as standalone. Do we need to keep modules in that case

Ответить
@sravant
@sravant - 14.05.2023 15:38

Is it possible to create Angular library with standalone components?

Ответить
@sravant
@sravant - 14.05.2023 15:37

As usual, Crip and clear video. Thanks.

Ответить
@nikolas4749
@nikolas4749 - 14.05.2023 13:08

Hi Debora
Thanks for this great video
You modify a star wars sale application here to add standalone components.
Do you do a video where you made this application ?
Is it from one of your course ?

Ответить
@afshin7104
@afshin7104 - 12.05.2023 20:18

Hi Deborah
how the naming works in standalone components
what I mean is in modules we can have components with the same name like product-list

Ответить
@austinZen8800
@austinZen8800 - 12.05.2023 10:52

Per usual Deborah is the go to person for the best coding tutorials! Looking forward to a $Thanks button with future videos so that I can forward a little $ your way.

Ответить
@ashishnamdeo6879
@ashishnamdeo6879 - 11.05.2023 07:03

Awesome explanation.

Ответить
@sergiim5601
@sergiim5601 - 11.05.2023 04:09

Great content as always!

Ответить
@elyoaprogrammer
@elyoaprogrammer - 10.05.2023 21:09

Hello thanks for all your Angular content contribution.

Ответить
@ainoodauda
@ainoodauda - 10.05.2023 20:32

Thank you, really appreciate your help and support

Ответить
@barny1174
@barny1174 - 10.05.2023 19:56

Thank you for the detailed explanation. ❤

Ответить
@hamza201183
@hamza201183 - 10.05.2023 19:17

Thank you very much Mr Kurata!

Ответить
@Emmodi10
@Emmodi10 - 10.05.2023 18:51

Wonderful video, straight to the point

Ответить
@ThanhNguyenTien
@ThanhNguyenTien - 10.05.2023 18:25

🎉thank you so much!

Ответить
@julienwickramatunga7338
@julienwickramatunga7338 - 10.05.2023 17:50

Thank you, very clear explaination.
Well done with the "let's debug" end section, very instructive!

Ответить
@rs4267
@rs4267 - 10.05.2023 16:34

Thanks, I was waiting for this video 😊

Ответить