Now, before we create methods that is going to fetch data from our API, we add in a requirement to
create a button that is going to help us achieve that target.
That means that it is going to be the button functionality to actually call for the API.
So let's just create a button and head to your buttons or G6, which you have already configured now
inside this in the parent to give it a class name of buttons.
So it'd be giving it a class name of buttons.
And after this buttons, remove this better off element.
And create a button button element, so this is going to be a button element, and this is going to
have different properties once we data via props through our courts.
The GSX, but not just leave it empty with only a style in line style that is going to be equal to.
Of color that again, is just right.
OK, so this is all the started that we get in for, not now.
Close this and it is going to speak out.
New good.
OK, so it's done hit save.
Now, head to your quote, stodgy six.
Because they're going to call up an element within and first import your button.
So it would be importing abundant components, import buttons.
So we have buttons, not just let's put up this button right beneath our other.
So we'll be putting up our buttons, red meat reports, water bottle and it's if not at a see if everything
is working fine.
So we see that everything has compiled successfully.
Now let's just close this and view your application.
So here is a button without any sort of colors, and this is just pure light.
So now this is a button, but this is not something that anyone would appreciate, right?
So let's just head back to our code editor and add costs to it.
So for to see this, head into your code, Stratasys and the first element that we're targeting now
is going to be a buttons.
So let's just plug it a button and this button is going to have a modern talk because you want to actually
give her a little space between now his name and the button.
So will do the margin drop off during and after the modern top value?
Add a display of flex.
And this should be able to flex and after the display will give it a line item center because we want
to send a certain item center and justify counting center.
Now read Save and let's see application with these functionalities have been added or not.
OK, so I can find.
So, yeah, we have a space in which we know it doesn't matter what now.
Now, if we just head back into a quarter to.
And after the buttons had three buttons, Georgia six, and this button is going to have another class
name and this class name is going to be called a button.
So let's give it a class name.
It is going to be to button.
It's a.
No, going to court logistics and court justices, I mean, and now we are getting our button.
This time it's the actual button.
This button, we want to give it to despair, flex.
So let's just give it to this day of Flex.
And after this baby, want wanted to center it so as you justify contents into a line item center.
And after the gist of our continent, a line items will be departing because we want to have its bearings
around it for pictures and.
And after four weeks, as they put up with 17 boxes, 17 mixes, now let's just hit seven of your application,
so everything is compiled successfully.
So we are having a batting is not OK.
But still, the color is not something that anyone would appreciate.
But then again, this is going to change along with the background before we add props to it.
So head back.
And after the batting, we want to add a border.
Of none.
And after the burning will give it the outline of none.
And after the outline, we were at a border radius of three pixels.
And north of the border, radius will make sure that it, of course, I point out, because whenever
we have our way, we want to point out is to be shown up, not after the cursor will give it the height.
Thirty five pixels and after the height, very good text align, I feel as if I wanted to go in it.
No text align and this again did not save and let's be replication.
So, yeah, we definitely see changes.
If I just.
OK, so it's time to move into a.
Good stuff, G-6, and add the functionality that is going to help us to fetch our data.