Amazing job, we successfully watched all our tours there, so of course, let's worry about displaying
it on screen, I have my state value when in stores and I have my tourist component so I can use the
props.
I can say towards prop is equal to a towards state value.
And then, of course, in the tourist component.
Well, I would need to deal with my towards prop.
Correct.
So in here, all the structures right away.
I'll say my thoughts and let's work on our return, so instead of heading to we're going to go with
S. four here and I would want to set up my title first.
So there with the class of title and then inside I'm going to type heading to and inside I'll type our
horse like, so let's say it.
And after that, I'm going to add a little bit of underline to sit there with a class of underline beautiful.
And then right next to this div, I also want to iterate over my thoughts.
So let's place a div and then let's go with torse, then map and then of course each and every item
will be represented by some kind of parameter.
So in my case I'm going to go with Tau and since I have the to work component already imported in the
torch component, I can simply say return and then the third component.
Now I still need the key.
And if you check out the API, you'll notice that each and every item has the array.
So this is exactly what I'm going to use.
So I'm going to go with Tau, Heidi, since we have the list.
And then in order to speed this up, I will set up right now.
And by the way, not there is a bit of an issue where I need to place my return inside here.
So I forgot about the curly braces.
Then we're setting up the return.
And then in order to speed this up, in order for me to get all the properties that are in store, whether
I design the name in four image and all that good stuff, I'm just going to go with Object Operator
where I set up the curly braces, da da da and mentor.
And what that means that in the to work component I'll have access to all the properties that are in
my object, so I'll save it here.
And then at the moment I can see that I have five single top components.
Why?
Well because my list has five items.
And then as far as the door, the moment it just returns, adding to with a text of single to work component.
So let's start first by the structuring all the props, which are properties from the object I'm looking
for any more for image, looking for info and then price as well.
Name would be good too.
So I've got all these things and then I'll need to work on my return.
So instead of having to it's going to be article.
Then we're going to remove this text right away.
Yes, so let's take your class name, single or Alexa, and then we're going to set up a image here.
We're looking for source.
And of course, as far as the value we pass and the image property that we're getting for every object
and for the alternative, let's type the name, of course.
Now, right next to the image, I would want to set up a footer element.
And inside there, there's going to be a dev with a class of your info, Weichsel.
And inside here, let's go with heading for, um, let's display the name and should see all the images.
As well as the name?
Well, right next to the name, I would want to go with another heading for now.
This one will have a class name and we're looking for here the tour price.
So that's the name of my class.
And let's acknowledge one here, of course, and let's target the price problem.
And there is now we should see the title as well as the price.
And I think I can close the console for now and let's work on the paragraph because I would want to
display all the text.
Now, don't worry, of course, we will work on the toggle functionality a little bit later.
But for now, let's just go with paragraph and say the paragraph.
I would want to display my info.
So essentially a description of my door.
And then as the last thing, there's going to be a button that allows us to remove the door from the
list.
So for now, we're just going to go with button.
I will add a class name of delete on hyphen between now.
I won't set up the unclick yet and let's just say not interested.
That is going to be the text.
We save it Amatus.
Now we have everything, we have the image, have the name of the store, we have the price as well
as the info and button that says not interested.
So if we navigate a bigger browser window, of course there is.
Now I have all Minotaur's as a side note.
Of course, I have massively zoomed in.
So if you put down a percent, you should see something like this.