Feedback and discussion about the challenges and learning curve of using Sanity.io and Gatsby together.

A possibility to use kitchen-sink without any connection to netlify or github, locally to get deeper into the way Sanity is linked with Gatsby

You could clone this repo and use the contents of its

template

folder locally: https://github.com/sanity-io/sanity-template-kitchen-sink

Thank you (Removed Name), that is what I started to try this morning.

this is feed back:I have taken the repo from template folder,
put in into a blank clean studio.
(I haven't done the gatsby part yet)
the problem I face is that I would have like to see the example like in the video but everything is blank so that it is a lot of work to create post and so on, to just see if it is like in the video.
I tried to set with the account of (Removed Name) (like it is appearing in the github repo) but there is a matter of authentification so that it is impossible.
So it is complicated.
I mean that I would like to have a look, then to hang on with my personal project.

Second thing:I am surprised to see the number of negatives opinions on the video of
: 14 towards 64, its a lot!Personally I don't think that the video is negative: I like the idea and the project is great (I don't think it sufficiently positive either though).
Toward the pedagogy (and style) of
it is certainly difficult for !But moreover, generally (I hope I am not going to shock anybody over there) I feel that there is a weak point in the Sanity strategy as there are many persons like me as far as I can see in the slack channel, that are not really sufficiently talented to immediately get into the refinement of Sanity and they end «lost in translation».
I mean clearly see that there is something great to learn, master, but not been able even with motivation to the point without lot of effort and pain.
I would like not to be missunderstood here: I have received great support from the community each time I needed it.
But as a feedback, I think there is there a marge of progression.
Right now, in my project (sanity + gatsby + localization) I just have the choice between a superb «everything ready beyond expectations under the hood» and a «you can customize everything».
I feel there is a lack of clues to LEARN in between and clearly get what is going on «under he hood».
You are doing your best, the documentation is evolving.
There are the videos of
and there are great because short, pedagogic...About Twitch, I am not convinced: it's endless, lost of hesitations, self contentment also because of social positions.
In my case, I would like to understand more precisely how Gatsby is linked to Sanity, I mean, there are many ways to link it: what I saw from the example of the kitchen sink is far more interesting than what I thought it would be.
I mean: it's beautiful work, I would like to get into that beauty, but I face a wall as I am not aware of the technical principles that are taking form there.
So there is definitely something to invent to point out the different concepts so that it is possible for me to dig into the subject and find my way over.
(I would like to change the example in the kitchen-sink to a different routing system, that would make localization completely arbitrary, that is to say the slug of a post in a language would not be the slug of a post in another language)
I mean: I will find my way over and my project is going to be beautiful.
What I am writing now is a feedback for the Sanity team: your project is really great, it's deserving to be more known and popular!

Re reading what I wrote, I am thinking that what is may be missing is just elements of information describing what «is under the hood».

Thanks for the feedback ! There’s a lot to unpack here, but I think we generally agree: We need more pedagogics around the different parts of Sanity (and integrating with it), and it needs to be chunked into smaller piece, and we need to account for more experience levels.
And we’re working on it!

We made /create in order to give people a faster experience on how Sanity works together with popular frameworks, because JAMstack does require a bit of work to get up and running (and there’s a lot of pieces). However, you lose the “progressive disclosure”, where you learn how the different parts and how it fits together “from the ground up”. And we need more content around the latter.

Thanks I was very much afraid of be taken as a critic: this is not at all my point.
I love Sanity so far, even if it is difficult right now for me, but because of my lack of knowledge.
Things that would be very easy to do right now:
to allow examples to be fulled.
For instance, for the kitchen-sink to provide some guidance in order to have it set exactly like in the video.
It would be an open count or a template.

[My particular difficulty was that I already have a Netlify repo that I use with the beginning of my project.Therefore to test it with create forces me to change plan on Netlify... while it would be just for testing...]

Ah, we weren't aware of that limitation! We have talked about making it possible for you to launch without having to deploy on Netlify, so this is +1 towards that feature

Great!

I'm still in trying to populate the kitchen sink.To tell about where I am and what I do:
• it is difficult to find out the relationship between Frontpage, Page Builder, Blog and Pages inside Page Builder.
• I have the Content Mode Graph plugin that helps a little but...
• Isn't a Front Page a page also?
• Page Builder = element to build a page?
• Front page = root of the project?
I think I'd better look the video again...

I am now with the setting of the gatsby part:I am not quite sur (as I am away from the track) where I should define the dataset, the project id...
There is an env.production already: is this just for production?
Should I make a separate env.development aside
or is that has been automatically created?
As I have two datasets and development is already used, I am now on production for testing but...

help ideas-and-feedbackok I have set the gatsby part of the

kitchen-sink-demo

from scratch step by step from previous post.I am pretty proud of myself because it seems not too bad.
I have little errors that seems to me on details but (!) (at the end of the process at least).
I tried to solve that alone but I don't really get the point:
1.

Latex.js

exists (there is a

useCallback

in that is not used) (location is different: in the error message

components\Latex.js

in reality

components\preview\Latex.js

) (there is

latex.js

and

Latex.js

) (there is also a

latext.js

in

schemas\latex.js

which is strange).2. for

cta-columns.js

it does not exist literally (only

ctaColumns.js

exists in

schemas/plug/ctaColumns.js

) (is this an error?)3. for

footer.js,

nothing in components as mentioned (is this the problem?) (nothing anywhere else in

schemas

)4. there are other errors: same thing: cannot see any

serializer.js

so it is probably coming with Sanity backend? Like for

helpers.js

,

page.js

Hi there!I really need help as I am running into errors and don' know at all what I can do.
Towards yesterday, I have solve a few things.
Please find below the last

