No tienes acceso a esta clase

¬°Contin√ļa aprendiendo! √önete y comienza a potenciar tu carrera

Anidamiento

16/24
Recursos

Aportes 3

Preguntas 2

Ordenar por:

¬ŅQuieres ver m√°s aportes, preguntas y respuestas de la comunidad?

o inicia sesión.

Anidamiento

Para manejar el anidamiento en GraphQL, lo tenemos que expresar que existe esta relación desde el motor de GraphQL.

para hacer esto, vamos a crear un nuevo tipo en el esquema:

# expresamos una relaci√≥n entre producto y categoria, a√Īadiendola en su tipo
type Product {
  id: ID!
  name: String!
  price: Float!
  description: String!
  image: String!
  createdAt: String!
  categoryId: ID!
  category: Category!
}

# creamos el tipo de la categoria
type Category {
  id: ID!
  name: String!
  image: String!
}

Si probamos realizar entonces la query obteniendo la categoría del producto:

{
	products {
		id 
		name
		category {
			name
		}
	}
}

Ver√≠amos que lo podemos hacer sin ning√ļn problema. Esto es incre√≠ble porque expresar la relaci√≥n de los productos se puede hacer solo defini√©ndola de manera explicita en el esquema, sin necesidad de que definamos los resolvers, esto debido a que GraphQL no se mete directamente con el backend, simplemente es un lenguaje de consulta, y esto es posible ya que ya tenemos definido en nuestro backend las relaciones en nuestros productos, y defini√©ndolas en el esquema, lo hacemos evidente a la hora de que GraphQL lo consulte.

Esto es muy √ļtil para que desde el lado del cliente no tengamos demasiada informaci√≥n innecesaria, lo cual es un problema constante a la hora de usar REST API, pero con GraphQL podemos pedir solo la informaci√≥n que necesitamos y no toda la informaci√≥n.

Se queda cargando el video xd

Si recordamos clases anteriores, tambi√©n podemos hacer anidamiento de una categor√≠a y regresa todos los productos con esa categor√≠a, ¬ŅDe qu√© manera lo hacemos?
Bueno la forma en la que lo realice fue esta:

1 Creamos un archivo dentro de la carpeta de graphql que se llame category.resolvers.js, luego agregamos para mostrar una categoria por su ID y otro para obtener todas las categorias:

const CategoryService = require('./../services/category.service');
const service = new CategoryService();

const category = (_, { id }) => {
    return service.findOne(id);
}

const categories = (_, args) => {
    return service.find({});
}

module.exports = {
    category,
    categories
}

2.En el archivo de schema.graphql agregamos el type de Categorías:

type Category {
    id: ID!
    name: String!
    image: String!
    products: [Product!]
}
  1. Agregaremos nuestra type al Query:
type Query {
    hello: String!
    product(id: ID!): Product
    products: [Product!]!
    category(id: ID!): Category
    categories: [Category!]!
}
  1. Llamamos a archivo de category.resolvers.js dentro del archivo de resolvers.js
const { categories, category } = require('./category.resolvers')
  1. Por √ļltimo agregamos dentro de la constante resolvers category y categories
const resolvers = {
    Query: {
        hello: () => "Hello World",
        product,
        products,
        category,
        categories
    },
    Mutation: {
        addProduct,
        updatedProduct,
        deletedProduct
    }
}
  1. Ya dentro de Apollo Server verificamos que funcione (esta es para obtener una categoría y dentro de esa categoría traer los productos con esa categoría):
query getCategory($categoryId: ID!) {
  resultados:category(id: $categoryId) {
    id
    name
    products {
      name
    }
  }
}

Las variables t√ļ te encargas de colocarlas.

  1. Si quieres ver todas las categorías esta es la query:
query getAllCategories {
  categories {
    id
    name
  }
}

Espero te sirva ūüíö