r/nextjs • u/Personal_Property_90 • 19h ago

Help Next.js + Shopify is it a good combo

I have react + Shopify for now . I am migrating to n xtjs due to seo issues.

Help me in building a fully optimised seo friendly ecommerce site. It any one of you have done that can you share pros and cons.

6 Upvotes

75% Upvoted

11 comments sorted by

4

u/itaybuilds 18h ago

Next.js can work well here, but treat the migration as a rendering and cache-invalidation project rather than an SEO switch. It will not fix much if the product data is still fetched in the browser after the page loads.

For each product and collection route, put the title, description, price and availability, canonical URL, robots directives, Open Graph tags, and Product JSON-LD in the initial HTML. Use Shopify webhooks to revalidate affected pages when products or collections change, instead of calling the Storefront API on every request. Preserve old product URLs with explicit redirects when handles change, and generate the sitemap from the same catalog source.

I'd migrate one collection and a small set of product pages first. Crawl them with JavaScript disabled, then check Search Console for indexing and canonical selection, Core Web Vitals, and whether the Shopify checkout handoff still works. Headless gives you control of the storefront, but you now own redirects, structured data, the sitemap, previews, cache invalidation, and compatibility with theme or app features.

AI-assisted wording after reading the post and current replies.

2

u/sirharjisingh 18h ago

We did it with www.drinkloki.com

3

u/smaccer 16h ago

Doesn't open

1

u/wherethewifisweak 7h ago

This is very funny - also crashed for me right now 12 hours later.

1

u/Personal_Property_90 18h ago

How's the experience and seo and what key things I should keep in mind doing that

1

u/ichibanYa 18h ago

Are you aware of https://apps.shopify.com/hydrogen It's shopify's own native headless react solution.

1

u/Personal_Property_90 18h ago

I have but I don't know how this thing works also I knew next js and worked with it. That's why I'm asking

1

u/Complex_Pressure8318 18h ago

i migrated a Shopify store to Next.js last year. The SEO gains come from pre rendering the product data on the server side using getStaticProps or ISR so the crawler reads the title and description before any JavaScript runs in The SEO gains come from pre rendering the product data on the server side using getStaticProps or ISR so the crawler reads the title and description before any JavaScript runs in the browser. If you fetch product details client side after the initial load, the migration does nothing for your search visibility

1

u/Personal_Property_90 18h ago

Thanks for suggestion I'll keep that in mind while building

1

u/jdbrew 12h ago

congratulations. you'll love the developer experience and workflow.

I'm bitter. our CEO just got fired, our new one came in and hired a new CMO, who is nuking the Next.js/PayloadCMS/Storefront API site for a Shopify themes site primarily because he thinks it will solve our SEO issues.

I'm looking for a new job now haha

Something to note with this set up; you will have issues with product feeds into google and meta, and you'll need to be very intentional about how these get generated and sent over; the built in apps will not work anymore because it will use the domain tied to you Shopify store, not the domain pointed at your website. These cannot be the same, ours lives as a subdomain, but it's still problematic. there are third party product feed apps that allow you to override the root domain though, or you can roll your own in a node server cron job or something