Masterclass práctico con SwiftUI, GraphQL y Neo4j AuraDB

Así que, un poco sobre mí. Trabajo para una compañía de bases de datos de código abierto llamada Neo4j. Neo4j es una base de datos de grafos, hablaremos de lo que eso significa en un minuto. Trabajo en el equipo de relaciones con desarrolladores. En gran medida, mi trabajo consiste en ayudar a los desarrolladores a construir aplicaciones con Neo4j y otras tecnologías. Es realmente importante entender cómo encaja la base de datos con diferentes tecnologías, diferentes componentes de tu architecture. Así que esa es una gran parte de mi trabajo, contextualizar la pieza de la base de datos para diferentes comunidades tecnológicas. GraphQL es una de esas tecnologías, que es el enfoque de nuestro taller hoy. También escribí un libro recientemente publicado por Manning llamado `Aplicaciones gráficas de pila completa`. Este libro está disponible de forma gratuita o la versión de libro electrónico está patrocinada por Neo4j, así que dejaré un enlace a eso. Ahora te llevaré a un formulario si estás interesado en descargar el libro. El libro se centra en el uso de GraphQL en una architecture de pila completa con react en el front end. Así que hoy vamos a ver iOS nativo con Swift UI como el front end del cliente para nuestra aplicación. Si estás interesado en una architecture similar pero utilizando react y vemos diferentes servicios en la cloud como ¿cómo desplegar en Netlify? ¿Cómo usar Op Zero? Así que aquí tienes un esquema aproximado de lo que vamos a hacer hoy. Así que tendremos, supongo, aproximadamente cuatro secciones aquí. Una es que vamos a ver Neo4j y Aura DB, que es un servicio en la nube de Neo4j. Si estuviste en el taller del martes, también usamos Aura. Así que vamos a usar la capa gratuita de Aura, lo cual es bueno porque podemos crear una database que sea privada para nosotros y que no tengamos que poner una tarjeta de crédito ni incurrir en ningún costo. Así que eso es realmente bueno para proyectos de hobby. Tenemos algo así donde no queremos que la database desaparezca, pero simplemente la usamos menos. Eso es lo que vamos a hacer para la capa de la database. Luego vamos a hablar de la construcción de APIs gráficas. Así que construir servidores gráficos y específicamente, vamos a utilizar una integración de GraphQL y database llamada biblioteca Neo4j GraphQL que nos ayudará a aprovisionar nuestra API de GraphQL sin tener que escribir mucho código repetitivo, generar consultas a la database, ese tipo de cosas. Luego vamos a echar un vistazo a SwiftUI. Así que construir aplicaciones nativas de iOS utilizando Swift. Y veremos cómo integrar GraphQL y SwiftUI. Vamos a utilizar la biblioteca Apollo iOS para SwiftUI, que permite, o para Swift, más bien, no específicamente para SwiftUI. SwiftUI es el componente de interfaz de usuario disponible con Swift. Hay algunas formas diferentes de construir interfaces de usuario para iOS. SwiftUI es similar, conceptualmente similar, creo, a muchos frameworks web como React. Así que si estás familiarizado con cosas como React, hay algunos conceptos que se transfieren fácilmente a SwiftUI. Y los únicos entornos de desarrollo local que necesitas tener configurados son Xcode en un Mac. Si no tienes esa configuración, está bien. Puedes simplemente ver mientras hacemos el ejercicio al final. La parte de SwiftUI es la última pieza que vamos a hacer. Para las otras piezas, para usar Neo4j, vamos a utilizar el servicio en la nube AURA y no hay nada que descargar o instalar para eso. Y luego, para construir la pieza de la API de GraphQL, vamos a utilizar CodeSandbox, que es un entorno de desarrollo alojado, por lo que no necesitamos configurar nada localmente para eso. Pero luego hay un repositorio de GitHub para la pieza de SwiftUI de Xcode que tiene simplemente una componente de inicio.

¡Genial! Aquí tienes algunos enlaces a varios recursos que serán útiles mientras avanzamos hoy. Las diapositivas, por supuesto, y un enlace al repositorio de GitHub para el proyecto de Xcode, documentación para la biblioteca de GraphQL de Neo4j, así como una página de descripción general para eso. Hablaremos mucho más sobre eso.

Y luego el tutorial de GraphQL de Apollo iOS es un recurso útil que muestra cómo puedes instalar y configurar el paquete de GraphQL de Apollo iOS en un proyecto de Xcode. Y luego la documentación para desarrolladores de SwiftUI es un buen recurso también.

Entonces esto es lo que vamos a construir hoy. Es una aplicación bastante simple. Así que no nos vamos a enfocar demasiado en muchos de los detalles de SwiftUI para que todo se vea muy bien. Realmente creo que el enfoque de lo que queremos hacer hoy es hablar más sobre cómo encajan las piezas en este tipo de arquitectura.

Lo que vamos a construir es una aplicación de iOS para leer noticias. Así que vamos a obtener artículos de noticias y mostrárselos al usuario y luego pensar un poco en cómo podemos agregar características de personalización a nuestra aplicación de iOS. ¿Cómo podemos mostrar noticias relevantes para los usuarios ya sea por ubicación o encontrar artículos similares que puedan interesar a un usuario. Y vamos a hacer esto utilizando Neo4j como nuestra base de datos. Por lo tanto, vamos a modelar y trabajar con estos datos como un grafo. Cuando hablamos de un grafo, nos referimos a una estructura de datos compuesta por nodos. Estas son las entidades y las relaciones que conectan los nodos. Y vamos a hacer esto con GraphQL.

Entonces, GraphQL va a ser la capa que se encuentra entre nuestra aplicación cliente de iOS y nuestra base de datos. Vamos a construir una API de GraphQL. Una cosa que notarás, cuando hablamos de usar un modelo de datos de grafo en la base de datos, eso es muy similar al modelo de grafo que usamos en GraphQL. Hablaremos un poco más sobre eso.

Genial. Veamos qué es exactamente Neo4j. Así que dije antes que Neo4j es una base de datos de grafos. Eso significa que a diferencia de las bases de datos relacionales que usan tablas o las bases de datos de documentos que usan un documento como un documento JSON, el modelo de datos en las bases de datos de grafos como Neo4j es un grafo. Entonces, los nodos son las entidades, las relaciones conectan los nodos. Usamos un lenguaje de consulta llamado Cypher, que es algo así como SQL pero para grafos es una buena forma de pensarlo. Hay un ejemplo de Cypher aquí en la parte superior derecha. Puedes ver que estamos en la primera línea dibujando esta representación de arte ASCII del patrón de grafo que estamos buscando en este conjunto de datos.

La primera parte aquí, match, que es buscar algún patrón que exista en la base de datos. Estos paréntesis abiertos y cerrados están dibujando una especie de círculo de nodo alrededor de una dirección. Estamos diciendo encontrar donde existe este patrón. Queremos nodos de dirección que tengan una relación de dirección registrada. Un nodo de promesa aquí, estamos poniendo corchetes con la flecha. Eso conecta nodos, en este caso, conectando un nodo de dirección a un nodo de oficial. Y luego estamos atravesando desde ese nodo de oficial para encontrar nodos de entidad. Entonces esta consulta dice encontrar direcciones en Nueva York, encontrar los oficiales que están conectados a esas direcciones, y luego encontrar las entidades conectadas a esos oficiales con una dirección en Nueva York. Y esta es una pregunta del conjunto de datos de los Papeles de Panamá, que fue un proyecto de periodismo de investigación hace unos años, que estaba utilizando Neo4j para dar sentido a los registros corporativos offshore para tratar de encontrar cosas interesantes sobre personas que ocultan activos en compañías offshore, lo cual es un conjunto de datos divertido para ver. Es un conjunto de datos públicos. En el sandbox de Neo4j, genial.

Entonces hablemos de las diferentes tecnologías que vamos a utilizar hoy. Para que estemos al menos en la misma página sobre al menos lo que son, algunos de los beneficios, y así sucesivamente. Hablamos de Neo4j. GraphQL es la siguiente pieza. Creo que muchas personas aquí en la conferencia de esta semana han aprendido mucho sobre GraphQL si no estabas familiarizado con GraphQL antes. Pero básicamente, GraphQL es un lenguaje de consulta de API y una forma de construir aplicaciones de API, por lo que servidores de API. Con GraphQL, tenemos un sistema de tipos muy estricto, por lo que describimos los datos disponibles en la API. Tenemos tipos, los tipos tienen campos y conocemos el tipo de datos de cada uno de esos campos.

El ejemplo aquí es que tenemos un tipo de proyecto, tenemos campos como nombre, lema y colaboradores. El nombre y el lema son cadenas, los colaboradores son lo que se llama un campo de objeto. Específicamente, este es un campo de matriz de objetos. Entonces este proyecto tiene uno o más usuarios conectados a él. Y aquí es donde entra la parte de Grafo de GraphQL. Los tipos pueden referirse a otros tipos. Pensamos en esto como un campo de relación que conecta el proyecto y uno o más usuarios. Entonces esa es la parte de Grafo de GraphQL. Luego, en el momento de la consulta, el cliente solicita básicamente un recorrido a través de este grafo de datos en el formulario de lo que se llama un conjunto de selección. Entonces aquí estamos buscando solo un proyecto y trayendo de vuelta el lema, pero podríamos atravesar a los colaboradores también y traer información sobre los colaboradores. Esto es bueno para el cliente porque los datos que se devuelven coinciden exactamente con el conjunto de selección de la consulta o la operación de mutación. Por lo tanto, tenemos datos muy predecibles con los que trabajamos cuando usamos GraphQL.

Para facilitar la construcción de API de GraphQL al trabajar con bases de datos, realmente hay un montón, supongo, de integraciones de GraphQL de bases de datos por ahí, y vemos esto en el mundo de SQL. También lo vemos en el mundo de las bases de datos de grafos. Y una de esas es la biblioteca de GraphQL de Neo4j. Por lo tanto, esta es una biblioteca de JavaScript enfocada en la construcción de API de GraphQL respaldadas por Neo4j. Y la idea aquí es que podemos usar definiciones de tipo de GraphQL para definir el modelo de datos para la API, la API de GraphQL, pero también para impulsar nuestra base de datos. Y esto es realmente bueno porque reduce mucho el código repetitivo de obtención de datos que terminamos escribiendo cuando estamos construyendo servidores de GraphQL. También tiene muchas ventajas de rendimiento porque podemos generar una única consulta de base de datos para cualquier solicitud de GraphQL arbitraria. Pero también tenemos algunas características realmente interesantes para cosas como agregar lógica personalizada utilizando el lenguaje de consulta Cypher del que hablamos hace un minuto, características para agregar reglas de autorización en nuestro esquema de GraphQL. Por lo tanto, es una biblioteca muy potente para construir API de GraphQL. Y luego SwiftUI.

¿Alguien ha utilizado SwiftUI antes? Me gustaría saber si hay personas que estén familiarizadas con la construcción de aplicaciones nativas de iOS. Entonces, si no estás familiarizado con SwiftUI, hay dos partes aquí. Una es el lenguaje de programación Swift. Fue creado originalmente por Apple. Es el sucesor de Objective-C. Objective-C era un lenguaje utilizado principalmente por Apple para construir aplicaciones de iOS, Mac y tvOS. Swift se hizo de código abierto, creo que fue en 2012 o tal vez en 2014. Y luego tenemos SwiftUI, que es un marco de interfaz de usuario, específicamente el marco de interfaz de usuario de Apple. Swift en sí mismo es de código abierto. No es exclusivo de Apple. También puedes ejecutar Swift, el lenguaje, en Linux y en aplicaciones de servidor basadas en Linux. Pero SwiftUI es específico de iOS, Mac OS y Apple TV, e incluye un marco de interfaz de usuario para construir interfaces de usuario declarativas. Una de las características interesantes de SwiftUI es la funcionalidad de vista previa. Puedes verlo aquí en la captura de pantalla de Xcode. Anteriormente, teníamos que construir y previsualizar la aplicación en ejecución para ver cualquier cambio. Con SwiftUI, podemos ver los cambios en tiempo real en nuestra interfaz de usuario mientras realizamos actualizaciones. Sí, hablaremos un poco más sobre SwiftUI. B dice que está familiarizado con aplicaciones nativas de iOS. Genial, tienes cierto nivel de experiencia. Eso es bueno.

Genial. Hablemos un poco sobre cómo trabajar con grafos en Cypher, trabajar con grafos en GraphQL, porque creo que hay algunas similitudes allí. Correcto, estamos hablando de grafos en la base de datos. Estamos hablando de grafos en la capa de API. Veamos cómo podemos comparar y contrastar el trabajo con grafos en esas dos partes diferentes de nuestra arquitectura de aplicación.

Entonces, en primer lugar, a un nivel alto, ¿qué es un grafo? Bueno, un grafo es una estructura de datos compuesta por nodos, que son las entidades y las relaciones que conectan los nodos. Para poder trabajar con datos en un grafo, utilizamos un modelo de datos llamado modelo de datos de grafo de propiedades. Y lo que esto significa es que introducimos etiquetas, por lo que las etiquetas describen el tipo del nodo, es una forma de agrupar nodos. Entonces, en ese ejemplo anterior, vimos cosas como el nodo de dirección, el nodo de oficial, esas eran etiquetas que describían qué tipo de nodo es. Y luego tenemos propiedades de pares clave-valor arbitrarios que podemos almacenar en nodos o relaciones. Y estas son los atributos, estos son los valores con los que estamos trabajando. Al igual que las etiquetas, las relaciones tienen un solo tipo de propiedad y una dirección. Entonces, ese es el modelo de datos básico que utilizamos.

