So next will be moving on to creating the north component, which is like our review component.
We're calling it a node right here, so that will be creating inside the components whole so you can
call it at the view or ignored whatever.
I just came up with that, not at all.
Simple and certainly components will do the ad and all the ideas.
Volunteers and the very first thing which we'll do is we'll import the boilerplate code of React using
that extension and also tweak and sort of see.
That's it for inside of here.
Now we will, first of all, will give the basic structure and then will give the functionality like
us, will like the how it will look and then it will provide the JavaScript.
So first we provide the G6.
So inside the very first thing which will do is through text, media.
OK.
So for next year, we will get some properties like doors and columns.
Name is not required and will give.
So ideal and so is not required right now.
We'll give just two columns and it.
It also read and columns are 10 columns, and those are it.
So not to you know, it just eight is enough to offer that.
What we'll do is we'll provide a placeholder, but there will be a place holder and we will give the
value to it like Typekit a view here that I.
To view.
Well, and then two dots after that, we will have some on change and we'll provide the value, but
we'll do that when we are doing other things like JavaScript.
OK.
After that, we'll be having a further to the North, which will be having the data, and it will swing
those two characters on which characters are left to which we can write.
It will have a publisher button, which we will like just click and our view will be poster or published.
After that, we'll have another div.
So inside, as do what we'll do is we'll write a character list and character land on which characters
are left to that we write in small steps.
Also inside this mall, we'll.
First of all, we just tried to like 200 left field hard coding in total and nothing else.
OK.
So after this, we'll have a button that will be for the publishing thing.
So that I need to import button from material away, so I will go ahead and whatever was the button.
So I will copy is line.
I will import department.
So Burton is important.
But after the small attack, that would be debatable, it's all inside here.
Here they'll be debating.
But then and that is done, it should be self closing, but just not so let me provide.
OK, OK.
Guard selfless executing.
So inside the button, that would be in some text and that would be also an icon.
So let's me read the text to actually publish.
And after that, that would be an icon.
Or that icon will grab somebody like, Oh, let's see which one we are going to use now.
So we will be using up a low key like the upload thing.
And this one.
Well, Peter, this like this more relevant to like publish and when I come here, so I will import
retail and after this publish, I will copy this.
And I just see it.
Now, when I go to the browser.
So, OK, it will show up because we have not imported inside the apologies.
OK, my bad.
My bad.
So it is true that first inside the apology is what will do is really important.
The notes, I note, OK, auto important, that's a really good thing.
Ahead, what we'll do is we'll write and.
No.
And we'll see it.
Now, I should be rendered on our homepage.
And it's loading.
Basically, we see a text box.
Whichever place holder and others like the limit to the terror characters and the populist button.
You know, basically we will give some styling so that it looks forward.
We'll will go here and.
We'll provide some glasses to the this.
And the very first class which will provide to this, it would be class name, and so this will give
the note, you know what, Neal?
And the other class is the note football.
Basically, this after the text area, which is there, so that will be having the same name.
Oh.
No, but.
I think that said.
But the button also, we can give a glass.
And.
Last name.
And that would be Steve.
They wouldn't have the same trust, so that would be save.
Now, let us go, and if these styling.
Let me first say this.
And now we will go to the next hour ceasefire.
So so far, we have covered till this urgent focus now.
We will go to the northern you.
So that will be not.
Thought new?
New.
And start of this, that it would be a background color.
Background color would be this a hex code, basically that will be C the F.
And to see a.
I hope that's correct.
OK, we'll save it, and now we'll style the tax study on learning for see if there is some changes.
Yeah, we see this column right here.
Obviously, we don't want it like this, but we'll style it in like coming to a consortium.
So we'll do that.
OK, so inside the no doubt new.
We have done it now, we will do the tax studio next area.
So we'll do the border.
None.
This is this.
Do not they should not be providing that precise thing.
We'll give our background color.
And that will also be some c d f to the.
We save it, and now we will go to see if that looks good.
You can see there is no nobody saw this type of thing going on will say, Well, it's our plan.
Also, there's no need for that in the next coming time.
So let us know Australia for the.
Next area.
And now we should remove that outline.
Next year.
Focus and start of this will outline the outline is not yet.
And now we will save this.
All we go here and see.
OK, look, there's no outline.
We are typing it here, but there's no outline.
OK, that's good.
That's really nice.
So now we will stand in all four.
So after the text, focus will give the North Focus a sorry not for today nor.
Hooters and the Note four post that will be on display Flex.
Flex and after that, there would be a line items to be sent to.
Line items to the center.
I save it and I come here to see what are the changes.
That is not so much what will make.
So after the ride, Sandra will justify the content to be space between justify content, space between,
OK, we'll save it and all.
If I see there are some changes or not that are because this publish button has moved to this, and
that is a little bit of things happening here.
So that is it.
You might be wondering why it's not looking like a card that will do in the note list, and we are rendering
all of the notes inside one page, so that thing will be done there.
The note footer is done, and now basically we can style the note.
And.
We'll do that.
No.
Inside of here.
So I think the concert for the North now will install the north component that we will render the North.
This will just we're adding now when we add, and that will be showing up on the screen in the UI.
So how that will look, so that will for that will create another component that is the notorious.
So inside of that, no doubt, yes, we'll be creating that, that guard, which would be showing the
like our review date.
And it will also have a button to delete and all of that.
So that will do in the next review.