Creando páginas en función de los datos
Tenemos que generar páginas en un función de los productos.
En gatsby-node.js podemos crear nuestros propios plugins y generar páginas programáticamente.
Creamos la carpeta ‘templates’ dentro de ‘src’, y creamos un template de prueba, Product.js:
import React from 'react'
export default function Product() {
return (
<div>
Producto
</div>
)
}
Hacemos esto en gatsby-node.js:
const path = require('path')
exports.createPages = async ({graphql, actions}) => {
const { createPage } = actions
const productTemplate = path.resolve(`src/templates/Product.js`)
const result = await graphql(`
query GET_PRODUCTS{
allStripePrice {
edges {
node {
id
unit_amount
product {
name
metadata {
img
description
wear
}
}
}
}
}
}
`)
if (result.errors) {
throw result.errors
}
result.data.allStripePrice.edges.forEach(({node}) => {
createPage({
path: `${node.id}`,
component: productTemplate,
})
})
}
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?
o inicia sesión.