Otro término que puedes escuchar con frecuencia es el término grafo de conocimiento. Y el grafo de conocimiento, supongo que me gusta pensar en los grafos de conocimiento como una instancia de un grafo de propiedades. Entonces tenemos algunos datos del mundo real que estamos modelando en un grafo de propiedades. Y el valor de un grafo de conocimiento es que ponen las cosas en contexto. Y cuando digo cosas, supongo que me refiero a una representación canónica de algo, de un valor, de una entidad. Entonces, este ejemplo en la pantalla, esto proviene de nuestro conjunto de datos de noticias con el que vamos a trabajar hoy, que proviene de New York Times. Y así, para cada artículo de noticias, tenemos el tema o tenemos varios temas. Tenemos las personas mencionadas en el artículo de noticias, hay regiones geográficas que pueden ser relevantes para el artículo. Y podemos ver cómo se conectan estos artículos, temas y personas en este grafo de conocimiento de noticias. Entonces, aquí, por ejemplo, tenemos una representación canónica del tema, política y gobierno de EE. UU. Entonces, cuando tenemos un nuevo artículo que trata sobre ese tema, lo conectamos al nodo del tema y podemos ver artículos similares al recorrer el grafo aquí. Entonces, podemos recorrer desde un nodo de artículo hacia otros a través del mismo tema. Y esto también se aplica a nuestras regiones geográficas, si queremos ver todas las noticias sobre una región geográfica específica, si queremos ver todas las noticias sobre una persona en particular y así sucesivamente. El término grafo de conocimiento fue, creo, introducido formalmente cuando Google lanzó el grafo de conocimiento de Google. Y hablaron sobre esta idea de Cosas, No Cadenas, donde tenemos algún contexto, tenemos alguna representación canónica de estas entidades, que creo que es una buena forma de pensar en los grafos de conocimiento.

Entonces, el conjunto de datos que vamos a usar hoy proviene de la API de New York Times. Así que he configurado, veamos en este repositorio, he configurado una especie de trabajo cron utilizando acciones de GitHub para obtener estos datos de la API de New York Times. Entonces, una vez al día obtenemos los artículos más populares, supongo que hay tres tipos, los más populares vistos, los más populares enviados por correo electrónico y los artículos más populares compartidos en redes sociales. Y una vez al día obtenemos eso y lo cargamos en una base de datos de Neo4j Aura utilizando esta acción de GitHub. Y he estado ejecutando esto durante, no sé, probablemente alrededor de un año más o menos. Entonces vamos a usar una instantánea de estos datos para trabajar. Dejaré un enlace a ese repositorio de GitHub. Genial, esos son los datos con los que vamos a trabajar. Hablemos un poco sobre cómo podemos pensar en interactuar con esos datos. Entonces, ¿cómo trabajamos con datos como un grafo en la base de datos? Y también, ¿cómo trabajamos con datos como un grafo en GraphQL?

Entonces, en primer lugar, esta es la API de GraphQL o muy similar a la API de GraphQL que vamos a construir hoy. Y esto se ejecuta sin ninguna autenticación para que cualquiera pueda abrirlo y consultar este conjunto de datos y acercarse un poco más. Entonces, si miramos la pestaña Docs, puedes ver aquí que tenemos consultas, no tenemos mutaciones. Entonces, esto es solo una API de solo lectura. Podemos ver los datos con los que estamos trabajando aquí. Esto es GraphQL playgrounds, que si has usado GraphQL o si has usado la herramienta de sandbox de Apollo Studios, funcionalidad similar basada en la funcionalidad de introspección de GraphQL. Entonces, hay muchas herramientas de desarrollo realmente interesantes para GraphQL. La mayoría de ellas se basan en esta idea de introspección, que es que podemos consultar una API de GraphQL en ejecución para preguntar, Oye, ¿cuáles son los tipos con los que estamos trabajando? Podemos usar esto para generar cosas como documentación que estamos viendo aquí para la API. Entonces conocemos todos los datos disponibles. También está disponible para cosas como, o digamos que también habilita cosas como autocompletar en herramientas de desarrollo, lo cual es bastante interesante. Genial. Entonces aquí hay una consulta. Supongo que esta fue la última consulta que realicé que nos da una buena idea de qué tipo de datos tenemos y cómo podemos construir una consulta de GraphQL. Así que siéntete libre de abrir esto y echar un vistazo a la documentación de la API, intenta escribir algunas consultas de GraphQL para consultar estos datos. Esta es una consulta bastante compleja que creo que muestra algunas características de la API que vamos a construir. Entonces, en primer lugar, comenzamos con el campo de consulta de artículos. Entonces, este es nuestro punto de entrada raíz a nuestras API de GraphQL. Entonces, estamos buscando artículos y el tipo de consulta es un tipo especial en GraphQL. Cualquier campo en el tipo de consulta es el punto de entrada, el nivel raíz de una consulta de GraphQL. Entonces, tenemos que comenzar desde un campo en el tipo de consulta para comenzar nuestro recorrido a través de este grafo de datos. Los otros tipos especiales son mutación y suscripción. Mutación para operaciones de escritura típicamente. Entonces, crear, actualizar, eliminar, ese tipo de cosas. No vamos a ver mutaciones hoy. Las suscripciones son la especialización de GraphQL. Tipos de funcionalidad en tiempo real de pub sub, que tampoco vamos a ver hoy. Nos vamos a centrar principalmente en consultas para nuestra aplicación de noticias. Pero lo que estamos haciendo aquí es que comenzamos en el campo de consulta de artículos. Pasamos un par de argumentos de campo. Entonces, este argumento where es un filtro. Entonces, estamos filtrando los artículos que están conectados al tema del ejercicio y donde los Geos no son nulos para tener alguna información geográfica sobre el artículo. Y luego ordenamos estos por fecha de publicación en orden descendente y traemos los 10 más recientes. Entonces, esto básicamente dice encuéntrame los 10 artículos más recientes sobre ejercicio que tienen algo que ver con alguna ubicación geográfica.

Y luego aquí están los campos que estamos trayendo de vuelta. Así que queremos el título, la URL, y la fecha de publicación del artículo. Queremos saber todas las regiones geográficas a las que está conectado el artículo y luego para cada una de estas geos, puedes ver la anidación en el conjunto de selección aquí. Así que básicamente, esto ocurre cada vez que tenemos anidación en el conjunto de selección, que por cierto, el conjunto de selección es esta parte de la consulta de GraphQL donde estamos definiendo, en primer lugar, una travesía a través del grafo de datos. Entonces, ¿a qué nodos estamos accediendo?, pero también, ¿qué campos estamos devolviendo? Y esos son los dos propósitos principales de un conjunto de selección. Y cada vez que tenemos esta anidación en el conjunto de selección, como ir de las regiones geográficas a, en este caso, los artículos eso es atravesar de un nodo a otro. De todos modos, estamos atravesando desde cualquiera de estas regiones geográficas para encontrar otros artículos en esas regiones geográficas, pero solo tres. Entonces podemos pasar argumentos de campo también en nuestro conjunto de selección, no solo en la raíz. Y para cada artículo, estamos trayendo de vuelta el título. Así que aquí, el primero es un artículo sobre el Ironman y la URL de ese artículo. Tiene algo que ver con Hawái, y luego podemos ver algunos otros artículos sobre Hawái y así sucesivamente para un artículo sobre ciclismo en Brooklyn, y luego algunos artículos sobre Brooklyn y así sucesivamente. Genial, eso da una idea del tipo de data con el que estamos trabajando y el tipo de API de GraphQL que queremos construir. Entonces este será nuestro objetivo construir este tipo de API de GraphQL, implementarla, y luego veremos cómo construir una aplicación nativa de iOS para consultar esta API.

Anthony dice, ¿hay algún truco para obtener resultados cuando visito la URL? Entonces, si abres esa URL, deberías ver, probablemente se verá algo como esto. Estará en blanco, ¿verdad? Así que la mía se cargó con una consulta ya. Y lo primero que puedes hacer con GraphQL Playground es hacer clic en la pestaña Docs. Esto te dará la documentación generada para cualquier API de GraphQL. Esto da una idea de con qué tipo de data estás trabajando y los puntos de entrada. Y luego cada consulta de GraphQL comienza con una llave abierta y cerrada, y luego podemos hacer Control Space para mostrar el autocompletado, en este caso, todos los campos en el tipo de consulta, que son los puntos de entrada. Entonces, podemos seleccionar artículos, y luego vamos a tener otra llave abierta y cerrada porque sabemos que ahora necesitamos un conjunto de selección en nuestra consulta. Y si hago Control Space de nuevo, puedo comenzar a ver los campos disponibles. Y esta es la consulta más simple que podemos ejecutar. Esto devuelve todos los artículos, que probablemente sea más data de la que queremos devolver, no sé, la cantidad de artículos que tenemos, 10,000 o más. Así que prueba, lo dejaré en el chat. Prueba esa consulta, es la forma más simple. A partir de ahí, podemos ver, nuevamente, en la documentación para este campo de artículos. Podemos ver aquí que hay dos argumentos opcionales. Entonces, where y options. Si me desplazo hasta el final aquí, puedo obtener más información sobre el filtrado. Entonces, where son las opciones de filtrado. Y luego, options, eso serán cosas como la paginación. Así que no quiero devolver todos los artículos. Puedo hacer cosas como options, limit 10, pero probablemente también quiero ordenar eso. Así que diremos ordenar por publicación descendente. Y puedes ver que en su mayoría me estoy basando en el autocompletado para decirme qué campos están disponibles. Y luego, también vamos a traer de vuelta la fecha de publicación. Así que esto debería ser las noticias más recientes, solo si nuestro scraper se ejecutó y obtuvo noticias, obteniendo artículos de ayer. Así que supongo que no recogimos los artículos de hoy por alguna razón. Y Anthony dice que está obteniendo un error de sintaxis. Sí, comparte la consulta que estás usando. Podemos intentar depurar eso, si estás obteniendo un error. Dice que lo resolvió, okay, genial. Genial, sí, bueno, esta API, está en funcionamiento. Así que esta es una buena para jugar con algunos data del mundo real. Siempre puedes usarla para ver las noticias del día también, pero veamos cómo podemos trabajar con los mismos data en Neo4j. Veamos, creo que podemos hacer newsscript. News.zone. Oh sí, noté algunos problemas de DNS en esto. Pero tengo una copia de seguridad. Podemos hacer news.graph.fyi. Creo que esa es mi copia de seguridad. Sí, ahí vamos. Así que puedes seguir si quieres en este. Aquí está la URL para este. Esta es una instancia de Neo4j. Y luego, creo que ya inicié sesión en esto, pero el nombre de usuario y la contraseña son simplemente news.graph, todo en minúsculas como esto, o el nombre de usuario y la contraseña. Y este es un usuario de solo lectura. Así que no te preocupes por hacer cambios o eliminar accidentalmente data. Solo tengo permisos de solo lectura. Así que este es el navegador de Neo4j, que es como un banco de trabajo de consultas para interactuar con Neo4j. La idea aquí es que podemos escribir consultas de GraphQL, y luego obtenemos una visualización o tal vez un resultado tabular dependiendo del tipo de data que estamos devolviendo. Así que veamos cómo escribiríamos una consulta similar a esta en Cypher. Entonces, aquí está cómo lo hacemos en GraphQL, para encontrar los 10 artículos más recientes. Veamos cómo lo haríamos en Cypher. Para empezar, vamos a decir match, y luego, match es la palabra clave para encontrar algún patrón y match toma un patrón de grafo. Y, para empezar, si no conozco el modelo de data puedo hacer un call DB.schema.visualization. Entonces, call, esta es una palabra clave de Cypher que va a ejecutar alguna función incorporada o un procedimiento. DB.schema.visualization me dará una vista de grafo de los data con los que estoy trabajando. Hay algunos metadatos adicionales aquí, verás aquí en la perspectiva de Bloom subrayada en la escena de Bloom. Y esto es solo algunos data para una herramienta de visualización.

Podemos ignorar eso, esta es la parte que nos interesa. Y si hago un reinicio de estilo con dos puntos, debería poder ver todas mis leyendas, ahí vamos. Entonces, este es el modelo de datos con el que estamos trabajando. Y esto coincide con lo que vimos en la diapositiva hace unos minutos cuando estábamos hablando de cómo estos datos provienen de la API de New York Times, y estábamos modelando para cada artículo, tenemos las personas, los temas y la región geográfica que menciona el artículo. También tenemos organizaciones. Entonces, es como personas, lugares y cosas, básicamente. ¿Tenemos alguna empresa que se mencione en el artículo? Eso sería una organización. Estas son más o menos las cosas estándar que obtienes cuando ejecutas un modelo de procesamiento del lenguaje natural en un fragmento de texto. Lo bueno es que esto proviene directamente de la API de New York Times. Por lo tanto, no tuvimos que realizar ningún procesamiento del lenguaje natural para encontrar esas cosas. Y luego también tenemos información sobre cualquier imagen, cualquier foto que esté en el artículo. Así que ese es el modelo de datos básico.

