Discussion about using NextJS with Sanity and Shopify integration

12 replies
Last updated: Aug 31, 2021
is the best/working guide to NextJS + Sanity is this paid course? https://www.udemy.com/course/nextjs-with-sanity-cms-serverless-blog-app-w-vercel/
The default template starter doesnt work and the rest of templates seems outdated
https://www.sanity.io/create?template=ndimatteo%2FHULL
I don’t mind paying for the course but just want to make sure that it works
AI Update

I understand your frustration with outdated templates – this is a common pain point in the rapidly evolving Next.js/Sanity ecosystem. The good news is you don't need to pay for that Udemy course to get started with a working Next.js + Sanity setup.

Current State of Official Resources

The official Sanity templates page has been recently updated with modern starters that work with current versions. Specifically, check out:

Clean Next.js + Sanity app - This is the official, actively maintained starter featuring:

  • Next.js 15 (latest version)
  • App Router architecture
  • Sanity Studio v3
  • Visual Editing with Live Content API
  • One-click Vercel deployment

Schema UI - Next.js Sanity Starter - A more comprehensive option with:

  • Next.js 15, Tailwind CSS, shadcn/ui
  • Production-ready components with matching Sanity schemas
  • Live editing capabilities

These are battle-tested and maintained, unlike many community templates that haven't kept pace with Next.js 13+ App Router changes.

About That Udemy Course

The Filip Jerga course you linked ("Next.JS with Sanity CMS - Serverless Blog App (w/ Vercel)") was last updated for Sanity v3 and Next.js 13. While the fundamentals remain relevant, there have been significant breaking changes since then:

  • Next.js is now on v15 with route params requiring await
  • Changes to how Draft Mode works
  • Updates to the next-sanity package
  • New API perspective defaults (changed to published not raw as of API v2025-02-19)

So while the course teaches concepts, you'd likely encounter version mismatches and need troubleshooting that isn't covered in the course material.

Better Learning Path (All Free)

  1. Start with the official Clean Next.js template linked above - it includes everything you need and deploys in minutes

  2. Use Sanity's official documentation for modern patterns - the App Router integration docs cover Visual Editing, draft mode, React Server Components, and more

  3. Follow Sanity Learn courses at sanity.io/learn - these are kept current with the latest versions and cover real-world implementation

  4. Join the Sanity community on Discord/Slack - incredibly helpful for troubleshooting specific issues

About HULL and Other Templates

You're right that HULL hasn't been updated for App Router patterns. The community has largely moved to simpler, more focused starters that are easier to maintain. The official templates are now the recommended starting point.

If you want something more full-featured than the clean starter, check out:

Bottom Line

Save your money. The official Clean Next.js + Sanity template or Schema UI starter will get you further than an outdated paid course. The Sanity documentation is excellent and free, and you'll be working with current best practices rather than patterns that need updating. If you hit specific issues, the community is very responsive and helpful.

perhaps I could create a more elaborate warning message here, but you need to: (1) create a page from the “Other Pages” panel, (2) Go to the “Settings” -> General panel and set the page you created as the home page. Once you do that, navigating to the area in your screenshot above will show you your home page
ah i see now that makes sense. After creating pages from “Other Pages” now in Settings I can choose a page from dropdown. The only section that doesn’t is the “Shop” but I am guessing that is more around having to create “product” in Shopify first?
I keep playing around now knowing this is expected and require some configuration. Thank you!
“Shop” is similar, in that you need to first setup a shop “Collection” (Shop -> Collections), then you’ll be able to set it from the settings dropdown 🙂
user J
yeah i think its this vercel thing not working therefore messing up some configs?

product creation - [your-domain]/api/shopify/product-update
Im assuming the webhook is also not working because i already made a Collection in Shopify but its not showing up on
localhost:3333
.
Anyways glad to know im super close and just need to figure out the configurations and it will work.
user U
the shopify webhooks shouldn’t prevent Vercel from deploying, that’s a separate thing, specifically for sync’ing shopify products into Sanity. Also: Collections are setup in Sanity itself, not through Shopify.
user J
got it then i guess theres a gap in my knowledge because the cookie consent, promo bar, header/footer are all greyed now and i noticed after setting up the pages the error keep going on down the list.
I think for now rather than skip the basic i try out the youtube link content and get back to these.
Once I have more understanding i feel like i should be able to figure these out by myself.
user U
yup, you need to at least have a document saved for each setting panel (like the cookie consent). The reason it’s grayed out is because of the nature of Sanity schemas. I touch on this in the readme file (under the Sanity section, below step 5):
I’d definitely brush up on some of the basics first, and then give this a shot 🙂
yeap this is the part in which i believed i messed up the setup because i dont understand what it means. I took it literally and commented out in the code and not sure what really happens 😅
the rest of the instructions took awhile but quite confident i followed them accurately.

I'll take that advice and pick up the basics first. All good then and thanks so much for the help and HULL!
user J
hey
user J
just want to share this mini wins, I managed to get it to deploy on vercel now 🙂

https://hull-ajmalafif.vercel.app/
next challenge is to get the Shopify parts working. I followed the instruction quite closely for Shopify part (to avoid gotchas) but somehow unable to figure out (just yet) how to make it work.
Awesome
user U
! For Shopify I’m not sure what you’ve set up, but products will only show up once they are sync’d from Shopify. This requires the shopify webhook notifications to be properly setup with your vercel hosted site, and then you’ll need to trigger them by creating/updating/deleting products from your Shopify account.
got it thanks for guidance!
yea so far i think im getting all the required keys and use it for both env.local and vercel env. On shopify side im quite familiar as i am a shopify experts designer (so some of these stuffs i have limited knowledge tho)

ill tinker around and it seems i'm so near to get it all working. Thanks again!
user J

Sanity – Build the way you think, not the way your CMS thinks

Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.

Was this answer helpful?