16_components_are_important

Jul 13, 2026 07:13 · 3:09 · English · Whisper Turbo · 2 Garsiakalbiai

Šis transkriptas baigia galioti šiandien. Atnaujinti, kad būtų užtikrintas nuolatinis saugojimas →

Lekcijų indeksas

0:02

S… Speaker 1 (16_components_are_important)

In the last lecture,

0:03

S… Speaker 1 (16_components_are_important)

we had a closer look at what happens at the point of time we

0:07

S… Speaker 1 (16_components_are_important)

visit localhost 4200 here in the browser.

0:11

S… Speaker 1 (16_components_are_important)

We understood that the index .html file is served,

0:15

S… Speaker 1 (16_components_are_important)

that it will contain a bunch of scripts here,

0:17

S… Speaker 1 (16_components_are_important)

which get executed,

0:19

S… Speaker 1 (16_components_are_important)

which then basically start the Angular app.

0:21

S… Speaker 1 (16_components_are_important)

The Angular app gets the important information that it should know,

0:25

S… Speaker 1 (16_components_are_important)

the app component that it should analyze it.

0:27

S… Speaker 1 (16_components_are_important)

With that information,

0:28

S… Speaker 1 (16_components_are_important)

the...

0:29

S… Speaker 1 (16_components_are_important)

Angular code is able to parse this here this

0:33

S… Speaker 1 (16_components_are_important)

app root Component here understand it and insert

0:38

S… Speaker 1 (16_components_are_important)

our angular application at this point and that is why we don't see Loading

0:42

S… Speaker 1 (16_components_are_important)

dot dot dot which would still be in the source code of this page as you can see

0:46

S… Speaker 1 (16_components_are_important)

but instead why we see this because angular Overwrites

0:51

S… Speaker 1 (16_components_are_important)

this at runtime because that is well what it does.

0:55

S… Speaker 1 (16_components_are_important)

What's what its job is?

0:57

S… Speaker 1 (16_components_are_important)

So now that we had a closer look at this startup process,

1:01

S… Speaker 1 (16_components_are_important)

let's have a closer look at this component or add components

1:05

S… Speaker 1 (16_components_are_important)

in general.

1:07

S… Speaker 1 (16_components_are_important)

Components are a key feature in Angular.

1:10

S… Speaker 1 (16_components_are_important)

You build your whole application by composing it from

1:14

S… Speaker 1 (16_components_are_important)

a couple of components,

1:15

S… Speaker 1 (16_components_are_important)

which you create on your own.

1:17

S… Speaker 1 (16_components_are_important)

Now,

1:18

S… Speaker 1 (16_components_are_important)

we do start with this app component,

1:20

S… Speaker 2 (16_components_are_important)

the root component,

1:22

S… Speaker 1 (16_components_are_important)

you should say, which holds our entire application basically in the end.

1:25

S… Speaker 1 (16_components_are_important)

So this root component,

1:27

S… Speaker 1 (16_components_are_important)

this app component,

1:28

S… Speaker 1 (16_components_are_important)

will be the component where we later nest or add our other

1:32

S… Speaker 2 (16_components_are_important)

components to.

1:33

S… Speaker 1 (16_components_are_important)

So to this template,

1:35

S… Speaker 1 (16_components_are_important)

this HTML file of the app component,

1:37

S… Speaker 1 (16_components_are_important)

this is where we will later add our other components.

1:40

S… Speaker 1 (16_components_are_important)

Typically,

1:41

S… Speaker 1 (16_components_are_important)

we might have a web page like this with a header with home and users,

1:45

S… Speaker 1 (16_components_are_important)

then a main area and a sidebar maybe.

1:48

S… Speaker 1 (16_components_are_important)

Now if we have a look,

1:49

S… Speaker 1 (16_components_are_important)

this would be a fitting component,

1:51

S… Speaker 1 (16_components_are_important)

the header.

1:52

S… Speaker 1 (16_components_are_important)

And maybe also the items on the header could be their

1:56

S… Speaker 2 (16_components_are_important)

own component.

1:56

S… Speaker 2 (16_components_are_important)

Could be,

1:57

S… Speaker 1 (16_components_are_important)

you don't have to.

1:58

S… Speaker 1 (16_components_are_important)

You will learn throughout the course how I approach the splitting

2:02

S… Speaker 1 (16_components_are_important)

up of an application into separate components.

2:05

S… Speaker 1 (16_components_are_important)

We also have of course our main area and the sidebar

2:09

S… Speaker 2 (16_components_are_important)

here as components.

2:10

S… Speaker 1 (16_components_are_important)

And that is the core idea behind Angular,

2:14

S… Speaker 2 (16_components_are_important)

build components.

2:15

S… Speaker 1 (16_components_are_important)

Each component has its own template,

2:17

S… Speaker 1 (16_components_are_important)

its own HTML code,

2:19

S… Speaker 1 (16_components_are_important)

maybe its own styling,

2:20

S… Speaker 1 (16_components_are_important)

and more importantly also,

2:22

S… Speaker 1 (16_components_are_important)

its own business logic.

2:24

S… Speaker 1 (16_components_are_important)

And this is the great benefit.

2:26

S… Speaker 1 (16_components_are_important)

It allows you to split up your complex application,

2:29

S… Speaker 1 (16_components_are_important)

your complex webpage,

2:31

S… Speaker 1 (16_components_are_important)

into reusable parts.

2:33

S… Speaker 1 (16_components_are_important)

You may use a component more than once.

2:36

S… Speaker 1 (16_components_are_important)

And that allows you to easily replicate that business logic,

2:39

S… Speaker 1 (16_components_are_important)

replicate that styling,

2:41

S… Speaker 1 (16_components_are_important)

or in general,

2:42

S… Speaker 1 (16_components_are_important)

make a finely controlled piece in your application

2:46

S… Speaker 1 (16_components_are_important)

without having to crunch everything into one single

2:50

S… Speaker 1 (16_components_are_important)

script file,

2:51

S… Speaker 1 (16_components_are_important)

one single HTML file.

2:53

S… Speaker 1 (16_components_are_important)

Instead,

2:54

S… Speaker 1 (16_components_are_important)

it's very easy to update,

2:55

S… Speaker 1 (16_components_are_important)

very easy to exchange,

2:56

S… Speaker 1 (16_components_are_important)

and again,

2:57

S… Speaker 1 (16_components_are_important)

reusable.

2:58

S… Speaker 1 (16_components_are_important)

So let's have a closer look at how we actually create a component

3:02

S… Speaker 1 (16_components_are_important)

and what this add component thing does.

3:05

S… Speaker 1 (16_components_are_important)

in the next lecture

Šis transkriptas buvo sukurtas AI (automatinis kalbos atpažinimas). Gali būti klaidų — patikrinti pagal originalų garso kritinį naudojimą. PG politika

❤️ Patinka STT.ai? Pasakyk draugams!

Santrauka

Spustelėkite Sumarizuokite, kad sukurtumėte šio stenogramos AIS santrauką.

Klausti AI apie šį transkriptą

Paklauskite apie šį stenogramą: AI ras atitinkamus skyrius ir atsakys.

Perrašyti kitą