Ahora que sabemos eso, podemos comenzar a escribir nuestra consulta. Estamos interesados en encontrar los 10 artículos más recientes. Así que voy a comenzar a construir mi consulta para buscar nodos de artículos. Y comencemos. Vamos a devolver los nodos de artículos. Vamos a ver los primeros 10. Y esta 'a' es una variable que se vincula a una parte del patrón. Lo que está después de los dos puntos es la etiqueta del nodo. En este caso, artículo, lo que está antes de los dos puntos es la variable que se vinculará a esa parte del gráfico que coincide con esa parte del patrón. Y luego podemos hacer referencia a esa variable más adelante en la consulta. Así que aquí estamos diciendo que busque nodos de artículos, devuelva esos nodos de artículos, pero solo dame 10. Y si hago clic en estos, puedo ver las propiedades del nodo. Aquí hay un artículo sobre alguien que ilustró libros para niños. Podemos ver cuándo se publicó, la URL y así sucesivamente. Pero este es un artículo antiguo, queremos el más reciente. Así que agreguemos un orden por 10. Ordenar por a.publicado en orden descendente. En cada uno de mis ordenamientos, el mío va primero. Y luego el límite. Así. Genial. Y así es como obtenemos las noticias más recientes, que son los artículos de ayer. Aquí hay uno sobre Victor Bud. Entonces, esto es lo que el intercambio de prisioneros en Rusia. Y es útil tener algo de contexto sobre estos artículos. Si hago doble clic, entonces comenzamos a recorrer el gráfico. Aquí podemos ver los temas, las regiones geográficas, las fotos conectadas al artículo, y así sucesivamente. Pero no quiero hacer doble clic en las cosas para agregar esta información a mi consulta. Podemos construir un patrón de gráfico más complejo para describir ese recorrido en la consulta. Entonces queremos incluir los temas, luego agregamos una pieza de relación a nuestro patrón de gráfico. Y así, también incluyamos los temas. Y luego, cuando los devuelvo en mi cláusula de retorno, necesito aquí solo estoy viendo los nodos de artículos porque solo estoy devolviendo A. Podríamos agregar T a eso. Agreguemos un asterisco para devolver todo lo que hemos encontrado. Genial, ahora estoy viendo los artículos más recientes y los temas a los que están conectados. Luego podría buscar otros artículos conectados a esos temas también. Y devolver esos. Ya entendemos, podemos comenzar a describir piezas más complejas de nuestro patrón. Genial y esa database nuevamente es pública. Puedes usarla con las credenciales en el chat. Para jugar con este data set. Es divertido, se actualiza todos los días. También podemos usar herramientas visuales para consultar este data como un gráfico. Quiero mostrar una demostración de esta pero Bloom es una herramienta de visualización de gráficos que nos permite explorar o encontrar ideas con visualización de gráficos de forma interactiva sin tener que escribir Cypher. Entonces esta es una buena herramienta si queremos exponer los data digamos a un tipo de analista que tiene algún conocimiento del dominio del data. Tal vez estén haciendo algo como una investigación de detección de fraude o algo así. Si eres un desarrollador familiarizado con Cypher puedes configurar Bloom para incluir algunas consultas Cypher guardadas para análisis más complejos. También podemos usar algoritmos de gráficos con Bloom para hacer cosas como ejecutar PageRank o algoritmos de detección de comunidades con solo unos pocos clics visualmente. Así que esa es una herramienta muy convincente si no estás interesado en escribir Cypher para explorar el conjunto de datos. Bien, hemos visto algunos ejemplos ahora de Cypher y de GraphQL. Creo que es útil comparar estos dos y asegurarnos de usar la herramienta correcta para el trabajo correcto, dependiendo de lo que estemos tratando de lograr, dependiendo de qué parte de nuestra architecture estemos hablando, porque conceptualmente, tanto Cypher como GraphQL están trabajando con gráficos, ¿verdad? Donde estamos consultando e interactuando con datos de gráficos en cada caso. Así que comparemos y contrastemos un poco para ver dónde debemos usar uno y no el otro. Entonces, Cypher es un lenguaje de consulta para bases de datos de gráficos. Dijimos que usamos esta funcionalidad declarativa de coincidencia de patrones donde dibujamos esta especie de representación de arte ASCII de patrones de gráficos. Y luego la base de datos descubre cómo encontrar dónde existe ese data o cómo trabajar con ese data. Cypher incluye, y todas las funciones específicas de la base de datos que esperaríamos, cosas similares a las que encontraríamos en SQL, cosas como funciones de agregación, funciones matemáticas, operaciones de base de datos para cosas como crear índices, incluso importar data desde CSV. Y luego muchas operaciones específicas de gráficos, cosas como un operador de ruta de longitud variable donde intento encontrar la ruta más corta entre nodos, ese tipo de cosas. Si miramos GraphQL, dijimos que GraphQL es un lenguaje de consulta específicamente para APIs, por lo que GraphQL no es un lenguaje de consulta para bases de datos. Veremos por qué en un momento. Y también GraphQL es este runtime para cumplir con las solicitudes de la API. Tenemos un sistema de tipos estricto del que hablamos hace un momento que define específicamente el data con el que estamos trabajando. Y GraphQL modela el data como un gráfico. Está modelando el data de tu aplicación como un gráfico. Entonces GraphQL se puede usar con cualquier backend. Podemos construir APIs de GraphQL sobre múltiples capas de data y combinarlas. GraphQL puede actuar como una capa de federación. Y luego, en el momento de la consulta, describimos un recorrido a través de este gráfico de data de la aplicación que GraphQL nos permite modelar utilizando esta idea del conjunto de selección anidado que vimos antes. Entonces, utilizando nuestro conjunto de datos de artículos, veamos algunos casos de uso y veamos cómo los encontraríamos con Cypher, cómo los encontraríamos con GraphQL. Bueno, esto ya lo hicimos. Muéstrame todos los artículos.

Vimos cómo hacer eso en Cypher mediante la definición del patrón de gráfico simple que estamos buscando que dibuja esta representación de arte ASCII. Estamos interesados en los nodos de artículos, devolviéndolos en GraphQL. Encontramos los puntos de entrada del campo de consulta, en este caso, tenemos uno para los artículos y luego seleccionamos qué campos queremos devolver. En este caso, solo estamos devolviendo el título y el resumen. También vimos esto, dame los artículos más recientes. Entonces, Cypher tiene funcionalidades incorporadas para ordenar, clasificar, paginar, este tipo de cosas.

Ahora, GraphQL no tiene ordenamiento, clasificación, paginación incorporados en GraphQL, pero podemos usar argumentos de campo para modelar este tipo de cosas. Y hay algunas convenciones por ahí sobre cómo hacer esto. Aquí tenemos los argumentos de campo de opciones en el campo de consulta de artículos donde podemos especificar la clasificación y un límite aquí. Así es como podemos hacer paginación de esta manera, y vimos algo similar a esto. Así que muéstrame los 10 artículos más recientes y los temas conectados a esos artículos.

La forma correcta de hacer esto es usar lo que se llama una coincidencia opcional, porque podemos tener algunos artículos que no tienen temas. Entonces puedes ver este nodo de préstamo aquí abajo es un artículo sin ningún tema. Entonces primero necesitamos encontrar los 10 artículos más recientes, y luego podemos recorrer opcionalmente desde esos artículos para encontrar cualquier tema. Si solo incluyéramos el artículo tiene tema, tema como la coincidencia de nivel superior aquí, solo encontraríamos artículos que tienen temas. de todos modos, así es como podemos hacer eso en Cypher en GraphQL, solo agregamos una capa anidada a nuestro conjunto de selección. Entonces aquí hemos agregado temas y nombre para representar ese recorrido desde los nodos de artículos una vez que los encontramos a cualquier tema que pueda existir. Y como temas es un campo nulo, encontraremos artículos incluso si no tienen temas. Entonces aquí está ese aquí, puedes ver el arreglo de temas, este es un arreglo vacío, que es similar en concepto a esta idea de la coincidencia opcional. Entonces, ¿qué tal agregar más complejidad a nuestros patrones de gráfico? Entonces ahora queremos encontrar los 10 artículos más recientes, los temas de esos artículos, pero luego otros artículos conectados a esos temas. Y nuevamente, esto es muy similar al ejemplo que vimos hace unos minutos. Solo agregamos otra pieza a nuestro patrón de gráfico aquí. Entonces ahora, una vez que encontramos los nodos de temas para los artículos de hoy, agregamos otra pieza al patrón para recorrer siguiendo esa relación de tiene tema entrante para encontrar otros artículos que tengan los mismos temas que los artículos de hoy. Y en GraphQL, solo agregamos otro anidamiento a nuestro conjunto de selección aquí para hacer eso. Entonces, dentro del campo de temas aquí, comenzando en la línea siete, en las líneas nueve y diez, ahora estamos recorriendo dos artículos conectados a estos nodos de temas.

Bueno, ¿qué tal algo como esto? Entonces, encuentra el camino más corto entre dos nodos en el conjunto de datos. Aquí queremos encontrar el camino más corto desde la Organización del Servicio de Parques Nacionales hasta la Administración Federal de Aviación. Bueno, Cypher tiene un par de funciones incorporadas aquí que son muy útiles para este tipo de operaciones. Una de ellas es esta idea de un operador de camino de longitud variable. Entonces aquí, tenemos estos corchetes con un asterisco. Sabemos que los corchetes representan relaciones. Esto significa un patrón donde, aquí está nuestro nodo del Servicio de Parques Nacionales, aquí está nuestro nodo de la FAA, nuestros nodos de organización. Si no lo mencioné antes, la forma en que representamos las propiedades en patterns es dentro de llaves. Esto significa encontrar un nodo con una etiqueta de organización que tenga el nombre Servicio de Parques Nacionales, similar para la Administración Federal de Aviación, que son agencias gubernamentales en los EE. UU. Pero este corchete con el asterisco, esto significa encontrar un patrón donde estos dos nodos están conectados, pero conectados por cualquier número de nodos intermedios. Así que sigue tantas relaciones como sea necesario para encontrar una conexión entre estos dos nodos en el grafo. Eso es lo que significa el asterisco. Y puedo parametrizar esto, puedo decir más de dos, pero menos de cinco, como el tipo de cosa que normalmente no queremos tener solo este asterisco abierto, pero ese es el valor predeterminado. Y esto está envuelto en una función de camino más corto. Entonces está diciendo, encuentra donde existe este patrón, estos dos nodos están conectados siguiendo cualquier número de relaciones, pero encuéntrame específicamente el camino más corto que los conecta y específicamente Neo4j realizará una búsqueda binaria en anchura o sí, para encontrar el camino más corto que conecta estos dos nodos y resulta ser bastante corto. Entonces aquí está la FAA, aquí está el Servicio de Parques Nacionales. Hay un artículo sobre la FAA que trata sobre el Servicio de Parques Nacionales. Ambos tratan sobre escasez, que es el tema que conecta estos dos artículos específicamente Creo que se trata de escasez de trabajadores y de tener dificultades para mantener operaciones normales debido a la escasez de trabajadores. Así que es un camino bastante corto que los conecta.

Ahora, si pensamos en cómo escribiríamos esta consulta en GraphQL, bueno, GraphQL realmente no tiene este tipo de funcionalidad incorporada. No hay concepto de ruta de longitud variable. No hay concepto de camino más corto entre dos nodos. Podríamos exponer este tipo de funcionalidad si agregamos campos de consulta que tomen la información necesaria ciertamente podríamos exponer esto a través de GraphQL pero no es algo que esté incorporado.

Aquí hay otro ejemplo. Mostrarme artículos recomendados. Una forma común de abordar esto si estás en la masterclass del martes vimos este concepto de manera similar para películas pero una forma común de hacer esto es recorrer el grafo para encontrar superposiciones en este caso temas o regiones geográficas o el autor. Entonces, si estoy interesado en un artículo que estoy leyendo que tiene ciertos temas muéstrame otros artículos que traten sobre temas similares si tienen la mayor cantidad de temas superpuestos esa es probablemente la recomendación mejor clasificada. ¿Cómo haríamos lo mismo en GraphQL? Bueno, GraphQL realmente no tiene este tipo de funcionalidad incorporada. Por supuesto, podríamos agregar un campo de consulta que exponga esta funcionalidad. Lo construiríamos en alguna capa de datos pero no es algo incorporado en GraphQL.

Entonces, al pensar en cómo diseñar nuestra aplicación sabemos que queremos construir una aplicación móvil que nos permita leer las noticias más recientes, personalizar un poco las noticias, ¿o deberíamos consultar directamente la base de datos? ¿Queremos usar GraphQL para eso? Bueno, al analizar las diferencias entre Cypher y GraphQL sabemos que no queremos exponer directamente la base de datos a nuestro cliente pero eso no es típicamente lo que queremos hacer en la mayoría de los casos. Queremos construir una capa de API intermedia que se encuentre entre el cliente y la base de datos que nos permita manejar cosas como la autorización, el almacenamiento en caché, la lógica personalizada, este tipo de cosas que queremos controlar en esta capa de API. Entonces, nuestra arquitectura debería verse algo como esto donde nuestra aplicación iOS realiza consultas a una API de GraphQL en este caso tal vez se implemente como una función Lambda o algo así. Y esa capa de API, ese servidor de GraphQL es lo que realiza consultas a nuestra capa de base de datos.

