Activa JavaScript para disfrutar de los vídeos de la Mediateca.
Back end vs Front end - Vídeo 9 - Contenido educativo
Ajuste de pantallaEl ajuste de pantalla se aprecia al ver el vídeo en pantalla completa. Elige la presentación que más te guste:
Generando JSON. Guardando los JSON en MongoDB.
well in this video we are going to start to see how to save the data that we are passing from the
00:00:00
front to the back in json format, it is worth before commenting well, write down if we want to put a
00:00:06
longer extension to the routes that we have been creating in the previous video, for example, imagine
00:00:17
that I want to put here, dam 2, okay, dam 2, okay, I could be putting in all the routes that we had, in this case they are only these two, but we are going to do more when we create a new one in the Thunderclient, a new one, a new request, localhost, okay,
00:00:22
So, if I put, for example, register, it will come out registering and such.
00:00:49
Well, you have the option of, instead of putting this extension in all routes,
00:00:54
here I would have missed the slash, okay, instead of doing it here,
00:01:00
as we have all routes configured in router and router we are importing it from appjs,
00:01:06
in the out road variable we can take and put it in the extension here it is worth in the app
00:01:18
use out road because all the links are saved there and whenever you want to make that extension
00:01:28
to all the lines and I here I put dan 2 as it is worth because this is going to work for me exactly
00:01:37
the same by registering and if we put the login because it is the same, it is good because when I want to
00:01:50
do something generic I can do it from the pp js ok and now we are going to work on our
00:02:01
json ok then the json that we send from the front to the back in this case you already know that our
00:02:11
front we are simulating it with the thunder client ok then until now what we did was
00:02:18
answer a registering or logging in, which is what appears to us here in the part of the response
00:02:25
logging in because I am in login or in the register registering is worth then what I was telling you
00:02:33
the other day in the network is the data that we are going to send from the backend to the front and in the
00:02:45
req request is the information that they are sending us from the front to the back in ok then we have
00:02:54
we are going to do different tests so that you see this I am going to leave this for now we are going to leave it like
00:03:03
this ok then we can make a console and that it prints what I am sending from
00:03:11
the front in it in the back then I put the console I am going to print in the terminal
00:03:27
what I am doing if I come to my client to the client I come to the body I see that I can
00:03:37
use different formats of data in this case I am going to use the json and the json I put a
00:03:48
key I put the key that I want to put in quotes is worth for example name and we put the
00:03:57
value, for example, Alice, okay, if I put more fields, for example,
00:04:08
it would be worth putting this comma here, well, I don't care, I'm going to put it like this,
00:04:17
Villablanca in the last key value, I don't put any comma, okay, I'm sending from the
00:04:31
body of the client is worth these two this document with these two key values alicia villablanca
00:04:38
enemy the surname is worth if we come now to the controller of the register route it has to first
00:04:47
print us down here if everything is well done those data json is worth and then registering
00:05:00
then if we come and we give the send we see that if it puts us registering but here we
00:05:09
appears an indefinite but it does not put it as an error it only tells you that those data that you are
00:05:15
sending does not know them ok then what do I have to do come to the pp js and you have to
00:05:23
tell express that the format of data that you are going to use is the json then that here
00:05:29
after lifting the service I am going to put the app.yus we are going to put express.json
00:05:38
ok and now if we go back to our client and send it
00:05:49
you see that the name appears to me alicia the surname villablanca ok then well this
00:06:00
for now has done it for me well now we are going to continue playing with this we are going to put
00:06:08
example in the controller I am going to take it and I am going to say it well I am going to create some variables between
00:06:13
keys and what is going to be we have the name and the username ok well we are going to put a variable that is
00:06:23
name and another one that is the south of these variables I want you to take them from the information that you are
00:06:38
sending us, it is worth then I put here the same and I am going to put the reg point here,
00:06:47
okay, and here I want you to put me that you print me that you draw me the name or and the south
00:06:56
in the position in which I put these variables, it does not matter, it is not necessary to put it in the
00:07:04
same order, it is worth if I now launch you see that it puts me alicia and villablanca, it is not doing it
00:07:15
well, it is worth then what happens if instead of putting the same fields that I am putting in the keys
00:07:24
pongo otros que me va a dar un error porque al final lo que estamos haciendo para la imaginación
00:07:31
que pongo ahí pues eso en dos en lo que estoy haciendo es mapear ese jota son que estoy
00:07:37
recibiendo en el rey punto body a estas variables vale y necesito que me meta en cada una de estas
00:07:46
keys the value that is associated if I put in two I do not understand I do not find that key and that
00:07:54
is going to give us an error that is going to tell me that it is undefined then this so that it is clear
00:08:02
that always the same name is good then we would have our we are receiving the json from the
00:08:10
from we are printing it well
00:08:20
ok if instead of printing it by terminal what I want is that I teach it
00:08:24
by
00:08:32
in the in the as response is worth that we only send that data to the client
00:08:41
then it would be the same as we have done the reset that appears here
00:08:46
registering I now what I want is for the json to appear here instead of in the terminal it is worth
00:08:50
then to do that I do not use the resen I use the res.json it is worth and in parentheses that json that
00:08:56
we want to send in this case because it is the same as the body is worth point and comma and then if we
00:09:06
ejecutamos ahora veis que me está devolviendo el cliente está recibiendo ese jota son así que hemos
00:09:15
enviado este jota son desde el cliente al servidor y luego el servidor me ha vuelto a enviar es el
00:09:23
mismo jota son pero ya sé que estoy enviando y recibiendo un jota son vale seguimos
00:09:29
I what I want now is to pass those data through the model the mongoose skin and then converted
00:09:36
into a model is worth for me to check all these all these options is worth this in the previous video
00:09:49
had it and without the d I had written it wrong, then in the request you have to put a d
00:10:01
that I have seen this before and I have changed it here but you have to change it
00:10:10
you too and in the bus as every time I generate or receive a document because some
00:10:16
instance of that document is worth we are going to put a new one that is better worth then we put the new
00:10:25
y la de vale entonces cómo voy a trabajar con esto vale entonces lo primero que le vamos a
00:10:31
decir es que esos valores que estamos recogiendo en el controller vamos a hacer primero bien la
00:10:40
consulta sería el sería el username vale no no me importa el orden en el que lo pongáis a cuidar
00:10:49
of that we are going to put here because we had also said the email and the password is worth and with the
00:11:02
same names that we have put here is worth then username this
00:11:17
e-mail to put it mario
00:11:23
dandos point rg
00:11:36
and the password we are going to put it
00:11:40
1234 for example and since this is the last key value that I am going to pass I do not put the comma
00:11:47
ok it would be ok this if I go to send it shows me the data here it is ok
00:11:55
ok I come to the controller in the controller now
00:12:03
this I cannot put the name and the sub name because those fields right now do not exist
00:12:09
then here the ones that I am going to pass are the user name the email and the password
00:12:16
these values I collect them from the body this I am going to remove it
00:12:27
and now I have to pass this on to a new user then what is the first thing I am going to do
00:12:34
import that model that we had created this user is worth remembering that when I create
00:12:42
a mongoose point model I put the name that you want I put it user and then what
00:12:48
scheme is associated with this model is worth that is all this that we have put above
00:12:54
then in the controllers the first thing we have to do is import
00:13:02
I do not remember if we have it with default, we have it with default, okay, so well, import, user, from, here we are going to put models, user model, point, remember, js, okay, okay, I already have this user,
00:13:06
then now what I want is to work on these three values these three values that I am going to
00:13:38
do I am going to pass it to a new user and I am going to pass the username I am going to pass the email and I am going to
00:13:43
pass the password ok I pass these balls ok then if this is fine now it should work for us
00:13:58
eye I'm still not saving it in the database then let's go since we're going to validate it
00:14:13
ok and mongoose is not going to skip the validation until we try to save it in the database
00:14:21
what I am going to do is once I pass it through the model through that filter I am going to save that variable I
00:14:27
cannot save the new user that as always we have to declare a variable that in this case
00:14:35
because I can call it new user or as you want it is worth as you want and what I am going to
00:14:40
to do here is because no point 6 is worth and we are going to if you want we are going to console point
00:14:47
news
00:15:14
to see how this works for us
00:15:22
then we are first in our json that everything is fine okay
00:15:25
when we are in our when we have created our connection to mango
00:15:35
yes I have told you that although we created the database until we saved a user a document
00:15:46
in the database was not created then if we come we are seeing this if we come to our
00:16:01
mongo express is worth localhost 8081 I have already logged in I already have here the database and I do not have
00:16:13
any data ok then we go back to our visual studio code in the visual studio code if now
00:16:20
we give it to send ok this visualizes me because we have put the console ok I have put this
00:16:32
option I have put it in new users I see that it has generated this document with the key user name
00:16:41
mario key email with the value mario arroba dan 2 point rg the password 1 2 3 4 and then
00:16:50
also mongo puts us this and this identifier is worth that it only does it automatically if
00:16:57
now we come to our our mongo express ok we come
00:17:05
let's see that we are seeing it that if I update
00:17:14
I have already created the database of dandos must be worth if I go to view
00:17:19
I already have mario mario here giving us 1 2 3 4 ok if you click on it
00:17:27
ya os aparece aquí vale voy a volver al visual studio code vale y entonces aquí vamos a empezar
00:17:33
a hacer formas pruebas entonces tenemos nuestra petición vamos a imaginarnos por ejemplo que yo
00:17:44
intento meter si estos campos o sea este jota son sin la clave username vale cuando la clave
00:17:53
username we have said that it is required then if from here we launch we are going to stop this
00:18:04
if I launch it, it tells me, the error jumps and tells me that the username is required,
00:18:24
then we are going to put the username again, we are going to put another name here,
00:18:29
for example silvia the mail I'm going to leave the same and the password but I'm going to leave the same
00:18:38
this if I give it to the center I get an error ok because because I get the error and it tells me that
00:18:48
here it is worth first believe it silvia mario
00:19:12
here you are ok it says the email is duplicated by putting that the email has to be unique by
00:19:23
putting that it is unique we are telling it that the key is ok then this is already giving us the error yes
00:19:38
we come to see
00:19:45
ok if we come to our express and update ok I see that he has not saved me this
00:19:59
jota are if I change it here and I put sylvia I save sense it is worth this
00:20:09
is worth it is going to save it and if now we come
00:20:29
to our mongo express ok and update because if I have changed the email and it will do everything for me
00:20:34
well ok ok let's go back to our visual studio code what else are we going to be doing here for example
00:20:49
when I do when I save the data inside the mongo db because as we did when we made the
00:21:02
connection when we are going to do an operation on a database, yours is always to do it
00:21:12
asynchronously, it is worth because there may be problems then we already know that to do it asynchronously
00:21:18
you have to put the weight and that has to be accompanied always with the async is worth and
00:21:24
además deberíamos controlar el que se pueda producir algún error entonces vamos a hacer
00:21:30
todo eso entonces ya sabemos cómo es aquí le metemos en la zinc aquí le voy a meter en la
00:21:36
weight we are going to put for example here well for example the track at this value we are going to pass it
00:21:45
ok I'm going to tell you this is fine everything then we are going to put it here control x
00:22:06
control v here I am going to tell him we are going to create a variable with
00:22:14
I use for example ok and we are going to put
00:22:26
control x I do not want it at all we are going to pass the res dot j son
00:22:35
users to see if this is going to take us, it is worth that it shows us there everything is fine and here
00:22:43
good because if there is some type of error that it does not show it by the console
00:22:58
error ok this we are going to erase it ok and so we already put it we do it asynchronously we put it
00:23:02
on the web because this is the operation that we want to do it in the background we visualize we
00:23:24
send the front a json with what we have saved with the data that we have saved
00:23:30
y si hay algún tipo de error también lo controlamos y lo visualizamos vale
00:23:36
entonces vamos a poner aquí silvia vamos a poner
00:23:41
y un 234 vale le doy al senf me visualiza el jota son vale me lo
00:23:52
visualiza bien si venimos a nuestra base de datos
00:24:00
to see that we are here if we come to our database and update I already have here anna
00:24:10
worth silvia and mario so everything is working for us well as we are developing it is worth
00:24:17
creating or doing the function is the register variable is worth the arrow function is worth
00:24:30
What else can we do? Well, instead of using the Mongo Express, if you don't want to be with the browser open and such, I like it more, but there is also an extension that is Mongo, Mongo, this MongoDB, okay, that if you install it,
00:24:40
I am going to appear here the sheet of this of the monkey and then here I tell it to connect and
00:25:03
because we are going to tell it to put
00:25:13
must be two points and the server where we have the monkey is valid in execution that is localhost
00:25:18
ok then here if you see we already have we have already made the connection we already have here our
00:25:29
database giving us we have the different documents ok and in each of those documents and
00:25:37
click on it you also have them ok and it is also a way to see it from the
00:25:46
visual studio code itself ok what else can we do we can put a time a time stamp that is also
00:25:51
usually use a lot within these values and also that it does not do it automatically, it is worth if I tell you
00:25:58
what I told you the other day, it is worth that if you have to use the technical documentation then if
00:26:08
we come here it is worth the documentation of mongoose here you have different options it is worth
00:26:14
pues el máximo o el mínimo número de caracteres que queréis en cada uno de los campos que acompañan
00:26:26
a la clave vale con cada uno de esos valores cuando estamos trabajando con string cuando
00:26:36
estamos trabajando con números con date vale entonces que insisto en que aquí tenéis toda
00:26:40
esta información que la podríamos ir utilizando e y que os tenéis que acostumbrar a utilizarlo
00:26:46
ok then let's go again to our code and let's put then let's do
00:26:56
this I'm going to close this I'm going to close this I'm going to close this I'm going to close
00:27:04
in the user model ok we are going to use the model and here I am going to do another section then
00:27:13
as we are going to do another section we are going to pass here a comma and another key ok and I create
00:27:19
another section that I am going to put in this section that I am going to say because it automatically saves me
00:27:27
the time the date at which this document has been created, so I am going to put it
00:27:34
time stamp, you have it, they are two points and we are going to tell it to be true, it is ready
00:27:41
and then this when we are going to generate a new document that this is going to be
00:27:54
jacinto and 1234 you see how now it is they have automatically come out these two fields the
00:28:05
created one with the date and the update is worth with the same date if I did some kind of
00:28:22
update on this data because I was going to modify it too, it is worth and it is interesting if we come now
00:28:29
to express
00:28:38
update ok I already have here to jacinto and I have the fields of these dates that we have left them before
00:28:43
without putting it in, that is why it is also important to have that scheme and that mongoose model
00:28:52
so that all the data has its values and here we leave this video a greeting see you later
00:29:00
- Idioma/s:
- Idioma/s subtítulos:
- Autor/es:
- Mario S.
- Subido por:
- Mario S.
- Licencia:
- Dominio público
- Visualizaciones:
- 73
- Fecha:
- 10 de julio de 2024 - 23:30
- Visibilidad:
- Público
- Centro:
- IES VILLABLANCA
- Duración:
- 00′ 39″
- Relación de aspecto:
- 1.78:1
- Resolución:
- 1920x1080 píxeles
- Tamaño:
- 74.75 MBytes
