Welcome back, ladies and gentlemen.
Today, we're going to start a new chapter is called JavaScript Steller.
That's a code name that I use.
It's not connected.
Nothing is connected with the language.
So make sure that you grab the starter file and you're going to have final file in your place.
But grab the starter, put it on the desktop, fire up the.
Let me just close this one.
Um, yeah, let me just close the entire one and just started from the beginning, so open up your Vaskov,
go to desktop, get these starter and inside you're going to have the index file in the lecture one.
Now, make sure that you grab this lecture from your finished finished files, because I'm going to
talk about all of this, and I don't want to waste your time writing it.
Okay.
And right.
Click open with live server.
Make sure that you do have the connection there in in this chapter.
We still going to talk about ESX features in a new features as well, but I didn't want to continue
in that advance section part.
OK, that's the only reason.
And let's talk about what we're going to do today.
Today, we're going to start about Jason.
Some of you know what this Jason is, but please do it again with me.
OK, so Jason is JavaScript object notation.
We use JSON when we want to send data from our site, browser or client side to the server side.
So we use that because we cannot send data through the wire as we want.
For example, I can send JavaScript objects through the wire with HDTV requests.
And so and I imagine that the server will understand what I was trying to do.
So you can't send anything through the wire.
You can send only things that are in Jason the format.
So we need this Jason format because basically Jason is a text now.
Jason is text built on that JavaScript object notation.
Why?
I'm saying JavaScript object notation.
Well, look at here.
This is the example.
Look how the Jason example is very, very similar or resembles to what JavaScript object is.
Now, one more difference here is that we need to use double quotes instead of single quotes.
Remember this.
Everything should be a string.
OK, now in our JavaScript object, we can use single or double quotes.
Doesn't matter, but.
Look, it is so it is very close to what we are familiar.
So this is an array of students.
OK, so we have a first name and then we have or you can say key value pairs.
OK, that's pretty much it.
So we have three different objects inside.
Nice.
So that this is the example and everything needs to be shrink wrapped in double quotes.
Jason is a text and why Jason.
Well, let me show you this.
Well, Jason can be read by all of the languages on the server side.
Right.
I'm not going to give you images here today, because it was it's not important for that.
So that is why we use Jason, because Jason can be read on the server side.
So on the server side, there are different languages like Python go.
So they will understand when they get this Jason format.
So they're going to convert it back to their own language and they can use it.
That's why we can't send straight JavaScript code through the wire to the server.
That's not going to happen.
It's not going to allow us to do that because we need to follow some standard now.
Another thing that we can use is still can use is called XML, so Jason and XML, they're used so we
can send data.
Right now, this is a little bit outdated, but it's still being used.
So here is a boat, Jason and similar used to transfer data and look at the structure of the Ximo.
So this is like the military structure, right?
It resembles the female in this one.
It resembles the JavaScript.
OK, and we're going to stick with that now how what are the steps?
For example, we are in The Blind Side.
This is the browser.
We have a form here.
We just tried to submit something.
We just try to log in using our email and password and that data through Jason travels to the server.
Now, the servers will OK, use their language, convert that data, for example.
We just want to log in, check that we are we have the right credentials and shoot the response back
to the client.
And that response, again, is in Jason format.
Right.
So I'm going to show you just real quick.
I'm going to pause this one and everything will be clear.
So I wasn't planning to include image here, but this is what we do.
So here, imagine we have a login form.
We try to put our credentials here and we send the data into JSON format.
This is what you need to understand now.
The browser, the server, they can be a different language or to be python go or be.
So they going to see this Jason format.
They're going to translate it to whatever they want to whatever language they they have in that request.
They going to do something with that request and they're going to send us back a response with the status
quo, 200.
But the response that they're going to send is going to be a back to Jason format.
But on this side, on the client side, we have JavaScript.
We don't understand this, Jason.
So that is the whole process.
So we need to do something here to convert it back to our Jason, to our JavaScript object.
Right.
So, Jason, we can convert it back to JavaScript.
So these are the steps that I'm going to show you now.
I'm going to do it like this on the first, I'm going to say.
Client side, so this is client side, right, convert
JavaScript.
Object to Jason format, right?
So this is the phase that when we try to send some data.
OK, so that is number one and let's create an object called student.
And this object will have same as our example here.
First name and last name.
OK, I just want to make consistent.
So first name.
And let's put it here, Andy, look, with objects, we can use single quotes, but not with weed.
Jason Right.
So last name.
Let's do it, Garcia.
Cool.
So what I need to use now here, I can't just simply send this data because it's easy JavaScript object
straight to the servers.
So first thing that I want to do so before sending the data, I need to convert to Jason format.
Now, how I will do that?
So there is a method called String ifI.
Let's use this one, so I'm going to create Consed, I'm going to create student.
And I'm going to say, Jason, here like this, and I'm going to say, Jason, that string, if I say
I can use this method and I'm going to pass the student object here just to make sure that everything
is working, just comes along the student object.
Jason Sarina's student, not student object, I need to put this one, Jason, now back in my Google
here.
So here it is, I do have our Jason format, right, cool.
So now you know that in our side, a client side we can use before sending something right before sending
we can use this, Jason, the string, if I and then we can send this data to the servers.
Cool.
Cuz now.
That is the first step.
So let's do what the server will respond back to us.
So when they get to the server, they will do whatever they do with this data.
For example, it's for logging and they will get back us, this student, for example.
Let's imagine that they're going to return the same credentials and it's not going to happen.
But they're going to return some data back to us because we're sending something and they just going
to return now.
They're going to return adjacent to the server.
So No.
Two server.
Will return.
Back data to the client in Jason format, so basically here we need to do opposite of this.
So we need to convert, convert the Jason format to JavaScript object.
And for that reason, we need to use a method called pass.
Pass, so let's create a new object student object, right?
Make sure there is a different name to this one.
So we're going to say, Jason pass and we're going to pass this student, Jason.
Right, because that is the Jason format that we have at the moment.
So this should transform this this Jason format back to JavaScript object so we can do a different manipulation.
So cancel that log, these student.
Object, not Jason.
Object, very good.
Save it.
Let's see.
There you go.
Now we have the student student back to us as here JavaScript object.
So the first one is in JSON format, right?
So when we tried to send something through the wire, we always use we always need to convert that to
Jason format because the server will not understand any other things except ximo OK in the server will
give us a response back to with the status quo, do OK and this data back, it's going to be again through
wires but with Jason format.
So we need to fix that here.
So how we fix it, we'll be passing it back.
So we saying OK, this is in Jason format, let's do it again, let's convert it back to JavaScript
because in a client site we can use JavaScript, the client side, we have JavaScript, we have HTML,
we have Sears's here in the server.
We can have any programming language.
Right.
That is what I need to explain about Jason.
It's a JavaScript object notation so we can use JSON or XML to send data through wires.
But I'm not going to teach you XML because it's outdated.
It's still being used.
But this Jason is pretty much OK, not OK.
But it's great because it's using JavaScript notation.
It's very similar.
So if you understand JavaScript object, you're going to understand this part.
OK, but make sure that you know about if you create sometime in future, we will learn how to create
probably adjacent data with Jason Object like I'm not Jason Object data that is Jason.
So make sure that you understand that this should be everything should be strong and this should be
double quotes.
OK, so you can't use a single code like here we did with the object of the JavaScript.
OK, so that is pretty much it.
Next lecture will be about Ajax and I want you to stay focused because these are your lectures.
But we need badly.
We need them badly because without them we will not be able to continue.
Right.
That's it for this lecture.
So I will see you in the next one.