Entonces, hablemos de cómo construimos un servicio GraphQL. Existe un enfoque estándar que podemos seguir. Uno de ellos es comenzar con nuestras definiciones de tipos de GraphQL. Definimos los datos con los que estamos trabajando y luego necesitamos implementar funciones de resolución. Las funciones de resolución son funciones que contienen la lógica para obtener datos de la capa de datos, ya sea la base de datos o otra API. Luego combinamos las definiciones de tipos y las funciones de resolución para tener lo que se llama un esquema GraphQL ejecutable, que luego podemos exponer a través de una capa de red para manejar las solicitudes entrantes. Aquí hay un ejemplo. Esto proviene de una aplicación que se construyó para mostrar sesiones de conferencias. Puedes ver algunas definiciones de tipos a la izquierda que describen los tipos con los que estamos trabajando. Tenemos un tipo para la sesión de conferencia. Tenemos un tipo para el orador que está conectado a la sesión. Y luego cosas como ¿para qué empresa trabaja el orador? ¿En qué sala se encuentra la sesión? ¿Cuál es el tema de la sesión? Entonces, nuestras funciones de resolución podrían verse así a la derecha, donde tenemos un mapa de funciones que coincide con las definiciones de tipos. Para el punto de entrada, no estamos mostrando el campo de consulta a la izquierda, pero para el punto de entrada, tendríamos un campo de sesión en el tipo de consulta. Ese es el resolvedor raíz. En este caso, comenzamos buscando una sesión con una cadena de búsqueda. Imagina un sitio web donde escribes, ya sabes, GraphQL o lo que sea, cualquier tipo de sesiones en las que estés interesado. Y esto está utilizando un ORM que se inyecta en este objeto de contexto. El objeto de contexto se pasa a cada función de resolución. Aquí es donde podemos agregar controladores a API o bases de datos, o a menudo podemos tener otra capa de abstracción de datos que usamos en nuestras resoluciones. Pero aquí estamos obteniendo ese controlador de base de datos para algún tipo de envoltura ORM aquí para buscar sesiones por una cadena de búsqueda. Pero luego, cuando los resultados de esa consulta regresan, encontramos algunas sesiones que coinciden con nuestra cadena de búsqueda, bueno, entonces tenemos que volver a la base de datos para averiguar en qué sala se encuentra. Tenemos que volver a la base de datos para averiguar el tema de la sesión. Y luego, otra función de resolución, si la hemos solicitado para recomendaciones o algo así, qué sesiones son similares a las que hemos buscado, eso podría ser una operación bastante costosa dependiendo de cómo lo estemos haciendo. Y tenemos que hacer estas tres cosas para cada sesión que regrese de nuestros resultados de búsqueda, por lo que podrían ser muchas y muchas consultas a la base de datos. Y esto es lo que se llama el problema de la consulta N más uno, esto surge cuando seguimos ese enfoque estándar para construir API GraphQL. Y hay algunas formas de solucionar esto. La que veremos mucho es llamada DataLoader, que es una combinación de agrupación y almacenamiento en caché para tratar de reducir el número de solicitudes a la base de datos. Otra opción es usar estas integraciones de bases de datos que generan una sola consulta a la base de datos a partir de una solicitud de GraphQL, que es lo que haremos hoy cuando usemos la biblioteca Neo4j GraphQL. Pero también surgen otros problemas, ¿verdad? Esta es una gran cantidad de código de obtención de datos de plantilla que estamos escribiendo. No necesariamente queremos centrarnos en eso como desarrolladores, queremos centrarnos en cosas donde realmente podemos agregar un poco más de valor. Cosas como la duplicación de esquemas, mapeo y capa de traducción para no usar gráficos en el backend y nuestros resolutores, tenemos que pensar cómo mapear desde el modelo de gráfico que estamos usando en GraphQL a algún otro modelo de datos. Aquí es donde entran en juego las integraciones de bases de datos como la biblioteca Neo4j GraphQL. Entonces, en este caso, veremos cómo podemos tomar solo las definiciones de tipos y generar una API GraphQL completamente funcional sin escribir ninguna función de resolución. Pero para hacer eso, primero necesitamos comenzar con una base de datos. Y en esta sección, lo que haremos es iniciar una instancia gratuita de Neo4j Aura, cargada con algunos datos de noticias, y luego podremos comenzar a construir nuestra API GraphQL. Así que configuremos todos nuestra instancia de Aura. Hay dos cosas que haremos aquí. Una es iniciar sesión en Aura, puedes crear una cuenta con inicio de sesión de Google o nombre de usuario y contraseña, correo electrónico y contraseña si no quieres usar Google. Y luego cargaremos un archivo de volcado de base de datos, una instantánea de esos datos de noticias, para que todos tengamos el conjunto de datos cargado y listo para usar. Lo primero que haremos es ir a neo4j.com/aura y verás un botón de inicio de sesión gratuito. Así que ve y ábrelo, inicia sesión en Aura. Lo primero con lo que se te pedirá es la opción de iniciar una base de datos. Verás diferentes opciones, lo explicaré en un momento, para que todos podamos ver cómo se ve. Opciones para cargar diferentes conjuntos de datos, así que hay uno para películas, uno para ejemplos de Stack Overflow, pero queremos crear una base de datos en blanco, vamos a cargar nuestros propios datos. Y luego verás que aparece una contraseña generada, asegúrate de copiarla, pegarla en algún lugar, la necesitaremos más adelante. También puedes descargar un archivo .env desde esa pantalla, así que es una buena idea también, solo para descargarlo y tenerlo. Y luego veremos la URI de conexión, la cadena de conexión para tu instancia de Aura también, que es algo que anotaremos para más adelante. Una vez que hayas hecho eso, luego vamos a descargar este archivo de volcado, dejaré un enlace en el chat también. Así que esta es una instantánea de los datos de Newsgraph, y luego lo importaremos en nuestra instancia de base de datos de Neo4j Aura. Así que hagamos eso. Si haces clic en tu instancia en la consola, ve a importar base de datos, verás un lugar para arrastrar y soltar o seleccionar el archivo de volcado para importar. Así que hagamos eso. Así que tenemos nuestros datos listos para usar. Lo haré ahora para que puedas ver cómo se ve, y luego haremos un descanso de un par de minutos para asegurarnos de que todos estén configurados y listos para comenzar. Así que voy a ir a Neo4j.com/aura y hacer clic en iniciar sesión gratuito. Y verás diferentes niveles para Aura. Así que está el nivel gratuito, que es bueno para talleres o proyectos de hobby. Y luego está el nivel profesional, donde podemos comenzar a escalar nuestra base de datos si tenemos implementaciones de producción, conjuntos de datos más grandes con los que queremos trabajar. Y luego, por supuesto, está el nivel empresarial si necesitamos más funciones para eso. Voy a iniciar sesión. Como dije, podemos usar Google o puedes crear una cuenta con correo electrónico y contraseña. Voy a usar Google, ya que es lo suficientemente fácil para mí. Y luego, oh, tengo una instancia en ejecución. Voy a detener esa. Eso es de, creo que es nuestra instancia del taller del martes. Así que voy a detener eso. Pero si no has iniciado sesión en Aura antes, no verás eso. En su lugar, verás una pantalla que dice comenzar seleccionando un conjunto de datos. Y si seleccionamos uno de estos, ya tendremos un conjunto de datos cargado, pero quiero esta instancia vacía. Voy a decir que la cree. Voy a descargar el archivo .env y voy a copiar mi contraseña y guardarla en algún lugar para tener acceso a ella más tarde. Sí, y siempre es importante asegurarse de tomar eso antes de hacer clic fuera de la pantalla, ya que no podemos encontrar esa contraseña inicial nuevamente.

De acuerdo, esto tomará unos momentos. Mientras tanto, voy a descargar este volcado de noticias. Así que copiemos eso. Y esto simplemente descargará un archivo zip desde S3. Es bastante pequeño. Creo que solo tiene alrededor de 10 megabytes o algo así. Y luego, una vez que mi instancia de Aura esté en funcionamiento, lo cual tomará un minuto más o menos, podremos importar nuestro volcado de noticias.

Una vez que tengamos eso en funcionamiento, tendrás una vista previa de hacia dónde nos dirigimos con esto, y luego haremos una pausa de unos minutos. Esto cargará los conjuntos de datos de NewsGraph. Estoy en las instantáneas, por lo que no tiene las noticias más recientes. Es de no estoy seguro de cuándo lo tomé, tal vez hace un mes aproximadamente, pero el mismo modelo básico de datos. Así que artículos, autores, temas, personas, organizaciones y regiones geográficas sobre noticias de la API de New York Times. He proporcionado el enlace para la API de New York Times. Es gratuita, solo necesitas solicitar una clave de desarrollador para trabajar con estos datos. Es un buen conjunto de datos para construir aplicaciones. También tienen cosas como reseñas de libros y otros. Creo que tienen su propio grafo de conocimiento para obtener más información sobre personas, este tipo de cosas. Pero si estás interesado en obtener más información sobre este conjunto de datos, este repositorio de GitHub, al que proporcionaré un enlace en el chat. Tiene el código que mostré anteriormente, la Acción de GitHub para obtener estos datos. Pero también hay algunos ejemplos de cómo trabajar con los datos en Cypher. Hay un directorio de graphQL, que veremos en un momento. Y también hice un taller sobre cómo construir una API de Cloudflare workers para obtener estos datos. De todos modos, todo eso está en línea.

Veamos, ¿nuestra instancia de Aura aún no está lista? Entonces tal vez hagamos una pausa aquí durante unos minutos para que todos tengan la oportunidad de iniciar sesión en Aura, crear una nueva instancia en blanco, descargar el archivo de volcado. Y esperaremos unos minutos para que se inicie y luego cargaremos ese conjunto de datos. Así que haremos una pausa aquí durante unos minutos. Tal vez volvamos a las 15 después de la hora. Eso es en cuatro minutos. Así que si tienes algún problema, avísanos en el chat y lo resolveremos porque queremos tener nuestra instancia de Aura con nuestro conjunto de datos cargado antes de continuar.

Mientras esperamos, repasaré los pasos aquí. Ahora que la mía está en funcionamiento, podemos ver que está en funcionamiento porque vemos este círculo verde que dice en ejecución. Así que voy a hacer clic en esto y puedo ver algún código de ejemplo y demás, pero quiero ir a importar la base de datos. Puedo arrastrar y soltar o hacer clic, ups, eso no era lo que quería hacer clic. Por eso tengo un conjunto de datos más grande. Voy a hacer clic en esto y buscar y esto se descargó en mi carpeta de descargas News-Graph, el mío tiene el número tres porque esta es la tercera vez que lo descargo. Se llama News-Graph.dump. Advertencias reemplazará mi base de datos vacía. Sí, está bien. Y esto tomará unos minutos para cargar y luego reiniciar la base de datos, pero está bien. Ahora haremos una pausa para que todos tengan la oportunidad de seguir este proceso y configurar su instancia de aura y luego, cuando regresemos, veremos cómo construir una API de GraphQL.

Veo una pregunta de Anthony. Oh sí, hablando sobre la nueva interfaz de usuario y aura que no tiene una opción para cargar un archivo de volcado, solo CSV. Sí, veamos eso. Eso es un buen punto. Entonces hay un nuevo espacio de trabajo. Creo que se llama experiencia de espacio de trabajo para Neo4j aura. Y es posible que, creo que ahora es el valor predeterminado. Entonces tienes este botón de abrir, que mi base de datos se está reiniciando. Así que no se cargará en este momento. De lo contrario, y luego puedes alternar entre esto. Si hago clic en mi icono de usuario, dice que estoy usando la nueva experiencia de espacio de trabajo. O puedo volver a la experiencia clásica donde tengo cosas como explorar consulta importar. Así que eso es algo en lo que podemos alternar entre ellos. Hablaré sobre eso en un segundo, es básicamente una forma diferente de combinar cosas como Neo4j browser, Bloom y una opción de importación de datos.

Así es como se ve. Si hago clic en abrir, me llevará a un espacio de trabajo y puedo conectarme a mi instancia. Y Anthony, si estás viendo la importación, esa es la opción para cargar archivos CSV. Pero lo que quiero hacer para cargar un archivo de volcado es hacer clic en la tarjeta. Como debería haber dicho antes, no hacer clic en el icono de abrir, pero si hago clic en la tarjeta de la base de datos, entonces obtengo esta pantalla. Y aquí puedo ir a importar la base de datos y hacer clic en buscar para encontrar mi archivo de volcado. Entonces, si te encuentras en esta pantalla, si te encuentras en esta pantalla que es la importación para cargar archivos CSV, esa no es la que queremos, donde, esta es la herramienta de importación de datos, que es realmente genial, una forma de definir visualmente un modelo de gráfico a partir de archivos CSV, lo cual es bastante interesante. La barra de consulta, esto es similar a Neo4j browser, tenemos funcionalidad similar aquí y luego explorar. Esta es la herramienta de visualización de bloom, que mostré un par de capturas de pantalla antes. Entonces, la nueva interfaz de usuario del espacio de trabajo, la idea es combinar, lo que antes eran diferentes herramientas para desarrolladores en una sola herramienta para desarrolladores. De todos modos, sí, lo que queremos es volver a la consola de Aura, hacer clic en la tarjeta de nuestra base de datos y buscar la opción de importar la base de datos. Genial, Anthony, genial, dice que lo descubriste. Genial, ¿alguien más tuvo algún problema? ¿Hay alguien más que haya terminado, alguien más que haya podido iniciar su instancia de Aura y luego cargar el archivo de volcado? Avísanos si lo lograste o incluso si no lo lograste, si tienes algún problema. Una vez que los datos estén cargados, verás el número aquí para los nodos, ¿qué tenemos? Tenemos 31,000 nodos y 80,000 relaciones. Y verás un porcentaje de, ¿qué es esto, 200,000 y 400,000? Entonces, la capa gratuita tiene un límite en el tamaño de los datos que podemos almacenar.

Entonces puedes ver que nuestro conjunto de datos de noticias con el que estamos trabajando es bastante pequeño. Así que tenemos mucho más espacio en nuestro nivel gratuito, pero ese es el límite en el número de nodos y relaciones solo porque estamos usando el nivel gratuito. Si usamos el nivel profesional, podemos elegir escalarlo por memoria para los diferentes tamaños de instancia. Genial, no veo que nadie más diga que está atascado. Así que volvamos a las diapositivas aquí y hablaremos sobre el conjunto de datos. Ya hablamos un poco sobre el conjunto de datos. Hablé un poco sobre de dónde proviene los datos. Enlacé esa página de GitHub. Dije que estamos usando GitHub Actions para hacer esto. Específicamente, estamos usando esta acción que escribí llamada grafo plano. Entonces, plano es una Acción de GitHub que el equipo de código abierto de GitHub publicó para obtener datos de API JSON o de una base de datos y luego verificarlo en el repositorio de GitHub. Y grafo plano fue una acción que escribí que simplemente te permite escribir una consulta Cypher para definir cómo quieres trabajar con esos datos. Entonces, ya sabes, en nuestro caso, estamos usando esos datos JSON que la Acción de GitHub plano obtiene para nosotros y luego verifica en el repositorio. Luego, con el grafo plano, simplemente escribimos una consulta Cypher que dice cómo queremos cargar esos datos en, en este caso, una instancia de Neo4j Aura. Pero puedes apuntarlo a cualquier instancia de Neo4j. Así que pensé que era una forma práctica de configurar una tarea cron para obtener periódicamente datos, cargarlos en una instancia de Aura, lo cual fue bastante divertido. También tengo esto funcionando para lobsters. Si conoces lobsters, es un sitio de noticias tecnológicas similar a hacker news, pero creo que un poco más amigable. Así que también obtuve los artículos del día en lobsters usando esa misma opción de grafo plano. Y luego escribí un par de publicaciones de blog sobre cómo hacer eso. Aquí está, tenemos... Sí, aquí está. Es solo una pequeña herramienta de visualización que escribí. Esto también utiliza GraphQL para brindarnos una representación visual de los artículos de lobsters del día. Entonces, esto consulta una API de GraphQL para renderizar esta visualización. De todos modos, eso es un poco aparte.

Veamos, tuvimos un ejercicio aquí para escribir una consulta de recomendación. Tal vez repasemos esto para recopilar ya que tal vez estemos un poco cortos de tiempo. Hagámoslo rápidamente. Y esto también asegura que podamos trabajar con nuestra Aura data y asegurarnos de haber cargado los data correctamente.

Ahora voy a hacer clic en este botón Abrir y esto lanzará el espacio de trabajo. Y de nuevo, creo que esto es lo predeterminado. Entonces, si estás usando Aura por primera vez, creo que todos verán eso, pero también puedes ver esta opción Explorar Importaciones de Consulta. Entonces puedes hacer clic en Consulta, lo que te llevará a Neo4j Browser o si estás usando el nuevo espacio de trabajo, simplemente haz clic en Abrir y eso te pedirá tu contraseña de Neo4j, que apareció en la pantalla. Eso es lo que tuvimos que hacer clic para decir, sí, guardé eso, genial. Y creo que por defecto, primero nos lleva a Explorar, que es la herramienta de visualización, pero queremos Consulta porque vamos a escribir algunas consultas Cypher. Y lo primero que podemos hacer es asegurarnos de tener el conjunto de datos correcto. Voy a hacer una llamada a db.schema.visualization. Y podemos ver que este es el mismo conjunto de datos con el que estábamos trabajando antes. Y aquí está la consulta que escribimos antes para encontrar las noticias del día, ordenadas por fecha de publicación en orden descendente, muéstrame la hora más reciente, así que aquí están los artículos de noticias más recientes. Oh sí, y veamos, esto es de junio. De acuerdo, así que este archivo tiene unos meses de antigüedad en este punto, así que tenemos algunas noticias antiguas. Pero está bien, es el mismo modelo de data. Y podemos hacer doble clic para explorar el gráfico.

