All language subtitles for 086 Birthday Reminder - Complete.en_US

Nicely done.

And once we've got our static data out of the way now, of course, and let's make this project a bit

more interesting, where I would want to set up some kind of street value that set up our default value

with our data.

So a list of people and then, of course, puts it into a list, iterate over it, and then eventually

also make this button work where at the moment it is just logging.

You click me and I think I'm going to start with state value.

So I'm going to go here with and people and then set.

People, and that is equal to my state and as far as the default data, well, I'm just going to pass

in data that I'm getting back from the data file.

So I pass it in.

And I know I already covered this a bit before, but I have my data, Jaspal, in here.

I have my array of objects and then each represent that particular person.

You'll also notice of the syntax where notice how I did not name this array.

Normally prior to that we always did something like this where we have either a function or some kind

of array or object or whatever, and then either we are going with named export or if we're setting

up export default, we do it right after where we go with export default.

And then, of course, the other way we can do that is by simply writing export default and then whatever

we're going to be exporting.

Please keep in mind that both of them do exactly the same thing.

Where when we import, of course, we can come up with our own name in my I have this data just like

the file, but this is also possible where if you know that you're exporting as default and by the way,

this is only for default.

So you cannot do that with name export.

With name export.

Yes, of course, you would need to set up as a variable when you're setting up a default one.

Yes, you can do it where you go, export default and then whatever you're exporting.

Now, I'm not the biggest fan of this particular setup, so I'm just showing you that that is possible.

But in most cases, you won't see me using this type of syntax.

So we have our right now that is my default value.

And you can probably already guess that since I have this list, I will pass it in.

So I'll say here, people.

And that is, of course, equal to my people state.

So I'm setting up people are equal to my people state.

And before we move on to a list, one thing that I could do here and adding three is check.

Well, how big is my list?

Correct.

And I can do that by going for people and length since I know it isn't right.

And so I save you'll see that I have five birthdays.

Why?

Well, because my list has five items.

You would have to.

Then of course, it's going to say to you, if you have three thousand, then of course you can already

guess that the birthdays text is going to have three thousand here.

And once we are somewhat done in our address, we just need to clear the list eventually.

Then of course, I would want to navigate to my list component and then in here I need to deal with

that people and all the structured right away and the function parameter.

I'm going to say that I'm looking for my people.

And now, of course, I would just want to iterate over.

Now I will leave the fragment, but I'll delete the hearing too, and I'll say people.

So that is, of course, my problem.

And I have my my method now.

I will set up a perimeter here with the name of person.

So that will represent each and every object.

And then since I know that in the data, the properties for each and every object are ID, name, age

and image, all the structure right away because I think it's going to be faster.

So I'm going to go here with Consed and then I'm looking for ID, I'm looking for name age as well as

the image.

So that is coming from the person and need decide on my return and what I would want is the article.

So I'm returning the article and then let's add right away.

So this is where we'll use that idea.

Now also, let's add a little bit of styling.

So here a person class and inside the article, we're going to go with an image now, of course, for

the source.

I will use my image properly then for the alternative.

We're just going to go with name.

And then we're going to have another thing, the d'Hiv, we have the name and the age shown here.

Let's go with heading for and we'll type your name.

And then right after that, we're going to have a paragraph with an age.

So with my age property and of the.

So once we say this is what we should see on the screen, so we have five birthdays.

That is the length of my list.

And each and every item is a present that we have an image with a name as well as well how old they

are.

And the last thing that I would want to do in this project is to add functionality to my button where

I can clear the list.

So I have state value.

I have some people areas and.

All right.

So the only thing that I would want in this case is to go back to my online function where I'm setting

up the unclick.

And let's just go to that people online.

As far as the new value, I'll just pass in the empty.

All right.

And then, of course, once I click on a button, notice how we close.

And also since we're checking the length and of course, it is going to be zero birthdays today, hopefully

everyone enjoy the project and I hope to see you in the next project.