Starting with Builder.io + Shopify + Gatsby

[Rausa13]

Hi,

I’ve been back and forth with a few people on that chat messenger and was advised to bring it to the forum, so here we are!

I’m trying to accomplish setting up this Gatsby Starter: https://github.com/BuilderIO/gatsby-shopify-builder-starter-minimal

Because of the last 5 commits that was mentioned by the team it seems like a perfect starting point and exactly what I need.

This issue is when using the starter, it doesn’t come with the link to generate the required builder modals that the original Gatsby + builder.io starter provides from : https://builder.io/fork-sample-org.

Without this I have found it quite complicated to get this specific starter setup and working.

If there is a type of link to generate the required modals and pages for the mentioned starter that would be great, or any other help I can get.

Thanks,

[kara]

To use that starter you need to add the needed models. From https://builder.io/models:

1. Create a model named Global Component with the “Component” type and set the editing url to http://localhost:8000.

2. Create a model named Landing Page with the “Page” type and set the editing url to http://localhost:8000.

3. Create a model named Page with the “Page” type and set the editing url to http://localhost:8000.

4. Finally, create a model named Product Page with the “component” type and set the editing url to http://localhost:8000/products/some-product-handle-of-yours.

If you’re running into difficulty, we do have a more robust starter coming in the next few weeks and a bunch of getting started docs that will provide guidance as well. We’ll follow up when it’s released!

[Rausa13]

Hi!

That is perfect, exactly what I was looking for. This starter makes more sense now, I didn’t know you were registering components from the starter that appear to be used in the builder.io page.

My only last confusion would be registering components from Builder.io into the gatsby code. I have a component js file that looks like this, and wanting to import this into the navigation. Not sure if this is the right code for implementing builder components into gatsby.

Thanks, this is great help here!