Pero bueno, el ejercicio para esto es, dado un artículo, escribe una consulta Cypher para encontrar artículos similares. Así que tenemos varias ventanas de espacio de trabajo, vamos a cerrar esas. Aquí está la que queremos. De acuerdo, así que dado un artículo, digamos límite uno. Así que supongamos que estamos trabajando con un artículo. Aquí está Gerber Baby, ¿qué dice eso? Eso es como el modelo de comida para bebés, de acuerdo. De hecho, hay varios artículos sobre comida para bebés en nuestro conjunto de datos. De acuerdo, vamos a escribir una consulta de recomendación de artículo sobre comida para bebés aquí. Así que si estoy leyendo este artículo sobre comida para bebés en nuestra aplicación, es posible que queramos mostrar otros artículos que al usuario le puedan interesar basados en el artículo que están leyendo actualmente. Así que desplazas el artículo, llegas al final. Y la pregunta ahora es cómo puedo mostrar más artículos para que el usuario los lea. Probablemente estén interesados en leer cosas similares a las que han hecho clic y leído. Entonces, ¿cómo podemos escribir una consulta Cypher para encontrar artículos similares a este que estamos viendo? Así que voy a cambiar este return por un WITH. WITH nos permite pasar los resultados a través de mi Cypher, partes posteriores de mi consulta Cypher. Y vamos a hacer otro MATCH. Y vamos a decir, así que aquí está A, este es el nodo del artículo. Y lo que vamos a hacer es buscar otros artículos que tengan temas similares, o el mismo tema más bien. Aquí. Y vamos a llamarlo rec, así que este es nuestro artículo recomendado. Así que aquí están los artículos que tienen al menos un tema en común con nuestro artículo Gerber Baby. Pero también podemos puntuarlos. Así que podemos usar una función de agregación de conteo para calcular una puntuación. Entonces, en Cypher, cada vez que usamos una función de agregación junto con algún valor, implícitamente agrupamos por el valor que estamos devolviendo junto con la función de agregación. En SQL, escribirías específicamente una declaración group by para hacer esto. Si miramos en la tabla, resultado, y vamos a devolver rect.title. Así es un poco más obvio. Entonces, en este caso, la puntuación es uno. Siempre encontramos solo un tema en común. Así que la puntuación no ayuda mucho ahí, pero ¿podemos agregar tal vez algunas otras... piezas al patrón aquí? No, todavía obtenemos, solo obtenemos uno. Así que una cosa que es buena es que podemos agregar otras piezas aquí. ¿Hay organizaciones mencionadas? ¿Hay personas mencionadas? Podemos hacer esta tubería, que se convierte en una operación OR. Aquí vamos, encontramos uno. Así que hay varios artículos sobre, supongo que sobre Gerber. Ya que agregamos la organización. Así que ahora este artículo tiene una puntuación de dos porque tiene una organización y un tema en común. Así que esta es nuestra recomendación mejor valorada para un artículo de seguimiento que un usuario puede leer. Y por supuesto, esto va a ser diferente. Hicimos algo así como un, hagamos un skip y un límite aquí para encontrar otros artículos. Encontremos algo que no sea sobre armas y tiroteos masivos. De acuerdo, y ordenemos por, ordenemos por puntuación. Queremos mostrar las mejores recomendaciones primero. Así que aquí hay algunos artículos sobre café y cafeína y cucarachas, varias cosas relacionadas con la salud. Así que esta consulta debería ser buena para una consulta de recomendación de artículos de propósito general. Y luego usaremos esto más adelante para agregar algo de personalización a nuestra aplicación de noticias. Genial.

Así que veamos dónde estamos ahora. Hicimos eso. Ahora estamos listos para construir una API de GraphQL. ¿Alguien tiene alguna pregunta antes de pasar a la siguiente sesión? Siempre puedes hacer preguntas en el chat, pero solo quiero mencionarlo. Ah, y también estoy mirando Discord. Así que si preguntas en Discord, también podemos hacer eso, pero solo asegúrate de que esa opción esté disponible para todos. Si te quedas atascado en algo o quieres aclarar algo o quieres profundizar más en un tema en particular, no dudes en preguntar en el chat.

De acuerdo. Ahora hablemos de cómo construir una API de GraphQL una vez que tenemos nuestra database configurada. Ya hemos cargado nuestros datos de artículos de noticias, nuestro grafo de conocimiento de noticias. Veamos cómo podemos construir ahora una API de GraphQL para exponer esos datos a la aplicación de nuestros clientes.

Hemos hablado de la biblioteca GraphQL de Neo4j un par de veces ahora. La utilizaremos para construir una API de GraphQL sobre la instancia de Neo4j Aura que cada uno de nosotros configuró y estableció recientemente.

Hablemos un poco sobre algunas de las características de la biblioteca GraphQL de Neo4j y cómo se relaciona con lo que estamos intentando hacer al construir nuestra aplicación de noticias. En primer lugar, el objetivo principal de la biblioteca GraphQL de Neo4j es admitir esta idea de desarrollo basado en GraphQL. La idea es tomar nuestras definiciones de tipo GraphQL que definen el modelo de datos para nuestra API de GraphQL, pero también para la database. Estamos definiendo el modelo de datos para la database con definiciones de tipo GraphQL. Ahora, no necesariamente queremos exponer todos los datos de nuestra database. Tal vez queremos agregar algunas reglas de autorización. Tal vez queremos ajustar algunos de los mapeos para cómo estamos exponiendo los datos. Y podemos hacer eso agregando directivas de esquema a nuestras definiciones de tipo GraphQL. Las directivas de esquema son el mecanismo de extensión incorporado de GraphQL para indicar, `oye, aquí debería haber alguna lógica personalizada`.

Veremos algunas de estas. Aquí tenemos una directiva de exclusión. Piensa en una directiva como una especie de anotación en un campo o en un tipo. Esta directiva de exclusión es específica de la biblioteca Neo4j GraphQL. Y esto significa excluir las siguientes operaciones en la API generada para el tipo de artículo. Por lo tanto, excluimos las operaciones de creación, actualización y eliminación. Debido a que no estamos agregando datos a nuestra API de GraphQL, nuestra aplicación de lectura de noticias será solo una aplicación de lectura. No queremos que los usuarios puedan realizar actualizaciones en la base de datos desde la aplicación. Por lo tanto, vamos a excluir cualquier operación de mutación.

También necesitamos agregar la directiva de relación a los campos de relación, es decir, los campos que conectan tipos, para incluir la dirección de la relación en Neo4j. Cuando hablamos anteriormente del modelo de grafo de propiedades, mencionamos que el modelo de grafo de propiedades incluye una dirección para cada relación. También podemos especificar el tipo de relación, lo cual es útil porque tenemos convenciones diferentes para la nomenclatura en el modelo de grafo de propiedades que usamos con Neo4j y en GraphQL. Aquí estamos diciendo que el campo de foto que es un campo de relación en la base de datos y se representa como `has photo in`, ¿cómo se llama esto?, snake case, mientras que en GraphQL, normalmente usamos camel case. Esto nos permite tener un mapeo diferente de cómo queremos exponer esos datos como un campo en GraphQL a cómo queremos almacenar esos datos en la base de datos.

El concepto aquí es que las definiciones de tipo de GraphQL definen la API de GraphQL, pero también la base de datos. Y configuramos las APIs generadas. Vamos a generar una API de GraphQL utilizando la biblioteca Neo4j GraphQL. Configuramos esto utilizando directivas de esquema, que son estas anotaciones en nuestras definiciones de tipo. Entonces, la biblioteca Neo4j GraphQL va a generar automáticamente una API de GraphQL a partir de nuestras definiciones de tipo. Por lo tanto, esto se considera como una ampliación de las definiciones de tipo para incluir cosas como la consulta o los campos de mutación, los argumentos que vimos anteriormente para cosas como el ordenamiento, la paginación, el argumento de filtro. Y luego agregar tipos que son nativos en la base de datos. Cosas como el tipo de punto geoespacial o el tipo de fecha que tenemos en la base de datos, agregar esos a nuestro esquema en GraphQL. Luego, en el momento de la consulta, la biblioteca Neo4j GraphQL va a traducir o generar una consulta de base de datos a partir de cualquier solicitud de GraphQL arbitraria. Aquí estamos buscando los 10 artículos más recientes, algunos campos en el nodo de artículo, los temas. Eso se traducirá automáticamente con los resolutores generados a esta declaración de CYPHER. Esto va a obtener exactamente los datos que necesitamos de la base de datos.

Hasta ahora, hemos estado hablando de operaciones CRUD básicas, como crear, leer, actualizar y eliminar, por lo que hemos omitido las mutaciones. Pero, ¿cómo tratamos con la lógica personalizada? Bueno, para eso, podemos usar otra directiva de esquema, la directiva de esquema Cypher GraphQL, donde podemos anotar un campo en nuestras definiciones de tipo GraphQL con una directiva de esquema y adjuntar una declaración Cypher que define la lógica personalizada. Ahora hemos agregado un campo similar en el tipo de artículo. Ahora estamos utilizando esta declaración Cypher, que utiliza una función de ciencia de datos de grafo llamada similitud de Jaccard para calcular la similitud de Jaccard de los artículos y generar recomendaciones. Esta es otra forma de generar recomendaciones personalizadas. Anteriormente vimos esta consulta donde encontrábamos recomendaciones para un artículo recorriendo el grafo. Imagina que queremos agregar esta funcionalidad a nuestra API para exponer lógica personalizada. Tomaríamos esta consulta Cypher y la agregaríamos en nuestras definiciones de tipo GraphQL para exponer esa funcionalidad a través de nuestra API GraphQL.

Entonces hay dos formas de comenzar con la biblioteca Neo4j GraphQL. Una es construir una aplicación de servidor NodeJS GraphQL y luego usar un servidor GraphQL como Apollo server, GraphQL yoga. Cualquier implementación de GraphQL en JavaScript funcionará o podemos usar una especie de herramienta de bajo código en el navegador para el desarrollo y testing llamada la caja de herramientas Neo4j GraphQL. Esto es lo que parece para construir un servidor NodeJS GraphQL con la biblioteca Neo4j GraphQL. Vamos a instalar nuestras dependencias, como la biblioteca Neo4j GraphQL y no necesitas seguir los pasos. Vamos a usar un code sandbox que ya tiene esto configurado para nosotros en un minuto, solo mostrando cómo comenzaríamos. Hay algunas dependencias que necesitamos instalar como la biblioteca Neo4j GraphQL de MPM. Necesitamos la implementación de referencia de GraphQL en JavaScript y el controlador Neo4j. Esas son dependencias mutuas de la biblioteca Neo4j GraphQL, por lo que el controlador JavaScript de Neo4j nos permite hacer una conexión a nuestra instancia de Neo4j desde nuestro código en JavaScript. Y luego cualquier servidor GraphQL que vayamos a usar, aquí estamos usando Apollo server.

Mohammed se disculpa por unirse tarde. Oh, sí, no te preocupes. Gracias por unirte, estamos construyendo una aplicación de lectura de noticias para iOS. Deberías poder ver las diapositivas y los diversos repositorios vinculados en el chat, si quieres seguir el proceso. Sí, gracias por unirte, no te preocupes.

Aquí está el fragmento básico ahora para usar la biblioteca Neo4j GraphQL. Básicamente, importamos esas dependencias, el primer paso es definir nuestras definiciones de tipo GraphQL. Aquí estamos usando películas y actores. Luego creamos una instancia del controlador con las credenciales de conexión para nuestra instancia de Neo4j. Pasamos las definiciones de tipo y nuestra instancia del controlador. Cuando instanciamos el Neo4j GraphQL, esto nos da un objeto de esquema de Neo4j, que luego podemos pasar a Apollo Server para iniciar nuestra API de GraphQL. Así que esa es una forma de construir un servidor Node.js GraphQL.

