Headless commerce and custom storefronts with Shopify APIs and SDKs
Hi Shopify Dev Community,
For the past 3 weeks I have been attempting to understand the "Shopify Development Paradigm", I have
Embedded App Development:
Is there a better way to construct a local ( client) integrated development environment for developing embed apps with Shopify? Is there an a tutorial, repo, etc. demonstrating how to mock the Dashboard App Iframe in an external setup?
( I found this one, shopify-dev-frame, but it is 6 years old)
I spent an inordinate amount of time trying to suss out if there was something wrong with my ngrok set up that was making the Embed App stultifying-ly slow. I even purchased a subscription to Ngrok, creating permanent subdomains, and focused my watch in the nodemon, but this did not really improve the drag when interfacing with the embed app in the Store App dashboard. ( I am sure it is in part due to the hot module replacement, but not sure removing this capability is a good idea as it seems like it would a hinderance in the long run ) I installed the shopify-app-cli, after reading that it can help speed up app development. However, I found it to be sore lacking beyond generating some scaffolding, as there seems to be no way to get it to work with custom Ngrok subdomain. ( this definitely stung a bit as I am not out $60)
Storefront development both Theme and Pages/Views/infrastructure with a JamStack:
The tutorial/blog post I found that provides an approach to updating a theme using the Theme kit with React seems to be solely for that purpose. By that, I mean the tutorial does not delineate how ui-styling as well as the storefront infrastructure of pages, views, global state management, etc. is integrated into one unified environment. I have been searching in vain for a repo that would demonstrate a single stack for store front development using
NextJS ( page views with infrastructure, and perhaps global state (apollo client)
Custom Theme Development ( ThemeKit, using liquid templates) and ( Polaris ? if applicable)
NodeJs Koa or Express with ( GraphQL/Apollo)
Is this even possible or am I trying to fit my concept of a typical development env into Shopify development?
Can anyone offer a tutorial or repo that shows the whole stack in an integrated development environment?
Re: the JamStack question. It is a bit like putting your idea of standard development inside of the theme package. Yes, you can add React or a framework into the theme builder, but it won't fully follow JamStack principals. I would say focus on theme development (not Polaris, this would be for apps) with a custom theme and use themekit to build and develop. Otherwise, you can consider a headless approach using the Storefront API.
Re: embedded app building, are you utilizing https://shopify.dev/tools/app-bridge ? This will help get your app setup embedded into the admin. I would also post any app development questions in the general board here: https://community.shopify.com/c/Shopify-APIs-SDKs/bd-p/shopify-apis-and-technology
We're excited to announce improvements to the threaded messaging experience in our communi...By TyW May 31, 2023
Thank you to everyone who participated in our AMA with Klaviyo. It was great to see so man...By Jacqui May 30, 2023
Photo by Marco Verch Sales channels on Shopify are various platforms where you can sell...By Ollie May 25, 2023