Guía completa para crear una API de GraphQL

1. Descripción del curso: Hola ahí. Mi nombre es Savvy y esta es la Guía completa para construir un gráfico Pirelli P I con JavaScript now graphic. Estarás ganando mucha popularidad ahora mismo porque es muy superior al descanso tradicional. Ojos AP. Grandes empresas como levantarse Facebook y Yelp se están mudando todas a Injerto Ul porque es mucho mejor durante este curso. Te aseguraré cómo construir un euro gráfico MP I con JavaScript Discurso está estructurado en cinco partes. Empezaré explicando los principios básicos de la astucia. Bueno, después de eso hará algunos preparativos y empezará a implementar nuestro gráfico te l a p. i Por último, vamos a echar un vistazo a gráfico una gran herramienta para probar tu gráfico te l a p i Para hacer todo esto un poco más realista, vamos a crear un gráfico te l a p i para un bloque. Tengo una pequeña base de datos con publicaciones en bloque, autores y comentarios que usaremos como base para nuestra A p I. A seguir. Necesitarás algunos conocimientos básicos de javascript y ningún Js. No hace falta ser un experto en programación, aunque el código y ejemplos que utilicé a lo largo de este curso son simples y autoexplicativos , por lo que el conocimiento básico está bien. Después de terminar las partituras, podrás construir tu propio gráfico PNUD I con JavaScript. Entonces, ¿a qué esperas? Y rodar ahora y continuar con siguiente video donde te explicaré a detalle. ¿ Qué gráfico tú? Bueno, en realidad lo es. 2. ¿Qué es ¿GraphQL?: Hola a todos. Mi nombre es severo y en este video se tomará. Una mirada a lo astuto Bueno, en realidad es gráfico. UAL es un lenguaje de consulta. Esa fue la válvula de Facebook en 2012 mientras trabajaban en sus aplicaciones nativas de IOS y Android. Lo que necesitaban era un p I. Eso era flexible, eficiente y que pudiera funcionar con los datos relacionales que tiene Facebook. Terminaron creándote bien el injerto, porque ninguna otra herramienta podría resolver su problema. Gráfico UAL tiene muchas características que lo convierten en una gran opción para construir un A p I. Así que repasemos algunas de ellas. En primer lugar, ul gráfico es muy eficiente. Permite al cliente preguntar qué información necesita, y el servidor responderá. ¿ Sólo esos datos? También es posible ejecutar múltiples consultas en una sola solicitud, y también se puede navegar por las relaciones fuera de las entidades. Por ejemplo, puedes pedir a grafica que el una lista de tus amigos y el nombre de sus amigos. El UL gráfico devolverá exactamente eso, y no incluirá combustibles que no hayas solicitado, como fecha de nacimiento o correo electrónico. En segundo lugar, gráfico bien, utiliza un sistema tipo. Esto crea un contrato entre el cliente y el servidor, y permite al servidor validar una consulta entrante y proporcionar mensajes de error significativos en caso de que algo esté mal en ella. Ahora, como usuario de un A P I, el sistema tipo te da seguridad adicional porque sabes qué tipo de datos le devolveré el A P . En tercer lugar, gráfico UAL expone solo un punto final para todo tu AP I y está construido de una manera que te permite involucrar a tu A p i sin romper la compatibilidad hacia atrás. De hecho, Facebook dice que nunca tienen versión ahí. Gráfica tu A p I, y que todas las versiones de sus aplicaciones aún funcionan con versiones más nuevas fuera de su A P I. Decía que gráfico que vas a ser el último AP I que debes desplegar bastante impresionante, ¿ verdad? Y finalmente, injerto. UAL no está ligado a ninguna base de datos o motor de almacenamiento específico. Puedes conectarlo hasta tu base de código existente en tu base de datos existente. Incluso se puede usar múltiples bases de datos juntas para alimentar un solo a p I así que fue una visión general rápida fuera. ¿ Qué gráfico te fuera? Esto En el siguiente video, te compararemos gráfico bien con el descanso tradicional AP Ice. 3. GraphQL con la API de REST: hola. Todo el mundo minero misc severo y en este video se tomarán. Un vistazo a las diferencias entre gráfico te bien y descansado sea hielo. Ahora se me ocurrió un ejemplo práctico para comparar los dos. Asumamos que no tenemos un P I para un bloque son bloggers escritores simples, y contiene tres tipos de objetos. Bloquear publicaciones, autores y comentarios. La relación entre estos son bastante obvias. Block presume Air, escrito por un solo autor y block post podría tener uno o más comentarios. Ahora echemos un vistazo a cómo puedes construir sobre una P I. Para esto, usando el principio de descansos, comenzarías por crear un solo y punto por entidad. Desea obtener los detalles sobre una publicación en bloque, y esto contendría el título y los contenidos fuera de la publicación. Otra para obtener los detalles sobre los comentarios. Y esto incluiría el nombre del cartel y, por supuesto, el contenido del propio comentario. También añadiré uno para obtener los detalles de un autor el cual devolverá es el nombre y una dirección de correo electrónico, por ejemplo, y también deberías poder enumerar todas las publicaciones de bloque en la página web. Y así agregas 1/4 y punto que devuelve una lista de publicaciones en bloque. I DS. Ahora esta arquitectura parece bien, pero en realidad la usemos. Quiero renderizar una lista de publicaciones en bloque donde mostramos el título de cada post y el nombre del autor. Por lo que empezaremos haciendo una solicitud para las últimas publicaciones en bloque y la A P. Voy a contestar con un aireado conteniendo las referencias a algunos de estos posts. Después de eso, necesito hacer una solicitud por publicación de bloque para obtener el título y el contenido de cada uno. Pero esta respuesta contiene otra referencia en esta ocasión un post referencias y autor. Entonces para saber quién escribió para publicar, necesito hacer otro conjunto de peticiones para obtener el nombre de cada uno de los autores, y esto es lo que la A P me devolvería ahora. Este ejemplo es un poco exagerado, pero demuestra el dolor. Apunte descanso AP ojos. En aplicaciones de la vida real, definitivamente te encontrarás con situaciones en las que tienes que hacer múltiples solicitudes al servidor para obtener todos los datos que necesitas. Esto puede ser dolorosamente lento porque cada tira al servidor agrega mucha espera y ver, y eso no es genial para las conexiones móviles, por ejemplo. Ahora tal vez quieras sentirte tentado a agregar algunos puntos finales para resolver este problema. Podría agregar una publicación con autores y apuntar a devolver una lista de publicaciones junto con los detalles sobre el autor. Y luego puedes agregar otro para devolver los conteos comunes también. Pero esta no es una solución muy escalable. Esto provocará una explosión de puntos finales que serán difíciles de mantener y difíciles para que las personas nuevas aprendan a usar. Así que ahora echemos un vistazo a cómo gráfico resolverá estos problemas con el injerto. Tú bien, puedes hacer una sola solicitud y pedir todo el recurso es el que quieras. Entonces aquí puedo decir que quiero el último post con el nombre fuera de los autores. El servidor gráfico buscará entonces el poste de bloque para usted. Seguirá las relaciones con el autor, y hará de hecho la información sobre el autor, y le girará todo en una sola solicitud. Ahora me gustaría señalar aquí que el autógrafo de respuesta consulta QL tiene exactamente la misma forma fuera de tu consulta que esto es muy útil porque sabrás de antemano cómo va a responder el A p I y con el resto AP I eso simplemente no es el caso. Entonces aquí podemos ver a la izquierda que consultamos por publicaciones y a la derecha. Recibimos un objeto de gráfico que tendrás, cual contiene una publicación Harry que contiene objetos con todos los atributos que queremos. Entonces eso es el contenido del título y luego en el objeto autor con la propiedad nombre. Por lo que para resumir, con UL gráfico, se puede obtener recurso múltiple es en una sola solicitud. La estructura de su consulta define la estructura del gráfico de respuesta. También comprenderás la relación entre tus objetos y puede buscarlos si es necesario. Y por último, siempre obtienes los datos que necesitas nunca demasiado. Nunca también lo hará. Entonces eso fue todo para esta lección En los próximos videos, voy a explicar los principales conceptos de injerto. Todos ustedes muchas gracias por ver, y los veré en el siguiente video 4. Camiones y Arguments: Hola a todos. Mi nombre ISC savvier. Y estás viendo mi curso sobre gráfico ¿Tú? Bueno, en este video echaremos un vistazo a qué son los campos y también echaremos un vistazo a cómo puedes usar argumentos con campos. Entonces empecemos con campos gráfico Tú bien se trata de pedir datos y puedes ser muy específico en cuanto a qué partes de los datos que quieres recibir. Entonces déjame mostrarte cómo se ve una consulta básica en gráfico que afuera. Entonces voy a empezar diciendo que queremos consultar algo y que voy a decir que quiero una consulta posts y quiero recibir el título de cada publicación de bloque. Entonces esta es una consulta muy sencilla. Y si ejecuto esto, obtendremos una respuesta por parte de la gráfica tú. Bueno, solo dice que los posts nos dan un área de objetos, y cada objeto contiene sólo el título de nuestra publicación porque eso es lo único que hemos pedido. Entonces en este caso, consulta aquí es el nombre de la operación. Si bien los posts y title nuestros campos de ambos campos son muy importantes en gráfico UAL y son unidad de datos que puedes pedir. Y no importa qué tan profundo en la consulta aparezcan estos campos. Siempre hay campos llamados on. Siempre se comportan de la misma manera, aunque los metas ahora, también puedes hacer una sub selección de campos. Digamos que también quiero saber quién escribió estos posts en bloque mientras tengo que hacer es que tengo que decir, mientras quiero los posts con el título. Pero también quiero saber sobre el autor y autor es en realidad un objeto. Entonces aquí puedo definir qué campos de autor quiero. Y así si golpeo el espacio de control gráfico me dice que el autor tiene una idea, nombre y correo electrónico en una propiedad de post, y puedo escoger cualquiera de estos. Entonces voy a decir, mientras quiero el nombre a menudo autor Y entonces si ejecuto esta consulta, obtengo un campo de autor dentro de mis publicaciones, y esto es, por supuesto, un objeto de nuevo, que contiene el nombre fuera del autor. Ahora, por supuesto, puede anidar estos campos aún más si su estructura de datos lo permite ahora. Activo en el video anterior, la capacidad de consultar recurso múltiple es y la relación en una sola solicitud puede graficar. Serás mucho más eficiente que descansar AP I Así que en este caso, fuera de corriente para las últimas publicaciones. He agarrado su título y he pasado por su relación con la entidad autora, y también le he quitado el nombre al autor que está asignado al Post. Un arresto, un p I. Esto habría llevado múltiples solicitudes al servidor. Ahora pasemos a los argumentos. Obtener objetos y campos es bastante fácil en gráfico. Tú bien como acabamos de ver. Pero a veces hay que dar algunos argumentos. Por ejemplo, es posible que desee buscar un post particularmente en bloque basado en su i. D. Así que despejaría nuestro Crary existente. Y voy a decir que quiero un post y lo voy a dar en argumentos. Y voy a decir que la idea del Post que quiero buscar es de tres, por ejemplo, por ejemplo, y voy a abrir los corchetes y decir, Dame el título fuera de post con i d tres. Es nosotros Si ejecuto esto, obtengo exactamente el título off block posts con I d. tres Ahora, en un sistema de descanso tradicional, puedes Onley pasar un solo conjunto de argumentos al servidor. En la UL gráfica, sin embargo, cada campo y objeto anidado puede tener su propio conjunto de argumentos. Entonces digamos que quieres sacar los comentarios de este bloque de publicaciones. Entonces simplemente le agrego comentarios. Y puedo decir por cada común y quiero el nombre y esto va a funcionar. Ahí vamos. Entonces hubo un comentario escrito por Peter. Pero ahora también puedo pasar un argumento a los comentarios. Y puedo decir, por ejemplo, mientras me dan los comentarios fuera del año 2017 por ejemplo. Y así si ejecuto este gráfico, harás que funcione bien. Se va a buscar post con yo d tres. Se buscará los comentarios de esta publicación que podrían estar en otra tabla de base de datos, por ejemplo. Los filtrará el año, utilizando nuestro segundo argumento en un vuelco todos los datos que solicité. Entonces eso fue todo para este video. Esos fueron campos y argumentos. En el siguiente video, vamos a echar un vistazo a los usos y fragmentos de Alia 5. Aliases y Fragments: Hola a todos. Mi nombre es severo y este es mi curso de gráfica. Tú fuera en este video, vamos a echar un vistazo a unos arrendamientos y fragmentos. Empecemos con los alias. Podría haber notado un problema con la forma en que se ejecutan las consultas en gráfico You Bueno, la salida de una consulta QL de gráfico tiene el mismo nombre que la propia consulta. Entonces en este caso, he tomado el ejemplo del video anterior y pedí Post I D tres y le pregunté su título y su contenido. Ahora nota que escribo aquí Post y que me devuelven mensajes en la respuesta. Pero ¿y si quiero obtener los detalles de dos posts específicos? No puedo escribir algo como esto, presumir i d dos y luego agarrar título y contenido de ese post. Porque si hago ese gráfico, dirás que los postes de feuds están en conflicto porque de nuevo, son del mismo nombre. Entonces por eso los alias existen en gráfico. Tú bien, te permiten cambiar el nombre del resultado de un campo a cualquier otra cosa que quieras. Por lo que podría consultar ambos mensajes diciendo que el 1er 1 se plantea primero esperanzas y que el 2do 1 es segundo post. Y si lo ejecuto ahora, gráfico Carol renombrará el resultado de este post y lo nombrará primer post, como se puede ver aquí en el objeto de respuesta. Ahora, los alias son ideales para consultar el mismo tipo de objetos más de una vez. Pero tus consultas también se vuelven muy repetitivas, como puedes ver aquí en este ejemplo. Ahora hagamos un poco más completo este ejemplo. Digamos que queremos fash el título el contenido de cada post junto con el nombre fuera del autor. Entonces aquí tengo que decir, mientras quiero al autor y quiero el nombre del autor y luego una copia pegada también a nuestro segundo post. Ahí vamos ahora. Esto es bastante repetitivo. Todo el código entre corchetes es exactamente el mismo para ambos posts, y eso nos lleva a fragmentos. Al usar fragmentos, podemos quitar los campos duplicados y ponerlos dentro de un bloque reutilizable de abrigo para que podamos empezar definiendo nuestro fragmento, y empezamos por darte los nombres guardará fragmento, detalles básicos de la publicación . Y entonces tenemos que decir con qué es compatible este fragmento. Por lo que este fragmento es compatible con el tipo de post. Entonces voy a decir que funciona en el tipo de post, y luego voy a copiar los campos seleccionados en nuestros fragmentos. Ahora, después, podemos usar este fragmento dentro de nuestras consultas para que podamos reescribir estas dos consultas eliminando todos nuestros campos y simplemente diciendo los detalles básicos de la publicación dot a dot. Y yo copiaría esa paz que ahí dentro también, y eso es todo. Si ejecuto esto ahora, obtengo exactamente el mismo resultado. Pero no he copiado y pegado esta pieza de código sin fin. Podría simplemente reutilizarla haciendo referencia a su nombre. Ahora podrías notar que la sintaxis se parece un poco al nuevo operador de spread en JavaScript . Y como puedes ver, reduce en gran medida el tamaño fuera de las reverencias de York. Entonces eso fue todo para este video. En el siguiente video, vamos a echar un vistazo a cómo puedes usar variables dentro de tu gráfico. Consultarás 6. Variables: Hola a todos. Mi nombre ISC savvier. Y estás viendo mi curso sobre gráfico ¿Tú? Bueno, en este video, vamos a echar un vistazo a cómo puedes usar variables en gráfico You Bueno, hasta ahora hemos estado escribiendo argumentos directamente dentro de nuestras consultas, y aquí te presentamos un ejemplo de uno de los videos anteriores que nos volvemos a buscar a detalles fuera de puesto con i d tres. Y como pueden ver, pasé el argumento tres directamente en mi consulta. Ahora, en la mayoría de las aplicaciones, sin embargo, los argumentos son dinámicos y suelen depender de la entrada del usuario. Por ejemplo, los autores podrían tener un formulario para crear una nueva publicación en bloque, por lo que no es buena idea tomar los datos del formulario para serializarlo. Y para insertarlo en esta consulta. No sólo podría ser un problema de seguridad, también crea una consulta completamente nueva que podría haberse vuelto inválida. En cambio, podemos usar variables consultas internas y luego pasar por la entrada del usuario por separado. Y así es como va. Entonces empezará diciendo que nuestra consulta excepto una variable. Entonces voy a decir que nuestra consulta acepta una variable llamada Post I D. Y voy a decir que es un tipo entero, y voy a decir que este post I d es requerido agregando un signo de exclamación. Por lo que esto significa que la variable es obligatoria y ul gráfico no continuará ejecutando esta consulta si no está presente ahora, después de declarar la variable, podemos usarla dentro de nuestra consulta. Por lo que venganza detalles de post con i d tres. Pero en lugar de tres, ahora puedo usar nuestra variable post i d Así. Ahora fuera de curso, también necesitamos pasar el valor de esta variable al servidor. Y para ello, creamos un objeto Jason y lo enviamos junto con esta solicitud al servidor. Y en gráfico, no hay una sección aquí llamada variables de consulta, y todo lo que hago aquí es escribir un corsé rizado y auto gráfico, me completa y dice, Bueno, necesito una variable post d y luego me puede dar esas variables a aquí. Puedo decir que el valor de post I d es igual a tres, y entonces eso es todo. Si vuelvo a ejecutar esta consulta, verás que tiene exactamente la misma respuesta que mi consulta anterior. Pero ahora mismo estoy usando variables de consulta. Ahora estas variables se envían junto con nuestras peticiones como, por ejemplo, un post brown. Ahora, mediante el uso de variables, podemos mantener la consulta igual para todas las solicitudes. De nuevo, esta consulta aquí nunca cambiará. Simplemente enviaría la entrada del usuario junto con la solicitud, y esto se considera una mejor práctica. No se recomienda usar la interpolación de cadenas para construir una nueva consulta, porque de nuevo, esto podría ser un problema de seguridad potencial. Entonces eso no fue por este video. En el siguiente video, echaremos un vistazo a qué son las mutaciones y cuáles son las diferencias entre indagaciones y mutaciones. 7. Mutaciones: Hola a todos. Mi nombre ISC savvier. Y en este video, vamos a echar un vistazo a las diferencias entre consultas y mutaciones. En gráfico, Ustedes todos Existen dos tipos de consultas de operaciones y mutaciones. Ya has visto muchos ejemplos de consultas en los videos anteriores, y te permiten buscar datos del servidor. Y esto es típicamente las consultas de solo lectura no deben cambiar ningún dato en su servidor, pesar de que técnicamente no podría hacer que lo hagan. Para cambiar datos en su servidor, lugar debe usar mutaciones. Sólo un escurridizo. Las mutaciones pueden devolver objetos, y puede definir qué campos desea recibir como respuesta. Por lo que en caso de un bloque, el A P podría tener una mutación para agregar nuevos puestos de bloque. Esta mutación debe aceptar un objeto Jason con el contenido del nuevo post. Entonces echemos un vistazo a cómo se puede hacer eso en gráfico. Tú Bueno, empezaremos diciendo que queremos ejecutar una mutación, así que voy a escribir mutación, abrir corchetes rizados y justicia con consultas. Ahora puedo darle el nombre de una mutación. Por lo que ya he creado una mutación en Post y esto, excepto una variable post, que es objeto adyacente que contiene los detalles de mis nuevas publicaciones. Por lo que este podría ser título. Mi nuevo bloque publica mi bloque. Post también tiene algunos contenidos y debería ser contenido fuera de mis publicaciones de bloque. También tiene un autor, y esto es una referencia a la idea del altar. Y así en este caso, son sólo algunos datos aleatorios que he generado en una base de datos. Entonces este es el dato que pasamos a esta mutación. Y entonces también podemos decir qué datos queremos recibir de nuevo de gráfico Usted bien, y podemos recibir bolsa el título fuera de nuestro bloque presume. Y hasta puedo pedir al autor. Y puedo pedir el nombre del autor que se asocia a este I. D. Aquí mismo. Ahora, en el video anterior, les dije que poner estos datos directamente en la consulta no es una gran idea. En cambio, deberíamos usar variables, y eso también es posible con mutaciones. Entonces solo eso es lo que las consultas comenzarán diciendo que nuestra mutación toma una variable post como entrada. Entonces yo no voy a hacer aquí mismo. Voy a decir que vamos a recibir un post variable, y esto debería ser off type post input. Ahora, presumir input es un tipo que tengo un definido en el servidor gráfico Ural. Y más adelante en el curso, te mostraré cómo puedes hacerlo tú mismo. Ahora se requiere esta variable. Entonces le voy a añadir un signo de exclamación. Ahora, después, puedo empezar a usar esta variable insight o post field. Entonces en lugar de darle los objetos de inmediato aquí, voy a cortar ese texto, y sólo voy a hacer referencia a la variable post. Y ahora puedo pasar a lo largo de nuestro post como variable demasiado gráfica. ¿ Tú? Bueno, y aquí puedo pasar por el objeto para nuestra cuadra. Ambos. Entonces este fue el objeto que creé, um, con contenido de título y autor. Pero deberíamos envolver esto dentro de otro objeto igual de gráfico aquí, proponerme. Y el objeto contiene un campo de poste. Este campo de publicación contiene ese objeto. Entonces debería cerrarlo. ¿ Todo bien? Y debo añadir unas cotizaciones aquí y allá vamos. Así es como se ve una mutación. Si sé ejecutado, esto insertará un nuevo post de bloque en mi base de datos. Y como pueden ver, recibimos como respuesta el título y el nombre del autor, tal y como lo hemos solicitado aquí mismo. Por lo que las mutaciones se parecen exactamente a Clarice, y también tienen una respuesta predecible. Entonces, ¿cuál es ahora la diferencia real entre consultas y mutaciones? Bueno, primer lugar, se puede ver al instante si una operación UL gráfica cambiará algo en el servidor o no . Ahora bien, esto es por nuestra propia conveniencia. Las consultas solo leerán datos del servidor mientras que las mutaciones cambiarán o le agregarán nuevos datos . La otra gran diferencia es que las consultas se están ejecutando en paralelo mientras que las mutaciones se ejecutan en Siris una tras otra. Esto es para evitar condiciones de carrera ya que una mutación podría insertar datos que requiere la siguiente mutación. Entonces eso fue todo para este video y también para esta sección. En el siguiente apartado, nos prepararemos para escribir su propio gráfico tu l a p I. Te mostraré cómo se establece de la estructura del proyecto qué dependencias vamos a usar y mucho más 8. Configuración de la configuración: estructura de proyectos: Hola a todos. Mi nombre ISC Soviet. Y en este video, vamos a configurar la estructura de directorios para nuestro gráfico te l a p I. Así que aquí he abierto un directorio vacío en código de estudio visual, y vamos a empezar por crear unos cuantos directorios que conformarán nuestro proyecto. Voy a empezar por crear un directorio para todo nuestro código fuente. Voy a llamar. Ese es nuestro C. Ahora, dentro de este directorio, voy a hacer otra carpeta para nuestro gráfico vas a esquema. De qué se trata esto es algo que discutiremos en videos posteriores. Ahora, esquema, ojos conformados por consultas, tipos y mutaciones. Por lo que crearé un subdirectorio para cada uno de estos. Entonces uno para consultas, uno para tipos y otro para mutaciones. Ahora vamos a crear también algunos archivos de marcador de posición para nuestro esquema. Empecemos con consultas y mutaciones. Voy a crear un archivo por consulta y permutación. Al hacer eso, nos aseguramos de que cada archivo corresponde a una sola consulta o una mutación y además mantiene cortos nuestros archivos y nuestro código manejable. Entonces, para mutaciones, quiero que los clientes puedan crear nuevas publicaciones en bloque y publicar comentarios a través de nuestro a p I. Entonces voy a crear dos mutaciones. El 1er 1 voy a llamar add comments dot Js y voy a crear un 2do 1 el cual se va a agregar Post que Sí. Ahora voy a dejar estos archivos vacíos por ahora. Trabajará en ellos más adelante en este curso para consultas. Quiero que los usuarios puedan obtener todas las publicaciones en el bloque para obtener detalles sobre una publicación específica y obtener los detalles sobre un autor. Por lo que crearé tres archivos dentro de consultas. Voy a crear un archivo posts pensé jazz, que devolverá todos los posts en nuestro blawg. Voy a crear post que Js, que va a devolver los detalles sobre una sola publicación. Y luego voy a crear un archivo autor digests, que va a devolver alguna información sobre autor y de nuevo, implementaremos estos archivos más adelante y también sabremos que puedes nombrar estos archivos Sin embargo te gustaría. Sólo estoy escogiendo algo que tiene sentido aquí. Siguiente arriba son los tipos. Ahora bien, si estás familiarizado con objeto o en la programación de lo que puedes comparar tipos en gráfico UAL a interfaz es un lenguajes de programación orientados a objetos. Definen qué campos tiene un tipo, por ejemplo, un tipo para presumir de bloque podría tener un título, un contenido y en campo de autor. Ahora, en caso de r E B I, tenemos tres tipos grandes. Contamos con puestos de bloque. Tenemos autores y tenemos comentarios. Los he detallado en la primera sección de este curso. Entonces vamos a crear un archivo para todos y cada uno de esos que voy a crear autor pensó que sí , crear comentarios que Jess y yo vamos a crear. Publica eso, Jess. Muy bien, entonces ahora que tenemos los bloques de construcción individuales para esquema, voy a crear en el siguiente archivo RGs dentro del directorio de esquemas. Y en este archivo, vamos a importar todos los demás archivos y hacer el esquema completo. También voy a crear un archivo indexado en la raíz de nuestro directorio fuente, y este otoño se encargará de cargar el gráfico te una biblioteca para cargar nuestro esquema y para ejecutar consultas ahora para rematar. También vamos a necesitar una carpeta dist que voy a poner en las raíces de nuestro proyecto. Ahora, esta carpeta contendrá versiones optimizadas fuera de nuestro código fuente y será generada por balbucear en Esto asegurará que nuestra cotización se ejecute en cualquier versión off. No Js. Entonces con ese tonto crearía es hora de terminar este video. Hemos configurado la estructura para nuestro proyecto. En el siguiente video, vamos a instalar las dependencias externas que necesitarán para dar vida a nuestra A P I . 9. Instalación de dependencias: Hola a todos. En este video, vamos a instalar las dependencias que vamos a utilizar para construir nuestro gráfico tú l a p I ahorita a Bill r a p I. No vamos a reinventar la rueda. En cambio, vamos a confiar en bibliotecas de terceros que ya han sido construidas y que han sido probadas en batalla administrando dependencias. Y no, Jess, es bastante fácil porque tenemos NPM ahora, En caso de que no lo sepas, NPM significa gestor de paquetes de notas. Y esta herramienta nos permite listar todas las dependencias de nuestro proyecto en un solo archivo ahora, después y PM puede tomar ese archivo, leerlo e instalar todas las dependencias en nuestros proyectos. Entonces el inicio, vamos a crear un archivo Jason empaquetado. Este es el archivo que dirá en PM todo lo que hay que saber de nuestro proyecto ahora. Podrías crear uno manualmente, pero también podemos pedirle a NPM que genere uno para nosotros en el directorio raíz fuera de nuestro proyecto. Y yo voy a hacer eso. Voy a abrir la terminal, y voy a ejecutar NPM en ella. Y esta utilidad nos guiará a través de algunas de las cosas que deberían estar en nuestro paquete. Ese Jason y nosotros sólo podríamos teclearlo en nuestra terminal. Entonces nos preguntó ¿cuál es el nombre de su paquete? Bueno, voy a decir gráfica UAL ap. Yo bloquearía diría, ese es el nombre de nuestro paquete. Lo vamos a mantener en ese número de versión. Podemos darle una descripción, que no voy a hacer en este momento. Se le puede dar un punto de entrada. Voy a dejar eso por defecto también. Deja el escritorio a un hombre vacío. Obtener palabras clave del repositorio. Autor. Vamos a dejar eso todo vacío. Y luego se preguntó Este es este archivo ¿bien? Voy a decir que sí. Eso está bien. Y ahora el taburete ha creado un paquete que Jason archivo Inside Art directorio. Entonces ahora que tenemos este archivo, podemos empezar a instalar no son dependencias. Ahora, no vamos a escribir nuestra propia biblioteca gráfica Ural. Eso no tendrá sentido. En cambio, vamos a utilizar la implementación oficial ul del injerto por parte de Facebook para que lo instale. Simplemente voy a ejecutar npm, instalar dash, dash safe y luego graficarte. Bueno, entonces aquí le pido a NPM que instale un paquete. El nombre del paquete es gráfico te bien, Y al decir que debería guardar esta dependencia, en realidad agregará la dependencia a nuestro paquete ese archivo Jason. Entonces si ejecuto este NPM se va a salir, te va a Fatchett grafica. Bueno, descargará todas las dependencias que tiene el gráfico UAL, y guardará gráfico UAL como dependencia. En el interior se empaquetan Jason Fall. Entonces, como se puede ver aquí, ha agregado una nueva propiedad a este objeto, que se llama dependencias. Y aquí dice que la UL Gráfica está ahora con la pendencia de nuestro proyecto y que requerimos al menos la versión $0.11.3. También puedes ver que NPM ha creado un nuevo directorio dentro de nuestro proyecto y esto se llama módulos de nodo. Ahora, este directorio es el dedo del pie de casa. Todas las dependencias externas fuera de nuestro proyecto. Nunca debemos comprometer módulos de notas a un sistema de control de versiones y nunca debemos cambiar archivos dentro de este directorio. Ahora bien, si miras dentro de directorio, vemos que ahí hay una carpeta de corral grafico así como una carpeta para todas las dependencias que elaboran tus propias necesidades. Entonces en este caso, injerto bien lo necesita, rodar y luego está justo aquí. Por lo que no hace falta decir, este directorio puede hacerse bastante grande una vez que haya agregado algunas dependencias. Pero eso está bien. Y lo vamos a cerrar por ahora. Y ahora vamos a instalar la siguiente dependencia que vamos a necesitar. Y ese es Babel. Ahora, durante este curso, voy a utilizar algunas de las nuevas características en JavaScript, como clases, funciones de flecha y operadores de spread. Estas características, sin embargo, podrían no estar disponibles en tiempos de ejecución de scripts Java más antiguos. Por lo que balbucear es una pequeña herramienta que se llevará nuestro código. Pero toda la nueva sintaxis y sucederá. Voy a hacerlo en código que cada no runtime de jazz puede entender. Esto es muy útil para cuando se desea implementar su código a, por ejemplo, por ejemplo, un servicio en la nube que utiliza un tiempo de ejecución más antiguo. Voy a usar el mismo comando que la última vez. Un pequeño cambio. Entonces voy a decir npm instalar dash safe. Pero voy a decir salvar la muerte Y esto le dirá a NPM que balbucear es independencia que sólo se necesita durante el desarrollo. No necesitamos balbucear en nuestros entornos de producción por lo que NPM seguro dash sordo y mudo decir que debe instalar la herramienta battle cli. Debe instalar el preset predeterminado para balbucble. Esta es la configuración predeterminada de Bama. Y vamos a necesitar un tapón de balbucear que transforme a nuestro operador de spread en algo que el viejo soporte de tiempo de ejecución de script de trabajo Kenner. Entonces voy a ejecutar eso y verás que toma un poco más porque Babel tiene muchas más dependencias que gráficas. Tú. Bueno, entonces ahora que está terminado, podemos ver que ha agregado otra sección a nuestro paquete que Jason presentó estos o volvió a hacer dependencias de desarrollo. Estas son las dependencias que solo necesitarías durante el desarrollo, no en producción. Y si abro el directorio de módulos de notas y golpeo refresco, puede ver que hay muchas nuevas dependencias instaladas en nuestro proyecto. Y ese es el poder de usar un gestor de paquetes. No tenemos que manejar todo esto nosotros mismos con lo suficiente para salir y descargar todos y cada uno de estos proyectos. No, NPM hará esto por nosotros automáticamente. Voy a cerrar esta carpeta. Dije que podría ponerse bastante grande. Eso no es problema en absoluto. Y eso fue todo por este video. Hemos instalado todas las dependencias que vamos a utilizar para construir nuestro propio gráfico. Serás yo ahora en el siguiente video, te mostraré cómo es una buena figura balbucea. 10. Configurar Babel: Hola a todos. Y bienvenido de nuevo a mi curso sobre grafico usted? Bueno, en el video anterior, instalamos unas dependencias necesarias en nuestro proyecto. Y una de esas dependencias es Babel. Ahora vamos a usar babble para asegurarnos de que podamos usar de forma segura todas las nuevas características en el lenguaje de script Java sin tener que preocuparnos por la compatibilidad. Entonces, primero echemos un vistazo a por qué necesitamos balbucear escribiendo algo de abrigo. Voy a abrir el archivo index dot Js aquí en la raíz fuera de mi directorio fuente. Y digamos que quiero importar la biblioteca gráfica del mal y luego hacer algo con ella . Bueno, no escriben importación. Yo quiero importarte bien gráfico, y quiero importarlo del gráfico tu paquete. Después de eso, solo voy a ejecutar un registro de cónsul diciendo hola para demostrar que el código se ha ejecutado con éxito . Ahora déjame intentar ejecutar el guión. Voy a abrir la terminal y cuando digas nodos SRC en el próximo que Sí, voy a golpear enter. Y como puedes ver, no vuelve GS y nunca Y dice que encontró una importación de tokens inesperada para que nadie que tenga no entiende este nuevo Syntex aquí para importar módulos. Ahora, podríamos arreglarlo usando la antigua sintaxis, pero eso no es muy eficiente. En muchos casos, el índice de soga es mucho más corto y tiene algunas características adicionales agradables. Entonces eso es exactamente lo que Babel está aquí para resolver. Ahora, Babble se basa en un archivo de conflicto para decirle cómo debe trasplantar. Tu pelaje balbuceo puede cargar esta configuración desde el paquete que archivo Jason o desde el archivo Babel o C. Voy a usar la segunda opción, y voy a crear un nuevo archivo en mi directorio raíz. Y voy a llamar a este punto balbucear RC. En este archivo, vamos a crear un objeto Jason, y vamos a decir qué presets están disponibles. Por lo que en el video anterior, hemos instalado el preset final, que es el preajuste predeterminado que utiliza balbucble. Entonces voy a poner eso justo ahí Y entonces también podemos decir qué enchufes están disponibles y notamos que el código de estudio visual ayuda está aquí fuera. Sabe que este archivo es un archivo de configuración de Babel y los regalos son todas estas pistas de noches. Entonces voy a decir que vamos a usar algunos enchufes y vamos a usar los objetos transformados. Descansa extendido, Blufgan. Por lo que se difunden. Operador se trascenderá correctamente. De acuerdo, entonces ahora balble sabe qué presets están disponibles y qué enchufes están instalados. Y no echemos un vistazo si transpira correctamente. ALS son abrigo. Entonces voy a abrir el paquete que archivo Jason y en este archivo, voy a crear un nuevo guión. Ahora bien, si nunca has creado el script y MPM antes, todo lo que tienes que hacer es darle un nombre y luego un comando que debería ejecutar. Por lo que aquí ya tiene un script de prueba. Sólo voy a añadir uno. Voy a llamar a mi guión Construido ahora. Esto debería ejecutar balbuceos mujer atacada balbucear, y esto acepta un montón de parámetros. Ahora, el 1er 1 le dice a Babel dónde está nuestro código fuente. Entonces en nuestro caso, es solo el directorio fuente THSRC directorio. Ahora, después de eso, también necesitamos especificar dónde balbucear debe almacenar las versiones trascendidas de nuestro abrigo. En los videos anteriores, hemos creado esa carpeta sólo para este propósito. Entonces voy a decir que el directorio de salida, El afuera está esta carpeta. Muy bien, entonces ahora voy a guardar este archivo, y vamos a ejecutar este script y abriría una terminal sobre el tipo NPM run construido. Voy a pegarle entrar. Y como pueden ver, balbucear encontró todos nuestros archivos fuente justo aquí. Y ha generado nuevos archivos para ellos en este fuller. Entonces vamos a abrir nuestro original en el siguiente archivo dot Js. Puedes ver aquí en Port Graphic UL desde el paquete gráfico UL. Pero si ahora voy a la carpeta dest y abrí el archivo de índice ahí, entonces se puede ver que nuestra declaración de importación se ha ido y bam, Una lista ahora está usando la sintaxis tradicional requieren, algo que es compatible con versiones anteriores de nota. Y vamos a escritorio eso ahora mismo. Entonces ahora voy a correr conocido de nuevo, y en lugar de correr el próximo otoño en nuestro directorio fuente, voy a ejecutar el siguiente archivo en nuestro directorio DIS. Y ahí tienes. Nuestro guión funciona. no hay más errores. Y simplemente príncipe en lo alto de nuestro cónsul. Ahora bien, si te pareces un poco a mí, pensarás que ejecutar estos comandos una y otra vez, lleva mucho tiempo y tendrás razón. Entonces cambiemos nuestro script de compilación para que se ejecute balbucear y luego automáticamente se ejecute nuestro código se indexan en tu culo para así que voy a volver. Pero voy a volver a nuestro archivo empaquetado de Jason. Y aquí tenemos balbuceo, lo que genera las versiones de trasplante. Y después de eso, voy a decir que debería ejecutar nodo esto en el siguiente archivo Js de punto. Está bien, así que vamos a ejecutarlo una vez más. Voy a decir npm run built. Y ahora el guión transpira als todo con Babel y luego lo ejecuta automáticamente también . Todo en una sola vez. Entonces eso fue todo para este video. Ya casi terminamos con los preparativos. En el siguiente video, te mostraremos la base de datos ficticio que vamos a utilizar como base para nuestro gráfico te l a P I 11. Base de dummy: Hola a todos. Mi nombre es X Avi, y en este video, vamos a echar un vistazo a la base de datos muy sencilla que va a poder son gráficos te l A p i Ahora no quería aburrirte con un video de mí mostrando cómo creé todos estos datos ficticio . Entonces he preparado una pequeña base de datos y la he puesto en nuestro directorio fuente y se llama Fake database. Entonces echemos un vistazo por dentro. Como puedes ver, es solo una clase simple que contiene un montón de propiedades. Así que tienen propiedades que almacenan autores que almacenan publicaciones de bloque y que almacenan todos los comentarios. Ahora todos los datos se almacenan en un área sencilla. Se trata de un área de objetos que puedes comparar. Se trata de dos tablas en base de datos irregular, una tabla para autores, una tabla para publicaciones de bloque en una tabla para comentarios. También he hecho algunos métodos para acceder a estos datos, y aquí hay uno sencillo. Si me desplazo hacia abajo, puedes ver que hay get block posts y éste es muy sencillo. Simplemente devuelve todas las publicaciones de bloque en la base de datos. Ahora, en mi ejemplo, devuelve el nuestro A off block posts. Que es Capitán Memoria, claro. Pero en realidad, lugar de simplemente devolverlo aquí, saldrías a la base de datos, harías una conexión, consultarías la base de datos y luego regresarías los datos de la base de datos para que no diría simplemente volver y luego una zona. Se puede pensar en estos métodos como una capa de acceso a la base de datos en Lee. Una parte de tu aplicación debería poder hablar con tu base de datos. El resto debe utilizar métodos que expuso la capa de acceso a la base de datos. Entonces si quieres escribir tu propio gráfico L a p I para un bloque, por ejemplo, que puedes guardar todos estos métodos, pero solo tienes que volver a implementar sus cuerpos. Por lo que aquí volverías a tener que hacer una conexión a la base de datos. Y así ahora también tengo algunos métodos que filtran algunos de nuestros datos. Entonces, por ejemplo, obtener publicaciones en bloque. Este obtiene los detalles de un post de bloque con un I D específico y tienen lo mismo para buscar a un autor particularmente o buscar la publicación de un autor o buscar todos los comentarios que tienen post. Tengo un montón de estos métodos ahora. También implementé un método que se encarga de agregar nuevos datos a nuestro bloque. Y así aquí está Avenue Block Post, que toma un postes de parámetros, que es de nuevo un objeto con todas las propiedades del Post, y acabamos de sumar al área justo aquí. Todo es muy, muy, muy simple, pero pasa el punto a través. Entonces de nuevo, en realidad, volverías a implementar estos métodos y probablemente querrías conectarte a una base de datos como mi secuela entre Will You Be, o tal vez una versión en la nube como Dynamodb. Ahora, ¿qué pasa con las relaciones? Si bien cada uno de estos objetos es completamente autónomo, no hay referencias de un objeto a otro. Pero si miras más de cerca y bloqueas post, por ejemplo, puedes ver que cada publicación de bloque tiene una propiedad llamada author, y en ella almacenamos la idea del autor que escribió esto particularmente los posts de bloque. Entonces si queremos sacar el nombre del autor de un post de bloque que deberíamos tomar el poste de bloque, deberíamos tomar la propiedad de autor y luego deberíamos consultar la base de datos para autor con esto d y luego podemos buscar su nombre. Ahora bien, podrías pensar que crear código que navega todas estas relaciones llevará mucho tiempo , y tendrías razón. Pero por suerte, no necesitamos hacer eso, porque grafico todos ustedes es muy inteligente. Solo tienes que enseñarle a buscar cada recurso de forma individual. Y luego puedes decirle cómo se forman las relaciones. Por lo que no tienes que usar operaciones conjuntas complejas como en SQL. Está bien, así que eso fue todo para esta sección se hicieron con todos los preparativos en la siguiente sección, vamos a empezar a construir nuestro propio gráfico Tú l A p i encima de esta pequeña base de datos, te mostraré como crear un esquema. Por lo que ese gráfico podrás darle sentido a todos nuestros datos. 12. Tipos de objetos: Hey, todo el mundo minando MISC Soviet. Y en este video implementaremos los tipos de objetos gráficos para comentarios de autor y publicaciones de bloque. Ahora un tipo de objeto y UL gráfico. Es como una programación orientada a clases y objetos. Básicamente le dice ingenioso, Bueno, qué tipo de objetos que tu A p puedo devolver y qué feudos tienen. Por lo que aquí tenemos un ejemplo Consulta ul Gráfica. Todos estos campos están definidos por tiempos de objeto. Entonces, en otras palabras, si un tipo de objeto para publicación no contiene un título, entonces no puedes pedir un título en tu consulta. Bastante sencillo. No obstante, los campos superiores son diferentes. Ellos son los puntos de entrada a tus consultas, y esos se definen de manera diferente. Eso ya veremos más adelante en este curso. Por lo que en este video nos enfocaremos en implementar los tiempos de objeto. De acuerdo, entonces aquí estoy en código de estudio visual, y empecemos por implementar un tipo de objeto para autor. Ahora, en los videos anteriores, hemos creado nuestra estructura de directorios y el tipo de objeto para autor está bajo el directorio de tipos bajo esquema. Entonces me voy a abrir fuera de los Js y voy a empezar por crear o exportar una nueva constante llamada autor. Y esto va a ser de nuevo graf que el tipo de objeto ahora en su regla constructor, pase sobre objeto. Y este objeto contendrá todos los detalles sobre nuestra entidad autora. Ahora, antes de continuar, necesitamos importar el módulo necesario. Entonces en este caso, estaban usando el tipo de objeto ul gráfico, pero el script Java no sabe qué es eso. No es la multa en nuestro archivo, por lo que necesitamos importarlo del injerto en todo el paquete primero. Entonces voy a escribir importación gráfica que el tipo de objeto del gráfico su paquete. Muy bien, así que a continuación, podemos llenar este objeto aquí mismo. Todo tipo de objeto debe tener un nombre y una descripción y algunos campos. Voy a crearlos. Ahora. Voy a llamar a este tipo de objeto autor. Voy a darle una descripción. Voy a decir todos los detalles fuera de autor en la página web, y voy a darle algunos campos, que va a ser una función estrecha. Ahora, podría preguntarse por qué Injerto ul necesita saber todo esto en. Eso es porque cuando estás usando gráfica, usará el nombre y la descripción para guiar a la gente alrededor de tu A P. Yo coso estas piezas de cuerdas. Aquí. Estos textos aparecerán dos personas usando tu A P I a través de gráfica. Es muy fácil para ellos familiarizarse con tus ocho p. I. Así que poblemos los campos. Ahora echemos un vistazo a la gran base de datos para ver qué tiene ahí el autor de Fields. Por lo que aquí podemos ver que un autor tiene una idea en nombre y una dirección de correo electrónico. Ahora también conoce los tipos de thes campos así que las ideas. Un nombre de cadena es una cadena, y también el correo electrónico es una fortaleza ahora. ¿ Por qué es importante esto? Bueno, eso es porque gráfico vas a un tipado estáticamente. Y eso significa que tenemos que especificar de qué tipo cada intrépido. Entonces volvamos a alterar y vamos a los campos En este momento voy a empezar con I D. Y voy a decir que i d es de tipo gráfico Tú bien, fuerza otra vez. Estos airean objetos especiales. Estos son tiempos especiales que el gráfico suele utilizar para validar la consulta que viene de los usuarios, pero también para saber de antemano qué tipo de datos le devolverá al usuario. Entonces vamos a agregar el nombre pocos también, que también es una cadena UL gráfica y los campos de correo electrónico, que también es clave de gráfico de tipo. Bueno, fuerza ahora, igual que antes. Importar Graphic ul String antes de que lo olvidemos. Entonces solo voy a agregar importación aquí, y voy a decir que también vamos a querer importar cadena UL Graphic del pequeño paquete ingenioso . Muy bien, entonces eso es todo lo que tenemos que hacer para implementar nuestro objeto de autor. Sigamos con hacer un tipo para comentarios. Ahora, voy a empezar por copiar un disco adeudado porque mucho de él es sólo un código repetitivo y lo podemos reutilizar para comentar. Tipo de objeto. Entonces voy a abrir eso común. Sí. Voy a pegar todo el abrigo aquí mismo. Y obviamente voy a cambiar algunas cosas, así que voy a exportar variable común. Voy a cambiar el nombre. Voy a cambiar la descripción. Voy a decir detalles fuera de los comentarios. Y ahora, obviamente, también necesitamos cambiar algunos de estos campos. Entonces echemos un vistazo a la base de datos de fig. Qué campos que tiene un común y aquí puede ver. Common tiene una idea publicada el nombre y un contenido campos Ahora vamos a ignorar el Post I D . Por ahora, porque ese campo crea una relación con el objeto Post. Pero aún no hemos creado eso, así que vamos a implementar esto más adelante. Entonces volvamos al tipo común aquí. Voy a quitar estos campos porque tenemos que volver a implementarlos. Voy a decir que ese comentario tiene un i D. Y esta vez no es de tipo string. En realidad es tipo gráfico que vas a entrar en particular. Mira atrás aquí ahora es un imager. Ya no es una cuerda, así que tenemos que reflejar eso en nuestro futuro también aquí. Un comentario también tiene el nombre de la persona que lo escribió, que obviamente es de cadena tipográfica. Y tiene el contenido fuera de los propios barcos, que también está fuera de fuerza tipográfica UAL. Ahora, antes de que nos olvidemos, vamos a las importaciones necesarias estaban usando gráfico que vas a entrar aquí, pero no lo estamos importando. Entonces arreglemos eso ahora mismo. Ahí vamos. Esa es la implementación para comentario. Tipo de objeto. Ahora pasemos a la última vez que necesitamos, y ese es el tipo de objeto para el bloque presume. Ahora ésta es un poco más complicada porque tiene dos relaciones. Ah, Block Brost tiene un autor y podría tener algunos comentarios. Y definitivamente queremos acceder a ambas relaciones a través de nuestro oficio. Tu A p I. Así que de nuevo, voy a empezar por copiar el código de nuestro tipo común aquí, y lo voy a pegar en nuestro post archivo Js. Empezaré de nuevo cambiando algunas de estas cosas aquí mismo. Entonces vamos a exportar mensajes valiosos. Vamos a darle los posts de nombre y la descripción va a ser todos los detalles de un poste de bloque. Entonces echemos un vistazo y una base de datos de higo otra vez para ver qué disputas un bloque post sombreros. Y aquí podemos ver el bloque Post tiene un I D. Que es un inter jurado. En este caso, también tiene un contenido de título y un autor. Ahora, nuevo, este campo de autor es una referencia a un autor. Es que crea una relación. Entonces vamos a necesitar definir ese Aziz Bueno, así que vamos a sumar nuestros campos. Volvamos a los posts s para que podamos mantener i d Vamos a cambiar nombre a título y vamos a dejar contenido también, y los tipos ya son correctos. Está bien, así que eso es lo básico hecho, pero último Ahora implementa la relación que tiene un Post con un autor. Entonces vamos a agregar un autor de campo aquí, y este campo va a ser un poco especial. Entonces vamos a decir que el tipo de este campo es de tipo autor, pero eso no es suficiente. También necesitamos decirle gráfico. Bueno, cómo puede obtener los detalles sobre este autor y eso requiere otra llamada a nuestra base de datos . Por lo que necesitamos agregar una función de resolución, y esta función de resultado. Voy a usar en una función de flecha aquí también, y recibirá una copia de nuestro post objeto, y luego podremos hacer cualquier cosa que queramos con ese post objeto. Pero debemos devolver la información sobre el autor que está vinculado a este post de bloque. Entonces en base de datos fig, tengo un método para esto. Se llama get Author, y sólo lo vamos a devolver aquí. Vamos a decir devolver big database dot Obtener autor, y vamos a darle la idea del autor. Y eso es, por supuesto, Sort. Post Insider en los campos de autor. Entonces lo que esencialmente estamos haciendo es esta variable aquí mismo. Este post obtendrá una copia completa de uno de estos objetos. ¿ Y qué necesitamos para conseguir al autor? ¿ Qué? Tomamos el campo de autor aquí mismo con tomar su valor, y luego pasamos eso para obtener método de autor para obtener los detalles sobre un autor. Está bien, así que no olvidemos hacer las importaciones necesarias. Por lo que voy a añadir una importación para autor. Voy a importar autor del tipo de autor, que está en el mismo directorio. Y también necesito importar base de datos falsa, que se sienta en las raíces de nuestro directorio fuente. Muy bien, así. Por lo que ahora podemos implementar otra relación más compleja. Ah, Block. presumir puede tener uno o más comentarios. Por lo que decimos que el campo común será de tipo comentario, pero será una lista de comentarios. Entonces, ¿cómo hacemos eso? Bueno, eso es agregar otro campo aquí. Voy a llamar a esto comentarios, y esto es un tiempo comentarios, pero de nuevo, necesitamos una lista de comentarios, así que vamos a envolver o tipo común dentro de un nuevo objeto de lista de graf Cuba como ese. Y así ahora gráfico Usted bien sabe que no va a devolver un comentario sino que podría devolver un brazo o comentarios en con este campo. Entonces de nuevo, vamos a añadir una función de resultado. Esta función de resultado volverá a recibir nuestro post. Voy a usar una función de flecha aquí, y queremos devolver una base de datos grande, no obtener comentarios para publicaciones. Y vamos a pasar por el i d fuera del poste que estamos usando en este momento. Y otra vez no olvidemos hacer las importaciones necesarias. Obvia, astucia. Bueno, lista aquí. Por lo que necesitamos importante desde el gráfico su paquete. Entonces ahora sabemos hacer estas relaciones. Volvamos ahora al tipo de autor. Sería interesante que la gente pudiera solicitar todos los posts en bloque que fueron escritos por un autor específico. Entonces vamos a agregar un campo de publicación al tipo de objeto para autor, Así que voy a llamarlo Post. Va a ser un post tipo, pero va a ser una lista de publicaciones. Por lo que es un nuevo objeto gráfico Ural List con nuestro tipo de objeto posts. Y también necesitamos una función de resultado la cual va a recibir al autor actual. Y lo que queremos hacer es que queremos devolver falso punto de base de datos Get posts off, author, y vamos a pasar por el autor I d. Y otra vez, no olvidemos hacer las importaciones necesarias. Estoy usando gráfico que enumerarás del paquete gráfico UL. También necesito importar el tipo de objeto posts del directorio actual. Y necesito importar base de datos de fig, que nuevamente se sienta en las raíces de nuestro directorio fuente. acuerdo, así que fue todo por este video que hemos implementado de nuevo todo tipo de objetos gráficos, estos UAL telegráfico, que se siente querer exponer a nuestros usuarios y cómo debe hacer frente a la relación entre datos. No obstante, también necesitamos telegrafiar bien clave, cómo puede recuperar las entidades en primer lugar. Entonces en este momento le dijimos a Graphic UL qué campos tiene una publicación de bloque, pero no le hemos dicho cómo en realidad puede buscar un post de bloque de la base de datos. Por lo que en el siguiente video, vamos a arreglar eso. Implementaremos Acuario 13. Consultas: Oigan, todo el mundo. En el video anterior, implementamos los tipos de objetos que son utilizados por artesanías UAL para saber qué campos tiene una entidad . También ayuda a la gráfica. Entenderás la relación entre objetos. Pero hay un problema. Aquí está gráfico su consulta que obtiene detalles sobre un bloque posts y sobre el autor que las escribió. Ahora, después del video gráfico anterior, UL es capaz de buscar los detalles sobre un autor porque implementamos una función de resolución que maneja la relación entre post y author. No obstante el gráfico UL no sabe cómo puede buscar aquí el campo de ruta. Para eso, necesitamos implementar algunas consultas. Ahora vamos a implementar tres consultas. Uno para obtener todas las publicaciones de bloque, quiere obtener detalles sobre una publicación específica y quiere conseguir un autor específico. Ahora los dos últimos requerirán un argumento. Entonces, empecemos. Entonces estoy de vuelta en código de estudio visual y vamos a empezar por implementar la consulta de las cuentas . Entonces voy a abrir el archivo post Js dentro de nuestro directorio de consultas, y voy a empezar exportando un objeto por defecto. Voy a exportar valores predeterminados, y dentro de este objeto voy a crear un post de culto a la propiedad. Y este será también el nombre de nuestra consulta. Entonces elijalo sabiamente porque la gente lo estará usando cuando usen tu A P. I ahora publica de nuevo es un objeto el cual contiene los detalles sobre nuestra consulta. Entonces primero tenemos que hablar gráfico tú Bueno, qué tipo de datos esto regresará en nuestro caso. Devolverá una lista fuera de los puestos de bloque. Por lo que el tipo es nuevo. UL gráfica lista fuera de los puestos, y también necesitamos darle una descripción. Por lo que voy a decir, consigue una lista de publicaciones recientes en bloque. Esa es una descripción bastante bonita. Nuevamente, esta descripción se mostrará cuando las personas estén usando gráficos. Por lo que montar una buena descripción ayudará a tus usuarios a adoptar tu A P I más rápido porque obtienen un poco de ayuda. Ahora, también podemos aceptar argumentos si queremos o si es necesario. Pero en este caso, no necesitamos aceptar ninguna. Entonces voy a dejar este objeto vacío Ahora. Por último, necesitamos de nuevo una función de resultado que en realidad saldrá a la base de datos y recupere los datos que necesitamos. Entonces voy a escribir resolución. Voy a darle una función. Y esta vez sólo voy a llamar a base de datos de fig, y sólo voy a conseguir una lista de los puestos de bloque. Entonces de nuevo, en nuestro caso, base de datos FIG es una abstracción de base de datos Se Hamels toda la comunicación con en base de datos real . Entonces en realidad, puedes usar el mismo código que yo hago aquí mismo. Pero solo necesitas cambiar la implementación fuera del método de poste de bloque de gas. De acuerdo, así que eso es todo para esta consulta. Es bastante sencillo. Lo único que necesito hacer es asegurarnos de que importamos las dependencias necesarias . Por lo que necesitamos gráfico Usted Una lista del paquete gráfico curole. Necesitamos el tipo de objeto post desde nuestro directorio de tipos, y necesitamos base de datos fig, que se sienta en la raíz de nuestro directorio fuente. Por lo tanto, sigamos ahora e implementemos la consulta del autor. Entonces voy a copiar y pegar este código, porque de nuevo, mucho de este código es similar para el autor, Así que voy a abrir el archivo de dot autor Js dentro de nuestro directorio de consultas. Voy a pegar todo el código aquí, y voy a empezar por cambiar el nombre de este campo aquí. Llama a este autor y también voy a cambiar la descripción. Y voy a decir que esta consulta consigue un autor específico. Ahí vamos. También necesitamos cambiar el tipo. Por lo que ahora ya no vamos a devolver una lista de publicaciones. En realidad le devolveremos detalles sobre autor. Y también necesitamos algunos argumentos ahora porque si quiero obtener los detalles sobre un autor específico que gráfico, necesitarás saber de qué autor quiero obtener los detalles. Entonces voy a decir que esta consulta, excepto en argumento, excepto en argumento, llamó yo d. Y este argumento debe ser de tipo grafico fuerza UAL. Pero aquí podemos hacer más. Esta consulta no puede funcionar sin un argumento. Si quieres los detalles sobre un autor, tienes que especificar en un d si el mal gráfico no tiene un i d. Entonces no puede captar detalles sobre un autor porque no sabe qué autor necesita buscar. Fecha en Así podemos envolver este gráfico. Tendrás cadena dentro de un nuevo gráfico UAL non ningún objeto y esto te dirá gráfico. Pues bien, que se requiere el argumento y, de hecho, gráfico. Al valida las consultas antes de ejecutarlas. Y así si ve que el argumento de idea le falta, ni siquiera ejecutará su consulta. Y no interactuará con tu base de datos bastante útil. Y por último, necesitamos implementar lo que necesitamos para cambiar mejor la función de resultado. Por lo que esta función ahora recibirá dos parámetros en lugar de uno. En primer lugar, recibirá el objeto padres, y en segundo lugar, recibirá todos los argumentos para esta consulta. Ahora, podría escribir algo como esto. Podría decir padres argumentos, y luego podría llamar a la gran base de datos y puedo decir conseguir autor. Y luego voy a tomar los argumentos, que es básicamente una copia de este objeto, pero luego rellenado con valores reales así que podría decir argumentos pensados que d. Pero también puedo tomar directamente el argumento i D usando el script Atmos seis asignaciones destructoras y lo que puedo hacer es en lugar de usar argumentos, puedo usar Syntex así, y lo que esto hará es que esto extraerá el campo I D del objeto que a esta función se le pide un segundo parámetro y luego yo sólo podría usar me d así. Entonces es una sintaxis un poco más corta. También es nueva sintaxis, así que mantengamos eso por ahora. ¿ Todo bien? Entonces, nuevo, para terminar esta consulta, necesito arreglar nuestras importaciones. No necesitamos gráfico. Ya listan bien. Pero sí, sin embargo, necesitamos Graphic ul string, y sí necesitamos grafica que el non. No. Y también necesitamos importar autor, y ya no necesitamos post. Entonces voy a importar autor del post autor, y podemos mantener nuestra importación para la base de datos falsa. Muy bien, así que pasemos a la consulta final. Voy a copiar de nuevo este código, y esta vez vamos a implementar nuestros posts. Consulta. Entonces voy a pegar, uh, son abrigo aquí. Y esto permitirá a los usuarios buscar los detalles sobre una publicación de bloque específica. Entonces, de nuevo, necesitamos cambiarlo un poco. Voy a llamar a este curry, solo publicar va a devolver un objeto post, y vamos a darle una mejor descripción también. Vamos a decir, obtener detalles sobre una publicación específica. Ahí vamos. Ahora vamos a mantener este argumento de idea aquí mismo porque el usuario debe pasarlo si quiere obtener información sobre post específico. No obstante, la idea de un post no es una fortaleza. Es un imager. Por lo que necesitamos cambiar el tipo aquí, también. Gráfico Lo harás. Y ahora la función de resultado es casi idéntica también. Entonces seguimos recibiendo el objeto de los padres, y seguimos extrayendo los alimentos A D de los argumentos. Pero necesitamos cambiar el método que usamos en nuestra base de datos de fe, por lo que no necesitamos conseguir al autor que necesitamos para obtener publicaciones bloqueadas. Entonces, como siempre, arreglemos sus importaciones. Ya no necesitamos la importación del autor. Ahora necesitamos importar posts y no necesitamos gráficos. Vas a cadena. Pero necesitamos grafica que Bueno, está bien. Voy a guardar el archivo y ya está. Ya implementamos las consultas para R A P I. En la siguiente falla, implementaremos algunos tipos de objetos de entrada, y esto formará la base de nuestras mutaciones que haremos en video. Después de ese 14. Entrar tipos de objetos: Hola a todos. En este video, implementaremos tipos de objetos de entrada. Entonces hace apenas dos videos, creamos tipos de objetos regulares, y esos son utilizados por artesanías. Todos ustedes saben qué campos puede exponer al usuario. Bueno, los tipos de objetos de entrada son casi exactamente los mismos, excepto que se están utilizando para cuando los usuarios envían datos a tu A. P I tipos de objetos de entrada te ayudan a crear todos para comprobar si un usuario le ha dado todo lo necesario y si esos campos están fuera del tipo correcto. Por lo que para resumir, se puede decir que los tipos de objetos se utilizan consultas para cuando las personas están solicitando datos de sus entradas A P I. Los tipos de objetos son mutaciones de Houston donde la gente está enviando datos a tu A P I. Así que vamos a implementar para ingresar tipos de objetos para nuestro bloque a p I. Quiero que los autores puedan crear nuevos posts de bloque, y quiero que los usuarios puedan publicar comentarios a través de nuestro gráfico tu L a p I. Así que empecemos con la creación de un tipo de objeto de entrada para el nuevo post de bloque. Voy a almacenar estos tipos de objetos de entrada en el mismo archivo que los tipos regulares. Entonces voy a abrir el archivo posts dot Js dentro de nuestro directorio de tipos, y voy a exportar una nueva constante llamada post input type. Y este será un nuevo tipo de objeto de entrada UAL gráfico. Y de nuevo, vamos a pasar el objeto en Es constructor. Nadie tipo de objeto de entrada es muy similar al tipo de entrada irregular en el sentido de que también necesitan un nombre, una descripción y algunos campos. Entonces sólo voy a darle un nombre. Voy a llamarlo post input, y luego le voy a dar algunos campos. Ahora bien, ¿qué campo incluimos aquí? Bueno, voy a decir que cuando un autor crea una nueva publicación en bloque, necesitamos conocer el título, el contenido y el autor, yo d Así que ahora solo voy a llamar a ese autor de campo. También necesitamos definir nuevamente el tipo de cada campo. Por lo que el título será de tipo Graphic UL string, y lo mismo va para el contenido. Y para autor porque en la base de datos de la Fed, hemos implementado el autor yo d como una fortaleza. Pero ahí hay más, no sólo cuerdas. Se requieren cuerdas. No pueden estar vacíos porque no debe existir una publicación en bloque sin título o sin contenido o sin autor. Por lo que necesitamos envolver nuestros tipos dentro de un objeto gráfico UL no metálico. Entonces voy a ver que ese tipo es nuevo. Gráfico que el non? No, y voy a envolver gráfico. Vas a encolar dentro de eso. Voy a hacer lo mismo por estos tres campos. Ahora, antes de que nos olvidemos, añadamos también las importaciones para la entrada gráfica euro, tipo de objeto y gráfico. Ahora sabrás en la parte superior de nuestro archivo Así que gráfico ingresarás tipo de objeto y artesanal cura non. No, ahí vamos. Por lo tanto, ahora pasemos al tipo de objeto de entrada para los comentarios. Voy a copiar este código aquí mismo, y voy a abrir nuestro tipo común y voy a pegar el código ahí. Ahora, claro, vamos a cambiar el nombre de esta variable. Vamos a decir comentario, tipo de entrada, y vamos a darle un nombre diferente. Comentarios, insumo. Voy a llamar a esto y tenemos que cambiar los campos. Aziz. Bueno, entonces cuando publiques un comentario, necesitamos saber tu nombre, el contenido de tu comentario y la idea de la publicación en la que quieres dejar tu comentario. Entonces voy a hacer eso ahora mismo. Voy a pedir tu nombre contenido que podemos conservar. Y, por supuesto, la idea del post que quieres hacer tu comentario. Ahora vamos a comprobar de los tipos son correctos. El nombre y el contenido deben estar fuera de gráfico. Tendrás fuerza pero post i d La idea de una base de datos post interreligiosa es un tipo imager, por lo que requeriremos un pozo ingenioso aquí también. Entonces una vez más, arreglemos sus importaciones. Necesitamos importar gráfico ul input tipo de objeto. Necesitamos importar artesanía, sabrás, conocerás e injertos Cuba ins. Y eso fue todo para este video de nuevo, hemos creado los tipos de objetos de entrada que usaremos en nuestras mutaciones en este momento. Artesanía. Sabrás qué campos deben dar los usuarios si quiere crear una nueva publicación en bloque o si quiere crear un nuevo comentario. No obstante, UL gráfica no sabe cómo debe escribirlas en la base de datos. Por lo que en el siguiente video implementaremos mutaciones para que podamos guardar estos datos para trabajar base de datos 15. Crear mutaciones: Hola a todos. En el video anterior, creamos tipos de objetos de entrada y les dije que esos eran la base de las mutaciones. Bueno, en este video, implementaremos dos mutaciones para un gráfico. Tú l A p i Ahora, si no recuerdas cuáles son las mutaciones, echa un vistazo a la sección dos de las partituras para refrescar tu memoria. Por lo que las dos mutaciones son una para permitir a los autores publicar nuevas publicaciones en bloque en nuestra base de datos y otra para permitir a los usuarios publicar comentarios en publicaciones en bloque. Entonces empecemos con los anuncios publicar mutaciones ahora, porque las mutaciones son muy parecidas a las consultas. Todos comienzan por copiar el código de nuestra consulta de post. Entonces voy a abrir en el poste. Scary Aquí. Voy a seleccionar todo el código y copiarlo, y lo voy a pegar en el archivo Js postal del anuncio dentro de nuestro directorio de mutaciones. Ahora de nuevo, necesitamos adaptar un poco esto. Para empezar, voy a llamar a esta mutación en Post, y esta mutación escribirá un nuevo post de bloque en la base de datos. Pero también devolverá las publicaciones de bloque recién creadas para que el usuario pueda trabajar con ella si quiere . Entonces voy a mantener el tipo establecido para publicar aquí. También le vamos a dar una descripción adecuada. Iban a decir que esto crea un nuevo post de bloque y también debe aceptar un argumento . Ahora, si User quiere crear un nuevo bloque presume debería pasar a lo largo de los datos ahora, podría crear un argumento para cada campo para nuestro post, por lo que eso sería un argumento para el título. Otro argumento para el contenido, Otro para los autores. I d. Sin embargo, una forma más eficiente es utilizar el tipo de objeto de entrada que creamos en el último video. Entonces solo voy a crear un argumento y voy a quitar el que tenemos ahora mismo. Y voy a crear un solo argumento llamado Post, y voy a decir que post debe ser si tipo de tipo de entrada post. Ahora, también necesitamos una función de resultado para decirle gráfico. Bueno, qué debe hacer una vez que reciba estos datos de un usuario. Entonces esta es una función que nuevamente recibirá nuestra variable padre, y recibirá todos los argumentos que se pasaron a esta mutación. Entonces lo que haremos aquí es extraer el post argumento para nuestra función de resultado. Y lo único que tenemos que hacer es hacer una llamada a base de datos falsa y necesitamos agregar un nuevo post de bloque. Y ya hice ese método en New Block Post. Y por supuesto, vamos a pasar nuestro post argumento que recibimos aquí. Vamos a pasar eso a ese método. Ahora, también regresamos esto porque en gráfico, muchas mutaciones devuelven el mismo objeto que acabas de crear. Entonces en nuestro caso, si ejecutas la mutación en el post, realidad devolverá los datos que realmente ha enviado a la base de datos. Y eso podría ser interesante. Por ejemplo, si creas un nuevo post y le diste a tu autor, yo d obtienes ese post de vuelta. Pero entonces se puede preguntar, por ejemplo, por el nombre del autor, que de nuevo implica algunas relaciones. Ahora, antes de continuar, necesitamos arreglar nuestras importaciones una vez más para que podamos mantener el puesto importante aquí. Pero necesitamos una importación para nuestro tipo de post input. Por lo que sólo voy a decir que importamos posts de la publicación de tipos, y también necesitamos el tipo de entrada de post. Está bien, así que voy a guardar el archivo y vamos a hacer ahora nuestra segunda mutación, y eso es agregar comentario. Ahora, antes de que podamos hacer eso, necesitamos asegurarnos de que nuestra obstrucción de base de datos pueda manejar eso. Y en este momento, no tiene ningún método que te permita crear un nuevo comentario. Entonces vamos a crear ese método. Primero, voy a abrir una base de datos de higo aquí, y voy a desplazarme hacia abajo hasta el fondo. Y aquí tengo algunos métodos correctos. Y ahora mismo, sólo tengo agregar nuevo impulso de bloque aquí. Entonces voy a agregar un método llamado agregar nuevos comentarios y esto recibirá un comentario. Objetos de nuestro gráfico resolverás función y todo lo que este método debe hacer es dar comentarios un válido d empujarlo al área justo aquí. El área que contiene todo el contenido comentarios sobre, y luego debe devolver el comentario recién creado. Entonces hagámoslo ahora mismo. Vamos a empezar por dar comentario en I d. Así que podría darle una idea única aquí, pero sólo voy a decir que este doc comentarios no son longitud más uno. Entonces si son cinco comentarios en la base de datos que la idea del nuevo comentario será cinco más uno, y eso serán seis. Entonces después, lo vamos a empujar hacia la zona. Vamos a decir esto o comentado. Empuje. Vamos a empujarle ese comentario, y luego vamos a volver a comentar también. Para que nuestro gráfico te fugues. Puedo presentárselo al usuario. Muy bien, así que ahora implementemos la mutación. Voy a abrir el archivo poco común, y primero voy a copiar todo de y publicaciones. Voy a acelerar eso. Van a cambiar el nombre. Lo voy a llamar. Agregar comentario. Esto devolverá un objeto de comentario. También le vamos a dar una descripción más adecuada. Vamos a decir crea un nuevo comentario para una publicación de bloque. Esto recibirá un argumento, pero no recibirá un post. Recibirá un comentario. Y eso serán comentarios fuera, tipo de entrada, y en un resultado, función. Tenemos que agarrar nuestros argumentos de comentario, éste de aquí. Y luego necesitamos llamar a base de datos fig y necesitamos decir tener nuevos comentarios y luego vamos a pasar a comentar argumento ahí mismo. Entonces para terminar, arreglemos nuestras importaciones. Por lo que necesitamos importar comentarios que necesitamos importar. Necesitamos importar comentario,tipo de entrada, tipo de entrada, y lo importamos desde Are comments Types file, que se encuentra en nuestro directorio de tipos. Muy bien, digamos el archivo y eso fue todo para este video con implementadas las mutaciones que permitirán a la gente enviar nuevos datos a un gráfico. Tú l A p i Ahora estamos casi listos para probar su gráfica tu l a p I. En el siguiente video, tiraremos todo juntos para crear nuestro esquema. Y luego terminamos. Entonces sigamos con el siguiente video. 16. Construir un esquema: Hola a todos. En los últimos videos, hemos creado todos los bloques de construcción para nuestra implementación gráfica UL. Creamos tipos de objetos, consultas, entrada, tipos de objetos y mutaciones. Y ahora es el momento de juntar todos estos en nuestro esquema. Ahora, un esquema básicamente te dice gráfico Bueno, cómo podría exponer tus datos a los clientes y cómo los clientes consienten nuevos datos a la A p I. El esquema. Define la forma de todos esos datos. Ahora nuestro esquema vivirá en el siguiente archivo RGs dentro de nuestro esquema un directorio. Entonces voy a derrumbar a Thes Fuller aquí. Voy a abrir el siguiente archivo stop Js. Entonces empecemos por crear una constante llamada esquema. Y este será un nuevo esquema gráfico UAL y nuevamente en su Constructor. Vamos a pasar un objeto vacío dentro de este objeto, vamos a definir dos propiedades una propiedad para consulta y una propiedad, cuatro mutaciones. Entonces vamos a decir crary, que es un nuevo tipo de objeto ul gráfico otra vez, inicializarlo con un objeto vacío. Y también tendrá imputación, que también es un nuevo tipo de objeto gráfico UAL. Entonces vamos a implementar la consulta porque Se trata de un gráfico tipo de objeto Curiel. Requiere un nombre y opcionalmente una descripción, tal como lo hicimos con los tipos de objetos para post comment y author. Entonces voy a dar nombre de consulta. Voy a decir que esta es nuestra consulta de ruta, y también necesitamos darle algunos campos que el usuario pueda solicitar. Y estos son los campos de nivel superior. Estos son los campos raíz con los que su usuario puede trabajar. Entonces voy a agregar un campo de propiedad aquí, y vamos a usar una función de flecha, que devuelve un objeto. Esto asegurará que mantengamos nuestro alcance que podamos acceder a todas las variables y métodos que tenemos dentro de este archivo. Ahora, en nuestro caso, hemos definido consultas y mutaciones en otros archivos, por lo que necesitamos importarlas primero antes de poder trabajar con él. Por lo que vamos a importar posts de nuestras publicaciones de la carpeta Consultas. Vamos a importar nuestra consulta de post también de consultas post, Jess. Y luego vamos a importar la consulta del autor de las consultas slash author. Si bien estamos en ello, también vamos a importar esquema ul gráfico y tipo de objeto riel de injerto. Por lo tanto, importa gráfico que esquema y grafica que el tipo de objeto del gráfico que empaquetarás . Ahí vamos. Y ahora que lo tenemos importante nuestras consultas, sólo podemos agregarlas como campos aquí. Y para hacer eso, voy a utilizar para los operadores de difusión. Voy a decir dot dot Not posts dot, dot, dot posts y dot, dot, dot Author. Ahora, el operador de spread quitará los contenidos de las publicaciones autor y post. Y va a complacer estos contenidos dentro de este objeto aquí mismo. Por lo que es casi como ahí mismo, excepto que los importamos de un archivo diferente para que nuestro proyecto sea más fácil de mantener y más fácil de entender. Ahora podemos hacer lo mismo por la mutación, así que los vamos a importar también para decir, importar en posts de mutaciones, cortar en post, y vamos a importar y comentarios de pensamiento slash, mutación barra y comentarios. Y ahora los podemos sumar aquí un oleaje. Entonces vamos a darle un nombre a nuestra mutación. Va a ser la mutación de raíces, y va a recibir algunos campos que de nuevo es una función de flecha que devuelve un objeto. Y vamos a usar el operador de spread para agregar los contenidos para en la publicación y agregar comentario. Está bien, voy a guardar el archivo. Y eso fue todo por este video. Hemos tomado todos nuestros bloques de construcción, nuestras consultas y nuestras mutaciones, y los hemos puesto dentro de nuestro esquema. Y ahora gráfico. Bien puedes usarlo esquema para manejar nuestras consultas y nuestras mutaciones. Ahora, en el siguiente video, por fin estamos listos para probar al FBI y para verlo en acción. 17. Prueba de nuestra API de GraphQL: Hola a todos. En el último video, creamos nuestro gráfico que vas a esquema. Y eso significa que ahora tenemos todo lo que necesitamos para empezar a usar nuestro MP I Así que, en este video, probaremos si r p i funciona correctamente. Ahora voy a implementar esto en el siguiente archivo dentro de nuestro directorio fuente. Y esto contiene algunos Tesco que utilizamos en una de las secciones anteriores. Entonces voy a mantener la importación demasiado gráfica ustedes todos. Pero ahora voy a quitar la bitácora del cónsul aquí. Además gráfico, tú Bueno, también necesitamos importar son esquema porque ul gráfico Las necesidades son esquema para saber qué tipos de objetos tenemos en nuestros ojos ap. ¿ Qué consulta? Sri permitiendo qué mutaciones tenemos. Entonces vamos a importar esperanza que desplácese hacia arriba. Eso es cruel. Vuelve a subir. Entonces vamos a importar esquema desde el directorio de esquemas y con el guiso cargado, ahora podemos empezar a escribir un gráfico. Tú bien, Crary Así voy a crear una constante llamada consulta y la voy a inicializar. Y aquí estoy usando una plantilla literal porque entonces puedo usar saltos de línea sin tener que preocuparme por las cotizaciones. No obstante, también puedes usar fuerza regular. Es todo lo mismo. Por lo que nuestra consulta será muy sencilla. Asumamos que quiero una lista fuera de todo bloque, post y de cada bloque presumir quiero el título. Entonces en gráfico, valoras los objetos creados. Entonces dices que quiero el poste los postes de bloque y desde poste de bloque. Yo quiero ese título Muy sencillo. Entonces ahora que tenemos nuestra consulta debilita ejecutada contra nuestro esquema Así que te voy a llamar gráfico Bueno, que lo importamos aquí y voy a dar gráfico. Serás esquema, que también importamos aquí. Y luego vamos a pasar por nuestra consulta ahora gráfica UAL funciona una sincrónicamente y eso significa que aquí devuelve una promesa. Por lo que tenemos que esperar la salida si quieres trabajar con ella. Entonces para hacer eso promete hay que agregarlo, entonces método el cual recibirá los resultados de gráfico te Bueno, esta será una función de flecha. Y entonces aquí dentro podemos trabajar con los resultados. Entonces todo lo que voy a hacer es que voy a cónsul bloquear los resultados para que podamos ver qué hay en él. No obstante, tenga en cuenta que los datos de resultado que obtenemos de UL gráfico serán todos los objetos JavaScript. Y si quieres ver qué hay dentro de un objeto, primero necesitas amarrar una pelea. Por lo que llamaré a Jason dot string of fine en nuestros resultados. Y también quiero resultar un poco bonita, necesita ser formateada. Entonces se lo voy a dar a parámetros adicionales. El 1er 1 me voy a poner a conocer. Eso es porque queremos cadena Si yo todos los campos y entonces vamos a pasar por el número dos. Y esto significa que va a en abolladura nuestro objeto aquí, un objeto de resultado con dos espacios, y eso hará que sea más fácil de leer. Muy bien, una cosa más que hay que hacer aquí. Estamos manejando la promesa con ella entonces, pero no estamos manejando ningún error. Entonces vamos a añadir un método de captura aquí. Y si debería haber alguna vez solo vamos a iniciar sesión en la consola para que sepamos algún Evers potencial. Entonces voy a guardar el archivo y te voy a probar o graficar l a p Voy a abrir la terminal aquí y voy a ejecutar primero nuestro script de compilación. NPM Run Construido de nuevo. Hemos definido este uno de los videos anteriores. Esto correrá balbucear, y al parecer tenemos un poco de un problema con Ver aquí gráfica de declaración duplicada en la que entrarás. Por lo que parece que hemos importado el injerto UAL dos veces en nuestro objeto de comentario. Entonces echemos un vistazo a los comentarios y sí, ahí vamos. Quitémoslo. Volvamos a correr viable. Ver allí más temas en nuestros días de código. Ellos hay algún look palo ahora Common no está definido en nuestros tipos de objetos post. A ver. Sí, estamos usando común aquí, pero no lo hemos importado, así que vamos a importar eso ahora mismo. Importar comentarios de nuestro comentario. Tipo de objeto. Ahí vamos. Vamos a ejecutarlo una vez más. Y ahora dice esquema debe ser una instancia de esquema gráfico Ural. Entonces algo está pasando con nuestro esquema. Abrámoslo. Y el problema es que olvidé exportar nuestro esquema. Entonces estamos encontrando esquema aquí, pero no lo estamos exportando. Entonces todo lo que tenemos que hacer es decir, exportar los predeterminados, esquematizar, y ahora todo debería estar bien. Vamos a correr de nuevo y Ahí tienes. Nuestro gráfico. Tu Aly p. yo trabaja. Entonces esta es la respuesta que llegamos a nuestra consulta. Entonces esperemos de la consulta. Por lo que hemos pedido todas las publicaciones en nuestras publicaciones en bloque, y hemos pedido el título de cada una de esas publicaciones en bloque. Y así recuperamos los posts, que es un área, y contiene un objeto por post en nuestra base de datos con el título fuera del Post. Entonces terminemos probando una consulta más avanzada que también usa relaciones. Digamos que quiero una lista de todos los postes de bloque con nombre del autor que los escribió. Entonces queremos el título. Voy a decir que también queremos al autor y queremos el nombre del autor. Entonces vamos a guardar el archivo. Vamos a ejecutar o construir script de nuevo. Y bastante seguro, ahora obtenemos una lista de Bloque post con su título con un campo de autor y con nombre fuera del autor. Entonces eso fue todo por este video y permitirse esta sección son gráficos te l a p I implementación ahora está completa y en realidad funciona. En el siguiente apartado. Te mostraré cómo puedes configurar gráfica para que contiendas tu A p i con un arma o cara muy bonita e incluso obtienes características como auto complete como tu tipo en tu consulta. 18. Introducción a GraphiQL: Hola, todos en esta sección, probaremos nuestra A p I con gráfica. En este video, voy a explicar qué gráfica ISS y por qué podría ser una gran idea usarlo. Después de eso, te mostraré cómo instalar y configurar gráfico para solo P I. Y finalmente te mostraré cómo usar el gráfico en sí. Entonces, empecemos explicando qué es el gráfico. He usado el taburete en videos anteriores para explicar los conceptos básicos fuera de gráfico Tú fuera ahora para probar tu a p I. Necesitas realizar solicitudes a un servidor Web. Puedes hacer eso escribiendo algunos guiones pequeños, o puedes usar APS que están específicamente diseñados para ello en caso de descanso. AP eyes Hay muchas herramientas para hacer esto. Estoy pensando en herramientas como Cartero Paw, el cliente de descanso construido de Jet Brain, ID's y así sucesivamente. Gráfica es igual que esas herramientas, excepto que funciona con el gráfico u l e p i en lugar de un descanso a p i Pero no se detiene ahí. El gráfico es mucho más inteligente que cualquier otra herramienta AP I. Se integra con tu gráfico U L f b I, y lo pregunta sobre todas las consultas, mutaciones y tipos soportados . Ahora, con esa información, gráfica es capaz de ofrecerte sintaxis, destacando inteligente, auto completar error en tiempo real, destacando una finalización automática de consulta. De hecho, gráfico se está describiendo como una idee para gráfico. Tú bien, y lo mejor de todo, se ejecuta completamente en tu navegador. Entonces vamos a sumergirnos enseguida. En el siguiente video, agregaremos gráfico como dependencia y escribiremos un poco de código para que realmente se ejecute . 19. Instalar y configurar GraphiQL: Oigan, todo el mundo. En este video, instalaremos y configuraremos gráficos para que puedas empezar a usarlo. Ahora vamos a utilizar NPM para instalar gráfica como dependencia para nuestro proyecto. Ahora, antes de poder usar gráficos, sin embargo, necesitamos asegurarnos de que nuestro A p I sea accesible dentro de la llamada http. Entonces necesitamos ejecutar nuestro servidor Web para eso Ahora, sin mundo G s, mucha gente usa express. Se trata de un marco de replicación simple, e incluso hay un paquete de notas que conjuntos de gráficos para reunir con express. Entonces vamos a instalar eso en nuestro proyecto. Voy a abrir una terminal y voy a ejecutar NPM instalar Dash, dash safe to telegraph que bien, que debería guardar esta dependencia archivo Jason empaquetado interno. Y luego voy a decir que debería instalarte, expresarte y expresarte bien gráfico, y este último proporcionará la integración entre gráfico UAL y express para que no tengamos que escribir eso nosotros mismos. Entonces, vamos a correr eso ahora. Ahora, con los instalados, necesitamos una pequeña pieza de script Java que inicie un servidor express y vincule gráfico a él para eso voy a crear un nuevo archivo dentro de nuestro directorio fuente, y voy a llamar a esto surf dot jazz. Voy a cerrar la terminal, y voy a empezar importando. Nuestras dependencias comenzarán importando express desde el paquete express. Y también importaremos grafico ul http del grafico express te bien, biblioteca. Y de nuevo, este es un paquete especial que hace compatible gráfico, ul y gráfico con express. Ahora, finalmente, porque queremos ejecutar consultas necesitamos importar son esquema para que el mal gráfico sepa qué datos tenemos y cómo podemos acceder a ellos. Entonces voy a importar el esquema de este directorio ahora, con eso hecho, podemos crear un nuevo servidor Web. Y así voy a crear una nueva constante llamada app, y voy a inicializar aquí un nuevo objeto express. Entonces en este punto, tenemos un servidor web, pero aún no tiene ningún punto final, así que lo voy a agregar diciendo después de uso y esto requiere de dos parámetros. El 1er 1 es el punto final que se quiere exponer. Y el 2do 1 es una función que responderá a una solicitud, así que voy a exponer el gráfico de barras bien y apuntar. Y ahora necesitamos especificar qué función manejará nuestra solicitud. Y usaremos gráfico te al h para ser del paquete que acabamos de importar aquí. Entonces voy a llamar al gráfico ul http y dentro de su constructor, voy a pasar un objeto vacío, y aquí podemos pasar por las opciones para gráfico. ¿ Estás fuera, Http? Entonces primero parada, vamos a pasar o esquema a ella. Para que sepa qué consultas apoyamos y cómo debe hablar con nuestra base de datos. Y luego vamos a habilitar la gráfica pero simplemente estableciendo la propiedad gráfica en verdadera. Muy bien, ya casi terminamos. Ahora, lo último que tenemos que hacer es que tenemos que iniciar nuestro servidor web diciendo que nuestra acción escucha en un puerto específico. Entonces voy a decir en la consola, arrancando el servidor para que tengamos un poco de retroalimentación y que voy a decir, app dot Escucha, y voy a hacer nuestro desventurado y en puerto por 1000 ahora, recuerda, si queremos ejecutar el script, primero tenemos que ejecutar balbucles, y luego necesitamos ejecutar nuestro script. Entonces vamos a automatizar eso creando un nuevo script en nuestro archivo empaquetado de Jason. Entonces voy a abrir el paquete del archivo Jason aquí, y voy a crear un nuevo guión aquí, y voy a llamar al servicio de guiones. Y lo primero que debe hacer es que en realidad debe construir nuestro proyecto. Entonces voy a decir fuente de balbucear. Y entonces el directorio de salida es este y el segundo comando que debe ejecutar es debe ejecutarse. Se sirven en archivo Js con No Jess. Entonces voy a hacer ese nodo. Esto sirvió jazz de pensamiento. Muy bien, así que vamos a guardar el archivo y vamos a probarlo. Voy a abrir terminal y voy a correr NPM Run surf. Y como se puede ver, este script ahora ejecuta balbucear para transpirar son código de script Java, como se puede ver aquí y luego también ejecuta su servidor web. Este es el mensaje de nuestro servido que el archivo Js y también se puede ver que mantiene ocupado mi eterno prompt porque el servidor Web realmente se está ejecutando así que en este momento no puedo escribir un nuevo comando en mi terminal porque el servidor Web sigue funcionando o no hay jazz está a la espera de las solicitudes entrantes. Entonces eso fue todo para que este video o servidor Web esté en funcionamiento. Está listo para recibir solicitudes, Así que en el siguiente video, usaremos gráfica. 20. Uso de GraphiQL: Hola a todos. En este video vamos a echar un vistazo a cómo puedes usar la gráfica y verás por qué es una herramienta tan grande. Es otra ventaja de grafico te L a p s medio sobre el tradicional ap ice. Entonces solo para recapitular el último video, hay que ejecutar nuestro script de servir para iniciar aplicación Web express que hospedará gráfica . Entonces voy a abrir la terminal y dentro de nuestro proyecto aquí mismo. Yo sólo voy a correr npm run, señor. Y de nuevo, esto iniciará nuestro servidor express y ahora abramos chrome y vamos a ir a hosts locales 4000. Ese es el puerto que configuramos express para ejecutar en slash graphic te bien y ahora somos recibidos por gráfico. Ahora es interfaz es bastante simple. En el lado izquierdo, puedes ver la consulta e imitación que estás ejecutando en este momento. Una vez que se ejecutan injerto, siempre los muestras en el lado derecho de la pantalla. Ahora en la parte superior, también tienes algunas herramientas que tienes botón play que ejecuta tu código un bonito botón de cinco para formatear e inventar correctamente tus consultas aquí mismo. Y tienes un botón de historial, que se abre en nuestro panel mostrándote consultas recientemente realizadas. Entonces vamos a escribir una simple consulta que obtenga una lista de publicaciones en bloque con el título para cada uno. Ahora supongamos también que soy un nuevo usuario que no ha usado su FBI antes y que ahora no hay documentación usando detenido sea yo, sin documentación adecuada puede ser una pesadilla. Pero, ¿cómo va a ir con gráfico? ¿ Tú? Pues bien, empecemos diciendo que quiero escribir una consulta. Voy a abrir las llaves y como nuevo usuario, no sé qué campos de ruta soporta este ap. Entonces solo voy a sacar el auto, completo por espacio de control oculto. Ahora bien, este es el mismo atajo que muchos yo d Ys uso también. Entonces aquí obtenemos una lista de campos de ruta soportados e incluso obtenemos una buena descripción. Entonces aquí vemos publicaciones y la descripción es obtener una lista de publicación de bloque reciente. Ahora, recuerda, definimos esta descripción en el esquema ahora podría haberse visto un poco criada para definirlos en el esquema, pero aquí realmente llegan a fructificar. Entonces vamos a conseguir una lista de postes de bloque que voy a golpear, Enter, y voy a abrir de nuevo las llaves. Y así como antes, ahora puedo pedir gráficos por los campos que puedo solicitar. Y bastante seguro, están todos los campos que podemos solicitar. Por lo que puedo escoger título, por ejemplo, y golpear Tab, y se sentirá derecho en nuestra consulta. Entonces vamos a probar ahora esta consulta y vamos a ejecutar haciendo click en la jugada. Pero y como puedes ver, obtenemos una lista de postes de bloque en el lado derecho. Bastante simple. Ahora puedo seguir cambiando mi consulta. Veamos qué hace el gráfico cuando no le doy una consulta completa. Digamos que yo también quiero el nombre del autor, pero que sólo pido aquí el campo de autor. Asumamos que no sé que tengo que sub seleccionar nombre a menudo autor. Ahora esto no debería funcionar porque tenemos que especificar qué campos de autor queremos. Pero vamos a ejecutarlo de todos modos. Entonces cuando hago clic en play y como puedes ver, gráfico recogido en él y ha agregado los campos I D automáticamente antes de ejecutar nuestra consulta. Por lo que maneja son errores al tratar de corregirlos de antemano, y en este caso, funciona bastante bien. Ahora hagámoslo un poco más difícil en lugar de título, hagamos un error tipográfico en Vamos a pedir título como este ahora. Como se puede ver, novela gráfica no capta. Este error no avisa esto. No es advertirnos que esta es una consulta inválida, pero si ejecuto esto, verás que Graphic UL sí. Y dice que no podemos pedir un título de campo porque eso no está disponible en nuestro tipo de publicación . Y también trata de ser útil. Y dice: ¿Te referías a título? Y por supuesto lo hicimos también bastante práctico. Ahora, por fin, quiero mostrarles el panel de documentación. Por lo que si hace clic en los muelles aquí en la esquina derecha, abre un panel con la documentación que el gráfico UAL ha extraído de nuestro esquema. Entonces puedo ver qué coros aire posible, por ejemplo, por ejemplo, Así que vamos a abrir la consulta de raíz aquí para ver qué campos de Reed pueden solicitar. Y bastante seguro, aquí hay tres campos de ruta. Puedo pedir publicaciones para un solo post o para detalles sobre un autor, e incluso muestra qué tipo de datos devuelve. Por lo que post devuelve un área de objetos de publicación y nuestros campos de publicación, excepto un argumento I d, que debe ser de tipo imager. Y no tuvimos que volver a hacer nada por esto. Esto se extrajo de las descripciones en su esquema y de los tiempos de retorno o de retorno. Ahora puedo seguir pinchando en campos dentro de aquí. Entonces si quiero saber cómo se ve un objeto post, solo hago clic en él y luego puedo ver que Opted tiene todos los detalles de un bloque posts, y puedo ver los campos que tiene. Entonces eso fue todo para este video. Ojalá te des cuenta de lo poderoso que es el mal gráfico. Se terminará el siguiente apartado. En este curso se hablará de la conclusión, y te daré algún recurso interesante Es para continuar tu gráfica tu búsqueda 21. Conclusiones: Oigan, a todos, muchas gracias por comprar las anotaciones y verlo todo el camino hasta el final. Espero que disfruten estos videos y que hayas aprendido mucho de él. Gráfico UAL es una herramienta increíble. Y a pesar de que todavía es muy joven, ya se está desplegando en grandes empresas como Facebook. Levántate yelp y muchos más. Y ahora ya sabes cómo puedes construir tu propio gráfico. Tú l e p I. Ahora, si tienes alguna pregunta o sugerencia para futuros cursos, sin duda avísame. Agradezco enormemente cualquier retroalimentación que pueda tener. También he publicado el código fuente que se utilizó durante este curso que condonas emitido como archivo zip y lo utilizas como plantilla para empezar a construir tu propio gráfico. Tú, Aly p. También me aseguro de revisar mi canal de YouTube para más tutoriales o de revisar mi página web. Eso fue todo. Gracias de nuevo por ver las anotaciones y espero verte en mi próximo curso