La otra opción, que es realmente buena para pruebas y desarrollo, es utilizar esta herramienta llamada GraphQL Toolbox, que es una herramienta de bajo código para trabajar con la biblioteca Neo4j GraphQL y Neo4j. Entonces vamos a empezar con esta, y esto tiene una característica de introspección realmente poderosa. Como estamos comenzando con una base de datos, podemos cargar definiciones de tipo que coincidan con la base de datos sin tener que escribirlas automáticamente. Así que vamos a abrir GraphQL Toolbox, y eliminar esta parte de las instrucciones. Eso ya no es relevante. Entonces lo que vamos a hacer es abrir GraphQL Toolbox. Aquí está la URL, la dejaré en el chat. Así que lo abriremos. Y lo primero que veremos es una solicitud de a qué base de datos queremos conectarnos. Y aquí es donde vamos a usar nuestra instancia de Neo4j Aura. Así que aquí vamos a volver a la consola de Aura y esta URI de conexión. Entonces, sea cual sea eso para tu instancia de base de datos, copiémoslo. Y luego el nombre de usuario por defecto será Neo4j. Y luego tu contraseña para tu instancia. De acuerdo, genial. Y esto tiene algunas definiciones de tipo de un proyecto anterior en el que estaba trabajando, pero verás un cuadro que pregunta si quieres inspeccionar tus datos. Así que haz clic en eso para inspeccionar los datos. Lo que hará es ir a los datos de la base de datos sobre los artículos de noticias y generar definiciones de tipo GraphQL que coincidan con los datos que tenemos en la base de datos. Así que veremos un tipo para el artículo, un tipo para las regiones geográficas, un tipo para organización, persona, foto y tema y las conexiones entre ellos, esos campos de relación. Y por defecto, algunos de estos nombres no tienen mucho sentido. Así que la convención es usar el nombre del tipo de relación combinado con la etiqueta del nodo para los nombres de campo. Cosas como artículo sobre geos geos, eso no tiene mucho sentido. Podemos cambiar esto, este es solo nuestro punto de partida inicial. Podemos cambiar esto a geos, podemos cambiar esto a organización, podemos cambiar esto a personas y así sucesivamente para algo que tenga más sentido. Y luego si presionamos este botón de construir esquema, eso ahora va a pasar por el proceso de generación de esquema y genera una API de GraphQL basada en esas definiciones de tipo. Y podemos ver las operaciones. Esta es una consulta de un proyecto anterior y la eliminé. Pero podemos ver los puntos de entrada aquí. Este es un Explorador de GraphQL. También puedes alternar la documentación si quieres ver la vista de documentación, pero el Explorador de GraphQL nos permite ver los campos de consulta y las diversas opciones disponibles para construir un conjunto de selección. Así que queremos probablemente la fecha de publicación, el título y la URL del artículo. Queremos limitar, así que necesitarás los primeros 10 y vamos a ordenar por publicación descendente. Puedes ver cómo, a medida que voy haciendo clic aquí en el Explorador, se va construyendo esa consulta en el editor de consultas. Vamos a ejecutar eso y deberíamos ver los artículos más recientes en la base de datos. Si abro las herramientas de desarrollo, iré a la consola de JavaScript. Y también necesitamos habilitar el modo debug. y luego construir mi esquema de nuevo. Pero ahora cuando ejecuto las consultas, ampliaré un poco la consola de desarrollo. Cuando ejecuto las consultas, puedo ver las declaraciones Cypher generadas. Así que aquí están las declaraciones Cypher generadas para esta consulta GraphQL. Así que esto es realmente bueno para el desarrollo. Puedo ver qué consultas de base de datos se generan para las consultas GraphQL que estoy ejecutando. Genial, bueno, hagamos una pausa aquí para que las personas configuren GraphQL Toolbox, lo apunten a su instancia de Neo4j Aura y escriban algunas consultas. Si ya has hecho eso y quieres adelantarte un poco, piensa en cómo podríamos recomendar artículos que los usuarios podrían estar interesados en. Así que vimos la consulta que escribimos aquí en Cipher, y hablamos sobre la directiva de esquema Cipher. Piensa en cómo podríamos actualizar nuestras definiciones de tipo aquí en el editor de definiciones de tipo para incluir ese campo en el tipo de artículo para mostrar artículos recomendados. Así que si quieres trabajar en eso, piénsalo, haremos una pausa durante unos minutos. Y luego, cuando volvamos, veremos cómo agregar esa función de artículo recomendado a nuestras definiciones de tipo. Dejaré un enlace a la documentación, que deberíamos estar consultando. Así que si vamos a neo4j.com.doc, tenemos toda la documentación para todo lo relacionado con Neo4j, pero estamos utilizando la biblioteca Neo4j GraphQL. Este es un enlace a la documentación de la biblioteca. Y luego, para esa característica específica de Cypher, si miramos aquí bajo directivas, podemos ver todas las directivas disponibles con la biblioteca Neo4j GraphQL. Específicamente queremos Cypher. Así que aquí están los documentos sobre cómo manejar esa lógica personalizada con Cypher. De acuerdo, genial. Veo una pregunta de Anthony en el chat. Entonces esto está en toolbox y mirando la respuesta hasta las definiciones de tipo, habilité debug, pero no veo el panel de debug. Sí, la forma en que funciona, cerraré esto. La forma en que funciona la opción de debug, así que aquí en la pantalla de definición de tipo, si activamos esto y luego volvemos a construir el esquema para volver al editor de consultas, el modo debug básicamente se registra en la consola. Y tienes que abrir las herramientas de desarrollo en tu navegador web para ver eso.

Entonces, en Chrome, eso es ver la consola de desarrollador de JavaScript. Si estás usando Firefox o Safari, tienen algo similar. No estoy seguro de cómo obtener eso, pero quieres la consola de desarrollador o la consola de JavaScript, como se llame en tu navegador web. Y ahí es donde deberías poder ver las cosas que la aplicación registra en la consola. Y ahí es donde deberías poder ver la salida de depuración.

¿Qué tal los demás? ¿Todos configuraron la caja de herramientas apuntando a su instancia de Aura y generaron las definiciones de tipo? ¿Las personas pueden escribir una consulta GraphQL para encontrar los artículos de noticias más recientes? ¿Y qué hay de la función de artículo recomendado? ¿Alguien lo logró? Echemos un vistazo a eso.

Entonces, encontrar los artículos más recientes, ya hemos visto que hemos hecho eso un par de veces. Esto es cómo se ve. Vamos a usar los argumentos de campo de opciones para limitar a diez y ordenar por fecha de publicación en orden descendente para los artículos. Pero la siguiente pregunta es, bien, estoy viendo algunos artículos en la aplicación, quiero agregar algún tipo de personalización para que después de que un usuario termine de leerlo, le muestre artículos similares. Y vimos cómo hacer eso en Cypher, pero no tenemos esa funcionalidad expuesta a través de GraphQL, ¿verdad? Pero podemos expresar esa lógica personalizada en Cypher. Entonces, esta es la consulta aquí, donde estamos recorriendo desde el artículo para encontrar otros artículos que tengan temas, personas u organizaciones superpuestas. Y estamos usando el recuento de esa superposición como una especie de puntaje para las recomendaciones. Así que tomemos esta consulta, simplemente copiemos esto, y volvamos a la caja de herramientas. Y en el editor de definiciones de tipo, voy a agregar un campo al tipo de artículo. Y llamémoslo similar. Y el campo similar, este será un campo de matriz de objetos de artículos. Y vamos a agregar una directiva Cypher. Y la directiva Cypher toma un argumento de declaración, que será mi consulta Cypher. Y un poco incómodo, esa es una declaración de recorrido larga aquí. Pero esta es la misma consulta que vimos antes donde buscamos temas, personas y organizaciones superpuestas. Entonces, este campo de directiva Cypher, déjame hacer zoom y hacerlo lo más grande posible. Entonces, lo que estamos diciendo aquí es que el tipo de artículo, estamos agregando un campo llamado similar, que se evaluará como un campo de matriz de objetos de artículo. Pero esto no lo tenemos en la base de datos en algún lugar para poder obtenerlo de la base de datos, esto es algo que necesitamos calcular usando Cypher. Y la directiva de esquema Cypher nos permite tomar una declaración Cypher y agregar lógica a un campo para que cuando solicitemos un campo similar, estemos ejecutando esta declaración Cypher. Entonces, necesitamos ajustar esta declaración Cypher que copiamos y pegamos un poco en lugar de hacer coincidir cualquier artículo, queremos calcular esta recomendación para un artículo específico y ese artículo específico es el artículo que estamos resolviendo actualmente. Y hay una convención aquí que usamos para inyectar una variable Cypher llamada this. Entonces, esto ahora se refiere a la variable Cypher del nodo que estamos resolviendo actualmente. Entonces, no necesito este with y el order y limit. Y en lugar de comenzar mi recorrido desde algún nodo A, lo comenzaré desde this. Y lo que voy a devolver ahora es la recomendación. Entonces, ahora voy a devolver los nodos de artículo recomendados y voy a construir el esquema. Y ahora, si miro en el Explorador aquí, debería tener ahora un campo similar que me dará artículos similares y agreguemos título y URL y ejecutemos esto. Esto dice encuentra los 10 artículos de noticias más recientes y luego, para cada uno de ellos, muéstrame artículos similares. Y ahora, aquí está, ¿era esto una ley de control de armas? y los artículos similares que obtengo para eso son artículos sobre control de armas, tiroteos escolares. Es este tipo de cosas. Anthony dice, ¿puedo pegar el fragmento en el chat? Sí, definitivamente. Aquí está el campo similar que agregamos. Vamos a copiar eso. Solo lo pegaré en el chat. Espero que la formato esté bien. Puede haber algunos espacios extraños allí en el chat de Zoom. No estoy seguro, espero que funcione. De acuerdo, así que una cosa a tener en cuenta es cuando ejecutamos esto, cuando ejecutamos esto estamos devolviendo tantos artículos similares como encontramos, lo cual básicamente, bueno, solo para este artículo, esto parece cientos de nodos de tema superpuestos para este artículo. Entonces, probablemente queramos ajustar esto un poco para permitir que el cliente diga, solo muéstrame, no sé, los 10 mejores o los 3 mejores o lo que sea. Y podemos hacer eso agregando un argumento de campo aquí. Entonces, similar va a tomar, no sé si podemos llamarlo first, y será un campo entero y podemos darle un valor predeterminado. Entonces, esto solo está diciendo, vamos a agregar un argumento de campo first, es un entero, y estamos estableciendo ese valor predeterminado en tres. Entonces, ahora cualquier argumento de campo que definamos aquí estará disponible en la declaración Cypher como variables Cypher. Entonces, podemos agregar un límite first aquí. Solo vamos a devolver los primeros tres de forma predeterminada, pero podemos configurar ese número. Solo pasamos un valor. Me gusta agregar un valor predeterminado cuando hacemos esto porque sabemos que esto siempre estará definido. Entonces, cuando hacemos referencia a estas variables en Cypher sabemos que siempre están definidas. Entonces, ahora voy a, construir el esquema y luego ejecutar la consulta. Y ahora solo estamos obteniendo tres artículos similares para cada uno. Y podemos cambiar eso a decir, solo traigamos uno. Y ahora solo estamos trayendo uno. Un artículo similar para cada uno de nuestros 10 artículos más recientes que estamos cambiando. Genial. Entonces, esa es la directiva Cypher. Esa es una funcionalidad súper poderosa para agregar lógica personalizada a nuestra API de GraphQL. Realmente podemos usar cualquier lógica que podamos expresar en Cypher aquí. Podemos adjuntarlo a nuestro esquema de GraphQL para agregar esa lógica personalizada, que es una característica súper poderosa cuando estamos usando la biblioteca Neo4j GraphQL. Y también, veamos la declaración Cypher generada para esto. Esto se ve un poco extraño, pero podemos ver que estamos generando una única declaración Cypher, incluso con nuestra declaración Cypher personalizada que escribimos para encontrar recomendaciones que está incrustada en la declaración Cypher general como una subconsulta, lo cual es realmente genial porque aún estamos abordando el problema de las consultas n más uno con lógica personalizada simplemente enviando un viaje de ida y vuelta a la base de datos. Entonces, una característica súper genial, súper poderosa. Así que eso fue un vistazo a la caja de herramientas. Esta caja de herramientas de GraphQL todavía está en beta.

Así que no las características finales o el nombre final, incluso si tienes ideas para el nombre, definitivamente. Aceptamos sugerencias allí. Genial, entonces, la caja de herramientas es solo una aplicación web alojada. Puedes usarla en cualquier momento y simplemente apuntarla a una base de datos de Neo4j.

Echemos un vistazo a la otra opción que mencionamos, que es el caso en el que tenemos una aplicación que queremos construir e implementar en algún lugar. Entonces, la caja de herramientas es útil para testing y desarrollo pero no nos proporciona una aplicación de servidor GraphQL que podamos implementar en algún lugar y consultar desde nuestros clientes utilizando nuestros clientes.

Entonces, ahora vamos a ver cómo escribir algo de código JavaScript, perdón, código NodeJS JavaScript. Así que abramos Code Sandbox y dejaré este enlace en el chat. Así que abramos este enlace. Esto abrirá Code Sandbox, que es como un entorno de desarrollo en el navegador. Esto nos permite escribir código NodeJS JavaScript en el navegador que se ejecuta en algún contenedor en algún lugar de forma gratuita y sin tener que preocuparnos por ello. Este código que puedes ver aquí, enlaza a un repositorio de GitHub.

De acuerdo, lo que queremos hacer, esto simplemente extrae el código de GitHub y podemos ver que hay un archivo dotenv con una base de datos de Neo4j que estábamos viendo antes. Aunque noté que había un problema de DNS con esto. Así que queremos reemplazar esto de todos modos con nuestra instancia de Aura. Lo que queremos hacer ahora es bifurcar esto. Así que queremos bifurcar el sandbox para poder hacer cambios en él y luego será personalizado para nosotros. Para bifurcarlo, te pedirá que inicies sesión en Code Sandbox. Puedes iniciar sesión con GitHub o Google o crear una cuenta, algo así. Pero el primer cambio que quiero hacer está en este archivo .env. Vamos a ver todo el código en un minuto. Pero en este archivo .env, quiero cambiar las credenciales de conexión a mi instancia de Neo4j Aura. La base de datos que creamos con nuestros datos de noticias. Así que voy a volver a la consola de Aura, voy a copiar la URI de conexión de aquí. Esto es específico para la instancia que creamos para nosotros. Y eso va en la variable de entorno Neo4j URI. Este es un archivo .env que simplemente establece variables de entorno cuando nuestro servidor GraphQL se inicia. Y luego nos referimos a estas para crear una conexión a Neo4j. Entonces, el protocolo aquí, por cierto, este Neo4j más S dos puntos barra diagonal, el Neo4j, este es el protocolo, el protocolo binario para cómo conectarse a Neo4j. Y luego el más s simplemente significa que esto debe ser una conexión segura. Si no tuviéramos ese más S, permitiríamos conexiones no encriptadas. Pero con Aura, tenemos esa capacidad de hacer conexiones seguras. Así que eso es lo que significa el más S. Y este es solo el dominio de mi base de datos. En este caso, el tuyo será diferente. El usuario de Neo4j será neo4j. Y la contraseña será la contraseña de tu Aura. Voy a pegar la mía aquí. De acuerdo, y luego guardé eso. Y luego creo que necesito reiniciar el servidor, tal vez, para que recoja esos cambios. Eso reiniciará mi contenedor para recoger esos cambios. Anthony pregunta, ¿puedes aclarar la sintaxis para proporcionar argumentos en una consulta GraphQL? Y específicamente, al mirar el primer argumento en el campo similar. Sí, Anthony, en el ejemplo que pegaste, veo que tienes comillas alrededor del uno, y eso hará que sea una cadena con las comillas alrededor, y específicamente queremos pasar enteros. Pero sí, eso es bueno. Hagámoslo ahora mismo, de hecho, para nuestro, lo haremos en code sandbox ya que estamos aquí. Así que veamos el código. Aquí está nuestro archivo .env. Si miramos, sort of package.json, puedo ver qué paquetes estamos utilizando. Estamos utilizando la biblioteca Neo4j GraphQL, ApolloServer, .env es solo para establecer variables de entorno, y luego las dependencias de pares para la biblioteca Neo4j GraphQL son la implementación de GraphQL JavaScript y el controlador JavaScript de Neo4j. En index.js, estamos importando esos paquetes, cargando nuestras variables de entorno. Aquí, estamos creando una conexión a Neo4j utilizando el controlador JavaScript. Y luego cargamos nuestras definiciones de tipo desde el archivo de esquema.graphql. Que veremos en un minuto. Luego pasamos eso, esas definiciones de tipo y nuestra instancia del controlador cuando creamos una nueva instancia de Neo4j GraphQL, es este neoschema. Y luego pasamos por el proceso de aumento de esquema. Así que eso es neoschema.getschema. Esta es una función asíncrona. La razón por la que es asíncrona es porque puede haber algunas directivas de configuración de índices. Entonces, tenemos la capacidad de decir, eh, deberíamos tener un índice o una restricción en este campo. Y por eso es una función asíncrona porque la biblioteca Neo4j GraphQL irá a nuestra base de datos y se asegurará de que esos índices estén en línea antes de generar el objeto de esquema ejecutable. Y pasamos eso a Apollo server. Estamos utilizando el complemento del servidor Apollo playground para que seamos consistentes con el uso de GraphQL playground. El valor predeterminado ahora con el servidor Apollo es el sandbox de Apollo studio. De acuerdo, aquí está nuestro esquema GraphQL, y esto debería verse bastante similar al esquema que generamos en nuestra aplicación de la caja de herramientas. Y la pregunta de Anthony fue aclarar la sintaxis para los argumentos en la consulta GraphQL. Así que veamos eso. Si volvemos a la caja de herramientas, voy a tomar nuestro campo similar aquí que agregamos y volvamos a mi code sandbox. Y aquí vamos a, usemos, usemos la funcionalidad extend. Esto es útil si tenemos nuestra definición de tipo dividida en varios archivos, que es un patrón común, podemos, en lugar de simplemente agregar un campo en nuestra definición de tipo inicial, podemos usar extend para agregar campos. Y vamos a agregar este campo similar.