WEBPACK ERROR messages

.Towards that I cleaned everything (deleted

yarn.lock

,

node_modules

,

cache

).I am installing the kitchen-sink example (

project folder

>

web

and

studio

folders under, orchestrated by

lerna

on top).Contrarily to the example, I am not using

npm

but

yarn

(would that be a problem?) (I have modified the commands as much as I could to adapt by there are probably some I haven't seen?).Any help very much appreciated ☆

help

let's precise: I can't see anything on

localhost:8000

, nor in the

studio

,

Web preview

.

What node version are you on?

node -v

v10.15.3

(thank for your help ☆)

I would try to upgrade node – it's on 14 now

let's do that

That's what I got from searching your errors and leafing through github issues for gatsby at least

let's do that first yes!

installation is taking some time (several minutes)

still going on!

it is still not completely finished but the installed node version is not v14 but v12.16.3 (I am on Windows x84).

I have to reboot my computer. Let's do that.

Node v12 is fine, that’s the latest LTS (long term support) version

Thanks ☆ let's reboot ♪

Hello (Removed Name). Glad to see you!

Unfortunately, I still have the same errors (I joined 2 screen captures so that you can see the whole log from start)

Could you try removing your

.cache

and

node_modules

folders, as well as your

package-lock.json

file, and running

npm install

before trying once again?

yes

could you precise in all folders? (root? web? studio?)

In your web folder, and also check for any

yarn-lock.json

file there (if it’s there, remove that one too)

ok so web folder first

(Just the web folder, no need for the others in this case)

Understood!

Also, after running

npm install

, do a

gatsby clean

before

gatsby develop

, just in case.

Before, I was going to root (

francois-vidit-2-2-com

folder) then command

yarn run dev

that would action remote

gatsby clean

and

develop

from there.Could you confirm that you want me to do from

web

,

gatsby clean

and

develop

?

The root folder uses

lerna

to run a bunch of things at the same time, including the studio build. That’s totally OK so you can do that instead, but it’s a bit quicker to test just the Gatsby build if you run

gatsby develop

in the web folder. If that completes successfully, you can go back and run

yarn run dev

in the root folder like before.

Something strange after npm install for information:
I tried to do

npm upgrade gatsby-source-sanity@5.0.6

but I missed itso I did

uninstall

then

install gatsby-source-sanity@5.0.6

.It is now therefore

5.0.6

.

I just read now your previous post.First, thank you.
Second, yes let's do that now!

Here is what I have now.A problem with react-helmet,
the same errors as before.
It seems that helmet is not correctly imported for some reasons.

my version of react-helmet:

react-helmet@6.0.0

implies some breaking changes:
https://github.com/nfl/react-helmet#readme

How are you importing Helmet on your page? As follows?
Also, we seem to have some more information on the WebPack error: No PostCSS config found.

I don't know what page we are talking about,because it's from the kitchen-sink example I am discovering.

Do you have a

postcss.config.js

file in your web root?And you can try downgrading to Helmet

^5.2.1

for now. It’s just a warning though, so it shouldn’t prevent your build from completing.

ok so I regressed to react-helmet@5.2.0,got out of the react-helmet error.
the other errors are still there:
• footer.js
• serializer.js
• helpers.js
• page.js
• then the webpack errors.

No I don't (have any

postcss.config.js

).(as there were none in the

kitchen-sink repo

)

There should be: https://github.com/sanity-io/sanity-template-kitchen-sink/blob/master/template/web/postcss.config.js
But if not, please create that file in your web folder with the following contents:

You can ignore the warnings for now, let’s focus on the errors
🙂

O K ! ! ! !Hurrah ! ! !
I have a beautiful page on localhost:8000
Thanks to you (Removed Name)!
(I would really not been able to get out there alone!)
♪ I am so happy ☆

I still have some errors,here there are

Sorry (Removed Name),I got myself confused again,
I am not getting errors,
but only warnings.

That’s good news, right? 🙂 Looks like you’re up and running again 🚀
Regarding the warnings, try searching for

ESLintError

and the specific warning code, such as

no-unused-vars

to better understand what the warning is about and how you might resolve it. There should be plenty of explanations out there and it’s completely normal that these warnings show up from time to time.
The three

no-unused-vars

ones, for example, are just about not having unnecessary code in your files. If you don’t plan on using e.g.

useState

in the page template, you can remove that line and the warning should disappear.

As you can imagine,it's working also perfectly in the studio now!
the preview is really nice!
(there are plenty of things to see, change, understand!!!)
Thanks, thanks, thanks ☆
(I feel exhausted, I have to make a break to realise the new situation - I need to
rebuild!) (Ah ah ah!)I feel really grateful of your help.
T H A N K Y O U ! ! !

Do a

francois clean

and

francois develop

and you should be back in the game 😛

just took knowledge of your new post,I will do that.

Also a

François upgrade

🤣That is really funny.

I have a question:are you located in Norway, in San Francisco, or somewhere else?
I would bet for Norway.

That might take a moment to resolve 😄 Sanity as a team is currently working remotely from home because of the circumstances. But normally it is based in both Oslo and SF. Personally, I’m working from Spain and sometimes from the Netherlands, so I’m a bit of an exception to the rule.

I can't help thinking that it is a situation pretty much like those intellectuals of the end of the XVth century all over Europe (Erasmus particularly meaningful to you if you are sometimes in the Netherlands) that would have latin in common...At the same time, completely different backgrounds,
and at the same time, lots of things in common...
All with probably the same conscience of being part of a very bif change, at the same time as lots of dramas...

(Removed Name) into the place!