thomaskn / astro-shopify Goto Github PK

First of all, awesome work!

for the .env file, should shopifyShop be the name or the url? So "my-shop" or "my-shop.myshopify.com"?
I unfortunately get an error for both of them.

Error using name:

 error   fetch failed
  File:
    C:\Users\silve\Documents\web-dev\astro\astro-shopify\C:\Users\silve\Documents\web-dev\astro\astro-shopify\node_modules\undici\index.js:109:13
  Stacktrace:
TypeError: fetch failed
    at fetch (C:\Users\silve\Documents\web-dev\astro\astro-shopify\node_modules\undici\index.js:109:13)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async makeShopifyRequest (/src/utils/shopify.ts:38:20)
    at async Module.getProducts (/src/utils/shopify.ts:51:16)
    at async eval (C:\Users\silve\Documents\web-dev\astro\astro-shopify\src\pages\index.astro:20:20)
    at async renderPage (file:///C:/Users/silve/Documents/web-dev/astro/astro-shopify/node_modules/astro/dist/runtime/server/render/page.js:91:30)
    at async renderPage (file:///C:/Users/silve/Documents/web-dev/astro/astro-shopify/node_modules/astro/dist/core/render/core.js:81:20)
    at async renderPage (file:///C:/Users/silve/Documents/web-dev/astro/astro-shopify/node_modules/astro/dist/core/render/dev/index.js:108:10)
    at async handleRoute (file:///C:/Users/silve/Documents/web-dev/astro/astro-shopify/node_modules/astro/dist/vite-plugin-astro-server/route.js:152:20)
    at async run (file:///C:/Users/silve/Documents/web-dev/astro/astro-shopify/node_modules/astro/dist/vite-plugin-astro-server/request.js:46:14)

  Cause:
Error: getaddrinfo ENOTFOUND fulldev-storefront
    at GetAddrInfoReqWrap.onlookup [as oncomplete] (node:dns:71:26)

Error using url:

 error   Expected object, received null

Reproduction:

1. Clone repo
2. Add .env
3. run yarn install
4. run yarn dev

Hope you can help :)

First of all, thank you for the awesome work!

I think now Shopify supports .webp resizes. In your code there is a seciton at src/components/ShopifyImage.svelte that prevent webp images to be resized.

    // If image is a webp, remove the .webp extension from the url
    // (Shopify image transformations don't work with webp)
    if (image && image.url.includes(".webp")) {
      return `${image.url.replace(
        ".webp",
        ""
      )}&width=${width}&height=${height}`;
    }

I ve tried to add some webp images into my product list and i wasnt' able to load them properly. Commenting that code everything is ok.

I hope this helps! ;)

Solved, waiting to be deleted.

in your example.env file you have :

1. PUBLIC_SHOPIFY_STOREFRONT_ACCESS_TOKEN
2. PRIVATE_SHOPIFY_STOREFRONT_ACCESS_TOKEN

How do these map onto what shopify offers after creating and installing a custom app? I see they offer:
Admin API access token
Storefront API access token
API key
API secret key

Much thanks in advance - love the theme!

Thank you so much for this incredible resource, Thomas. It looks really well done and that most thinkgs have been thought through.

I was wondering, because there are so many templates out there for various stacks that just show how to integrate things without being production ready, could you clarify from your point of view what this template is missing currently?

As in, if I were to build a store using this template, what would I need to do myself/remember to do in order to have something production ready (of course besides the things that are specific to a certain store like the page structure, content structure etc.)

Things like:

• Caching
• Analytics
• CDN
• Other integrations to Shopify that most likely will be needed.

I am asking from a point of ignorance :)

Thank you in advance.

Hi, consequently I love how fast this headless Shopify solution is. It's such a great way to jumpstart into entering a market using tools that offers more features and options. One thing I don't understand though, is trying to grab both metafields and metaobjects from the API. I tried to make sense of it but always came up short.

I was wondering if you can nudge me in the right direction, and which files need to be changed?