Entonces, la pregunta de Anthony fue, bueno, aquí tengo, déjame pegarlo también en el chat. Así que tenemos todo completo. Esta declaración Cypher encuentra artículos similares al artículo que estamos resolviendo actualmente. Así que eso es, esta es la palabra clave especial para el artículo que estamos resolviendo actualmente. Y agregamos este primer argumento de campo con un valor predeterminado de tres que se inyecta en la declaración Cypher utilizando variables Cypher.

Aquí, con esta primera variable Cypher, nos referimos al argumento de campo. Y tiene un valor predeterminado de tres, así que si no lo especificamos, entonces, estamos usando ese valor de tres. Así que guardo ese cambio. Pensé que tenía nodemon configurado para esto, pero no, así que necesito reiniciar. ¿Puedes al menos reiniciar el sandbox para recoger esos cambios? Así que reiniciemos el servidor de nuevo, recoger esos cambios. Creo que así funciona. Debería editar esto, si tuviera esto usando nodemon en lugar de solo node, creo que cada vez que cambiemos esos archivos, se actualizará la aplicación. Así que es un poco molesto reiniciar nuestro sandbox cada vez. Pero de todos modos, ahora podemos ir a artículos, opciones, límite 10. No nos preocupemos por la clasificación. Y puedo traer de vuelta el título y la URL. Ejecutemos eso. No se puede conectar a la database. Sí, creo que por alguna razón eso no recogió mis cambios en el archivo .env. Así que creo que todavía estamos tratando de acceder a una database diferente. Eso en realidad no está disponible para DNS. Entonces, Code Sandbox es genial cuando no tenemos problemas con él. Pero de todos modos, creo que aún deberíamos ver la sintaxis aquí. Entonces, similar, primer título, esa es la sintaxis que usamos. Y ahora que el similar con el primero uno es el argumento de campo pasado a nuestra declaración Cypher aquí. Y ahora obtenemos un error diferente. ¿Por qué es eso? Función desconocida. Bueno, no debería ser desconocida. Esta es mi instancia de Aura. Sí, eso es extraño. Sí, algo está pasando. Creo que no estamos, oh, aquí vamos. Así que ahora eso recogió nuestro cambio de database. Tal vez nuestro sandbox no se reinició completamente. No estoy seguro de cuál es el problema allí. De todos modos, sí. Esa es una mirada al código que usamos para escribir un servidor GraphQL usando Node.js. Así que observa que no tuvimos que escribir ningún resolvedor. Eso es muy bueno para la experiencia del desarrollador. Eso nos permite comenzar rápidamente. Todo se basa en nuestras definiciones de tipo, lo cual es genial.

De acuerdo, genial. Así que nos queda un poco de tiempo. Así que pasemos a hablar sobre Swift UI para poder utilizar nuestra API de GraphQL en una aplicación iOS. Swift UI es, como dijimos antes, el marco de interfaz de usuario de Apple para construir aplicaciones iOS, Mac OS y tvOS. Digo uno de los marcos de interfaz de usuario de Apple, está UI kit, que es una opción más antigua para usar cuando Objective-C era el lenguaje común, Objective-C y UI kit todavía están presentes, eso fue cuando yo era desarrollador móvil, y eso fue lo que estaba usando, aunque también hice un poco con Swift, cuando salió por primera vez, trabajaba como desarrollador iOS para una empresa que hacía aplicaciones móviles para la industria inmobiliaria, algo que te permitía buscar listados de propiedades, y luego los personalizábamos para un agente inmobiliario.

Entonces, aquí, si sigues estos pasos en Xcode, que no necesitas hacer, vamos a obtener un proyecto de Xcode que tiene una especie de estructura básica, para lo que queremos trabajar inicialmente, pero si sigues estos pasos en Xcode para crear un nuevo proyecto SwiftUI, terminarás con algo como esto, este es el punto de partida básico, y SwiftUI te da esta estructura de vista de contenido, que te permite usar lo que se llaman modificadores de vista y otras vistas. Entonces, SwiftUI básicamente te permite componer múltiples vistas y usar modificadores de vista para darles estilo. ¿Qué significa eso? Bueno, aquí en nuestra variable body, estamos usando un text view pasando hello world para renderizar en el text view y este dot padding, eso es un modificador de vista para ajustar el text view y luego el text view es parte de nuestra vista de contenido general. Así que aquí tenemos solo un objeto de vista, podríamos tener varios, este es solo el valor predeterminado con el que comenzamos. Y los modificadores de vista son una forma declarativa, es como decir, así es como quiero darle estilo a esto y luego Xcode se encarga de combinar los estilos de múltiples vistas para renderizar nuestra aplicación general. Esa es la idea básica de SwiftUI.

Entonces, si estás siguiendo en Xcode, hay este proyecto de GitHub, que dejaré en el chat. Si no tienes Xcode abierto y funcionando, está bien, lo explicaré. Solo puedes observar mientras lo hacemos. Pero si tienes Xcode abierto y funcionando, puedes descargar ese proyecto de Xcode desde GitHub y abrirlo. Y eso tiene el código para la estructura básica de nuestra aplicación. Vamos a ajustar un par de cosas para agregar funcionalidad de GraphQL. Entonces, supongo que hay algunas cosas en la captura de pantalla, una de ellas es que a la derecha podemos ver la vista previa de nuestra aplicación ejecutándose dentro de Xcode, lo cual no parece ser tan importante. Pero si has sido desarrollador móvil y has tenido que construir tu aplicación y usar un simulador para ver cualquier cambio, tener esa vista previa que se actualiza en tiempo real mientras haces cambios en tu código SwiftUI, es genial. Así que hablemos de cómo podemos hacer la obtención de datos de GraphQL en una aplicación iOS con SwiftUI. Vamos a usar la biblioteca Apollo iOS. Esto está escrito en Swift por Apollo. Si no estás familiarizado con Apollo, Apollo hace herramientas para GraphQL tanto en el cliente como en el servidor. Así que estábamos usando Apollo Server hace un minuto. Eso es mantenido por Apollo. También hacen herramientas para el cliente. Creo que la versión más popular de Apollo Client es el cliente React para construir aplicaciones React. Pero también han lanzado y mantienen Apollo iOS, que es un cliente Swift de GraphQL. La funcionalidad principal en Apollo iOS, hay algunas cosas interesantes sucediendo.

Uno de ellos es la caché. La caché es una función importante para muchos clientes de GraphQL. No queremos hacer muchas solicitudes innecesarias al servidor. Por lo tanto, podemos utilizar una caché en memoria en iOS y también es cierto, creo que para Apollo Kotlin que es el cliente de Android que utiliza SQLites que es una base de datos integrada en el dispositivo para la caché para que los datos puedan persistir entre reinicios de la aplicación lo cual es bastante bueno. La otra gran funcionalidad en Apollo iOS es la generación de código. Swift es un lenguaje fuertemente tipado, GraphQL también es fuertemente tipado por lo que podemos aprovechar el tipado en ambos lenguajes para generar código y ¿qué tipo de código estamos generando? Bueno, algunas cosas. Una es que estamos generando código de modelo para nuestros modelos y la otra cosa es generar código de API para ejecutar nuestras consultas de GraphQL. Veremos cómo se ven en un momento. Hay otros clientes Swift iOS disponibles. Hay uno mantenido por el Guild, que creo que se llama simplemente Swift GraphQL, algo así. Así que hay algunas opciones diferentes. No estoy muy familiarizado con ese. No puedo hablar sobre las diferencias entre ese y Apollo iOS. También hay clientes para Android. Ese es Apollo Kotlin. Y también para React Native. Para React Native, también hay un cliente Apollo para React Native.

Estos son los pasos que seguimos para usar Apollo iOS en un proyecto Swift UI. Y supongo que debería decir que no tiene que ser en un proyecto Swift UI. Podemos usar UI kit y Swift con Apollo iOS. Y creo, ¿puedes usar, sé que podemos combinar Objective-C y Swift. Así que creo que incluso podemos usar Objective-C para interactuar con Apollo iOS a través de un puente Swift, aunque no lo he revisado recientemente, pero estos son los pasos básicos.

Entonces, necesitamos agregar el paquete Apollo iOS, dependiendo de qué gestor de paquetes estemos usando. Entonces, con Swift Package Manager, creo que ahora se está convirtiendo en el predeterminado, pero CocoaPods todavía está presente y hay otro, cuyo nombre se me escapa que también podemos usar, pero hoy vamos a usar Swift Package Manager. Luego, necesitamos descargar el esquema GraphQL, que es una representación JSON del esquema que descargamos en nuestro proyecto Xcode. Y la razón por la que hacemos eso es para habilitar la generación de código. Entonces, para que la generación de código funcione, necesitamos saber cuál es el esquema GraphQL con el que estamos trabajando. Luego, necesitamos definir cualquier operación que queramos usar en nuestra aplicación. Entonces, cualquier consulta, mutación, suscripción, debemos escribir esas y tenerlas disponibles en nuestro proyecto Xcode. Luego, podemos pasar por el paso de generación de código, que utilizará nuestro esquema GraphQL descargado y las consultas GraphQL, las operaciones y las mutaciones también que escribimos e incluimos en nuestro proyecto Xcode para generar un código Swift API y un código de modelo Swift para usar en nuestro código Swift. Y luego, podemos trabajar con esos datos y veremos cómo podemos usar Swift UI específicamente para trabajar con esos datos GraphQL. Entonces, esos son los pasos básicos. Los mostraré en una captura de pantalla. Estos ya están configurados en ese proyecto Xcode que está disponible en GitHub. Entonces, así es como usamos Swift Package Manager para agregar una dependencia de Apollo iOS. Hay varios paquetes diferentes dependiendo de lo que estemos intentando hacer. Uno de ellos creo que admite suscripciones. Solo necesitamos el paquete Apollo. Genial, aparecerá en Swift Package Manager como una dependencia. Luego, lo siguiente que debemos hacer es configurar un script de fase de compilación para hacer dos cosas. Una es descargar el esquema GraphQL. Y una vez que hayamos descargado el esquema GraphQL, queremos agregar un paso en el script de fase de compilación para pasar por la generación de código. Cuando agregamos Apollo iOS como una dependencia, también incluimos algunas herramientas de línea de comandos que permitirán descargar el esquema y pasar por ese paso de generación de código. Este es un script que simplemente copié de la documentación de Apollo y lo agregué. Entonces, aquí hemos creado en el script de fases de compilación en Xcode. He creado un nuevo script de fase de compilación. Por lo tanto, esto se ejecutará cada vez que construyamos nuestro proyecto llamado Apollo GraphQL. Y podemos ver qué hace el script. Aquí, comienzo en la línea 26 usando la herramienta de línea de comandos incluida para descargar un esquema desde algún punto final. Y he señalado al punto final de gráfico de noticias. Vamos a cambiar esto para que apunte a nuestro punto final de GraphQL de code sandbox. Entonces, eso descargará una versión JSON de nuestro esquema en este schema.json. Y luego, esta siguiente línea, línea 28, esto está activando la generación de código para buscar cualquier archivo GraphQL. Entonces, esos serán las operaciones que hemos escrito. Entonces, cualquier consulta o mutación que hayamos escrito en nuestro proyecto Xcode que queremos usar en nuestra aplicación, los usará y también nuestro archivo de esquema.JSON o esquema GraphQL para generar api.swift. Entonces, ese es el código de API generado que Apollo iOS va a co-generar para nosotros. Así es como se ve el archivo schema.json. Esta es solo una representación JSON de nuestro esquema. Este es el resultado de ejecutar la consulta de introspección. Y aquí está la consulta GraphQL que escribimos. Entonces, vamos a buscar los artículos más recientes. Entonces, dando los 30 artículos más recientes ordenados por fecha de publicación y la información asociada para esos. Y luego, aquí está el archivo api.swift generado. Y esto, no queremos modificarlo. Esto es generado por ese script de fase de compilación. Y puedes ver que básicamente incrusta la consulta que recogió de cualquier archivo GraphQL. Entonces, cualquier mutación loca, solo queremos asegurarnos de guardar esas como archivos .graphql en nuestro proyecto Xcode. Y esto tiene la lógica para interactuar con nuestra API GraphQL. Entonces, solo necesitamos crear una clase de red que en este caso va a crear una instancia de Apollo Client y la URL de nuestra API GraphQL. Luego, tenemos algunas opciones dependiendo de qué paradigma estamos siguiendo. Tenemos el marco común, la forma común de construir aplicaciones con SwiftUI es usar el modelo de vista, ViewModel, donde tenemos una clase o estructura de modelo que define los datos con los que estamos trabajando. Tenemos una vista que define en SwiftUI cómo construir la vista dada ciertos datos de modelo y un ViewModel es básicamente donde interactuamos con la API GraphQL. Es posible que necesitemos modificar algunos de los datos que se devuelven dependiendo de cómo queremos pensar en nuestros modelos. Lo que estamos haciendo aquí en nuestro ViewModel, hemos creado un ViewModel de artículos que decimos que es un objeto observable. Y también hemos agregado esta directiva Publish aquí en nuestros artículos, que es una matriz de artículos. Y definimos una función fetch, que está utilizando nuestra clase de red compartida y Apollo Client para ejecutar la consulta de los artículos más recientes. Esto es de nuestra API generada que recogió nuestra consulta de los artículos más recientes que escribimos en GraphQL. Entonces, ¿qué está pasando aquí? Bueno, el objeto observable y esta directiva publicada, esto es similar si estás familiarizado con React a la forma en que funciona la vinculación de datos en React con variables de estado. Entonces, puedes pensar en nuestro modelo de vista como un objeto de estado. Y de hecho, en nuestro código de Swift UI aquí, que veremos en un minuto, declaramos que nuestra instancia de ViewModel de artículo es un objeto de estado. Y cuando ese objeto cambia, necesitamos volver a representar nuestra vista, teniendo en cuenta cómo han cambiado esos datos. Entonces, esta es una característica muy poderosa de Swift UI. Luego podemos usar eso en nuestra vista para mostrar el resultado de ese código de obtención de datos GraphQL. Vamos a abrir Xcode y ver eso. Entonces, si descargaste el proyecto en GitHub, y lo abres, verás, acercémonos un poco aquí, verás exactamente el código que hemos revisado. Ya vimos cómo se veía el archivo schema.JSON. Aquí están nuestros artículos.graphQL, la consulta GraphQL de los artículos más recientes.

Y vimos aquí cómo crear una instancia de nuestra API modelo de vista. Veamos la vista de contenido. Este es nuestro código de Swift UI, y no nos estamos volviendo locos aquí. Esto utiliza una vista de desplazamiento. Entonces decimos que nuestra vista de contenido, que es la aplicación en general, está compuesta por otras vistas. Y en este caso, tenemos una vista de desplazamiento, luego iteramos sobre cada artículo que encontramos en el modelo de vista de artículos. Y como el modelo de vista de artículos es un objeto de entorno, como una variable de estado es una forma de pensar en eso, a medida que el modelo de vista de artículos cambia, volveremos a representar partes de nuestras vistas. Entonces, cuando la aplicación se inicia inicialmente, no hay data, la vista de vista de artículo cambia a medida que los datos llegan desde nuestra consulta de GraphQL que desencadena una nueva representación para iterar sobre cada artículo. Y luego, para cada artículo, creamos una tarjeta de vista de artículo, que es otra vista que hemos definido aquí. Y esto es solo una vista simple para representar esta pieza. Entonces, para cada artículo, cada artículo es una estructura de vista de tarjeta de artículo, y eso toma un título y un resumen y luego combina un par de vistas de texto. Podemos ver los modificadores de vista que usamos aquí, acercarnos un poco más. Los modificadores de vista que usamos aquí para hacer cosas como establecer la fuente para el título. Tenemos el texto del resumen y tenemos una simple separación. Entonces, nuestra vista de desplazamiento está compuesta por, muchas de estas estructuras de vista de tarjeta de artículo, que es una vista que hemos definido aquí que está compuesta por dos vistas de texto y una vista separadora, tomando datos de nuestro modelo de vista de artículos. También queremos definir un proveedor de vista previa. Entonces, cuando estamos trabajando con data, podemos usar el mismo objeto de entorno que estamos usando en nuestra aplicación, por lo que esto realmente obtendrá data y usará la data obtenida. O si queremos, podemos simplemente simular algunos datos para no tener que preocuparnos por manejar las solicitudes de red, tal vez no queremos probar esa parte de nuestra aplicación. Podríamos crear una vista de contenido aquí en la vista previa que solo tenga algunos datos codificados en duro o algo así. Y así es como obtenemos datos en el modo de vista previa en nuestra aplicación lo cual es bastante bueno. Y podemos ver, por lo que eso cambia a medida que hacemos cambios aquí. Veamos cómo se ve esto. Entonces, establezcamos tal vez medio o algo así. Podemos hacer cambios y ver cómo eso cambia en vivo sin actualizar nuestra, sin construir y ejecutar el simulador. Vamos a construir nuestra aplicación en el simulador. Veamos cómo se ve esto. Entonces, aquí está el simulador en un iPhone 14 Pro, y aquí está, aquí está nuestra aplicación con los artículos más recientes. Entonces, estamos usando la biblioteca Apollo iOS para manejar la obtención de datos de GraphQL. Requiere una API de GraphQL que hemos construido utilizando la biblioteca Neo4j GraphQL sobre la instancia de Neo4j Or, donde estamos utilizando datos de la API de New York Times para mostrar los artículos más populares en una aplicación de lectura de noticias. Lo cual es bastante genial. Eso fue un vistazo a Apollo iOS. Tenemos aquí un ejercicio, que consiste en hacer un par de cosas. Una es cambiar la API de GraphQL que estamos utilizando en lugar de, vamos a cambiar esto en nuestra capa de red, este es el predeterminado que estaba en funcionamiento. Queremos cambiar esto a la API de GraphQL que construimos con code sandbox. Y luego queremos ver cómo incorporar algunas características de personalización. ¿Cómo podemos actualizar esa consulta de GraphQL para mostrar tal vez noticias locales o solo alguna personalización? Pero parece que hubo algunos problemas con code sandbox y faltan solo unos minutos para el final del tiempo en un viernes. Así que tal vez lo dejemos como un ejercicio para que las personas lo hagan en casa. Eso es prácticamente todo lo que tenía para hoy. Aquí hay un enlace a los recursos de hoy. Dejaré un enlace en el chat si puedo copiarlo. Copiar enlace, ahí vamos. Todo está enlazado en las diapositivas que están disponibles aquí. Entonces, ese es probablemente el mejor lugar para ir. Si tienes preguntas o comentarios o cualquier cosa, avísanos en el chat. Pero creo que como estamos tan cerca del final del tiempo de todos modos vamos a terminar aquí. Solo para reiterar un poco lo que hicimos es que vimos Neo4j en el modelo de gráfico de propiedades, vimos el lenguaje de consulta cipher. Entonces, ¿cómo consultamos data como un gráfico en una base de datos de gráficos usando cipher y algunas de las funcionalidades de coincidencia de patrones de gráficos allí. Vimos GraphQL. Comparamos y contrastamos GraphQL y cipher tratamos de pensar cuándo queremos usar uno en lugar del otro, cuándo tiene sentido usar cipher en la base de datos cuándo tiene sentido usar GraphQL con APIs. Echamos un vistazo a la biblioteca Neo4j GraphQL que nos permite construir APIs de GraphQL respaldadas por Neo4j. Echamos un vistazo a la caja de herramientas de GraphQL de Neo4j una forma de bajo código de construir y probar APIs de GraphQL. También vimos cómo construir un servidor de GraphQL en JavaScript. Entonces, un servidor de GraphQL en JS utilizando la biblioteca Neo4j GraphQL. Y luego echamos un vistazo a SwiftUI y los clientes Apollo iOS para construir aplicaciones nativas de iOS con GraphQL. Así que cubrimos bastante. Esperemos que no haya sido demasiado rápido. Y no veo más preguntas en el chat. Así que supongo que terminaremos aquí. Si estás interesado en aprender más cosas sobre GraphQL o Neo4j la mejor manera de contactarme es probablemente en Twitter. Mi nombre de usuario en Twitter está aquí. También publico un blog en lionwj.com. Es mi sitio personal también, donde puedes encontrarme. Genial, así que espero que todos hayan disfrutado de la masterclass de GraphQL Galaxy. Creo que hoy son los paneles, las charlas fueron ayer creo. Entonces, una pregunta de Anthony. ¿Se agregarán vinculaciones de GraphQL a OraDB y cómo serán? Sí, esa es una buena pregunta. Creo que, como descubrimos, GraphQL no es un lenguaje de consulta de base de datos. Entonces, no estamos interactuando directamente con la base de datos con GraphQL. Algunas personas de bases de datos han intentado eso creo que no funcionó muy bien.

Creo que GraphQL fue diseñado para ser un lenguaje de consulta de API. Y así queremos usarlo para construir esa capa de API que se encuentra entre el cliente y la base de datos. Dicho esto, por supuesto, como la biblioteca GraphQL de Neo4j, el objetivo principal es facilitar la construcción de APIs de GraphQL respaldadas por una base de datos. Por lo tanto, definitivamente hay espacio para estas integraciones de GraphQL y base de datos.

Ahora, cuando nos movemos a servicios en la nube, supongo que la pregunta es ¿cómo se vería eso? Entonces, eso sería algo más como un servicio de GraphQL administrado respaldado por Neo4j Aura, creo que es cómo se vería eso. Y de hecho, el equipo de GraphQL está investigando eso y están recibiendo comentarios. Entonces, si te fijas en la caja de herramientas, hay un enlace aquí en la parte superior. Dice `¿Quieres administrar tu nueva API de GraphQL o registrarte aquí?`, y es un formulario de Google que básicamente solicita comentarios sobre un posible servicio administrado de API de GraphQL que se integraría con Aura. De todos modos, es una respuesta larga a tu pregunta, Anthony. Si se agregarán vinculaciones de GraphQL a Aura, creo que la respuesta es que se vería algo así como un servicio de GraphQL, un servicio administrado de GraphQL, donde tienes una interfaz similar a la caja de herramientas donde estás configurando una API y esa API se implementa en algún lugar administrado por Neo4j combinado con Aura. Entonces, algo así, también puedes ver tal vez la caja de herramientas de GraphQL integrada con el flujo de trabajo en Aura con otras herramientas de desarrollo, eso podría tener mucho sentido. Así que hay muchas posibilidades interesantes allí, seguro.

Es el tipo de cosas que, ¿qué definiciones guardamos en el servidor y luego qué? Sí, entonces básicamente con la caja de herramientas, tienes definiciones de tipo y un editor de consultas y todo esto está en tu navegador, el siguiente paso sería algo así como implementar esta API. Y lo que hicimos aquí es que tomamos las definiciones de tipo de la API y luego fuimos a code sandbox y eso estaba administrando una aplicación de servidor GraphQL para nosotros. Pero en el mundo de la nube, en lugar de construir nuestro propio servidor de Node.js que tenemos que administrar, ¿cómo podríamos pensar en integrarlo en un servicio en la nube donde, al igual que `serverless`, no significa que no haya un servidor real, simplemente que como desarrollador, tu capa de abstracción ya no es un servidor. Entonces, tomando ese concepto donde la capa de abstracción para el desarrollador son las definiciones de tipo. Entonces vimos cómo podemos usar estas definiciones de tipo y específicamente directivas para configurar la API generativa. Entonces, un servicio de GraphQL administrado creo que se vería algo así, donde tu capa de abstracción son las definiciones de tipo y así es como estamos configurando como desarrollador la API. Y luego hay algún servicio en la nube integrado con Aura detrás de escena que, como desarrollador, no tenemos que pensar en eso, eso implementa y administra los puntos finales de GraphQL para nosotros. Creo que esa es la forma en que podría verse una integración de GraphQL administrada con Aura. Y luego Anthony dice, el cliente sería diferente porque no conoce el esquema, solo el punto final. Sí, entonces para los clientes de GraphQL, no importa dónde se hospede ese servicio de GraphQL, ¿verdad? Solo son puntos finales de GraphQL y a través de las capacidades de cosas como la introspección y todas las demás herramientas de desarrollo que tenemos con GraphQL, podemos construir aplicaciones que aprovechen eso. Y nuevamente, sí, esto no es algo que exista actualmente, es algo en lo que creo que las personas de Neo4j están pensando, creo que tiene sentido como la próxima evolución si lo piensas, la biblioteca Neo4j GraphQL, que esta es una de las páginas que hemos vinculado que tiene muchas descripciones generales aquí, habla sobre todas las características para construir esta capa de API, pero aún hay mucho que debes administrar y tener en cuenta como usuario que tal vez no agrega mucho valor específico, ¿verdad? Como tenemos que administrar lo que es esencialmente una aplicación Express, una aplicación de Node.js y implementarla en algún lugar y escalarla horizontalmente con múltiples instancias. Y eso no es realmente algo en lo que los desarrolladores puedan agregar una ventaja competitiva, ¿verdad? Porque tenemos cosas como las funciones Lambda que podemos usar para implementar estas aplicaciones. Entonces, creo que en gran medida se trata de pensar en cuáles son algunas de las cosas comunes de boilerplate que los desarrolladores están haciendo que no agregan mucha ventaja competitiva a su aplicación, cuáles son algunas de esas características que podemos mover a los servicios en la nube. Entonces, sí, nuevamente, pensando en Cypher versus GraphQL, como Cypher, ya sabes, tiene sus casos de uso para interactuar directamente con la base de datos. Y cuando estamos construyendo ese tipo de aplicaciones en las que queremos tener esa lógica de consulta de la base de datos directamente con el poder de Cypher, ese es el momento y el lugar para eso. Pero cuando estamos construyendo la API de propósito más general que se encuentra entre el cliente y la base de datos, GraphQL es una excelente opción para eso. Nuevamente, GraphQL, por lo general, no es algo con lo que queremos pensar como interactuar directamente con la base de datos, queremos esa capa de API. Y también hay todo tipo de características que no hablamos hoy, como la autorización. Creo que hay algunos ejemplos en esta página donde podemos agregar reglas de autorización para especificar que solo los usuarios que crearon un pedido deberían poder editarlo, cosas como estas, esta funcionalidad de autorización a nivel de aplicación que no necesariamente tienes en un lenguaje de consulta de base de datos, estas son como funcionalidades de autorización a nivel de aplicación. Entonces, sí, comprender cómo Cypher y cómo GraphQL encajan en diferentes partes de la arquitectura de tu aplicación. Espero que hayamos tocado algo de eso hoy. Bueno, gracias, espero que todos tengan un buen fin de semana y gracias por unirse y gracias por estar en GraphQL Galaxy. Nos vemos la próxima vez. Saludos a todos.