How to use Stack Snippets of stackOverFlow with react

Hello,
I try to show my code in stackoverflow forum using their Stack Snippets. I posted my question in their forum but I don’t have answer.
https://stackoverflow.com/questions/72552859/how-to-make-a-react-stack-snippet

My code woks well with codePen:

Is there someone could help me here and say me what’s wrong ?

did you try reverse engineer this?! or start with a very basic ‘react app’ and see if that works well in ‘stack snippet’ view?

Sorry I don’t know what’s you mean. My aim is to learn how to use ‘stack snippet’ with react in order to be able share my work and ask questions in the futur.
My code work in my VsCode file and with stackblitz, codesandbox, codepen platforms but not in this ‘stack snippet’.
So I just would like to know why ?

thats why im saying, have you tried with a ‘hello world’ program and preview it in “stack snippet”?

No, because my code in not so simple. I don’t understand why you ask me that. Furthermore I can’t remove the code now in order to make this test.

:grinning:

im saying this, because that will then tell you if there is any fundamental library or ‘transpiler’ would you need for that to preview it in ‘stack snippet’ or not

:nauseated_face: I followed this guide to make it.
https://meta.stackoverflow.com/questions/338537/how-do-i-create-a-react-stack-snippet-with-jsx-support

Could you confirm me that people reading my stack post can have access to my “stack snippet” in order to correct it ? I ask this because few minute ago I try to modify it but when I oppennig it, it’s empty :joy:
Oooo !! I think I don’t know really how that’s work.

May be it’s possible for people to make a copy in order to correct it ?

when i try to run this snippet, i see couple of errors, and seems to me very fundamental sorts of that!!
image

and guide that you are using it over 5 years old!! so could be obsolete!!

better start with a ‘small program’ and see if you can see that in ‘stack snippet’ or look for guidelines which are more recent for that matter!! good luck :slight_smile:

it’s seems there is no other guide :joy:

why not simply use codepen or others like it instead!!

Because one day I had a problem with small code (not react), so I posted the codepen link and the guy stackoverflow (moderator) said me that the better way is to use the snippet because the snippet still attach to the post. As the code in the codepen can change or be deleted is not good.
Also I thought that a good way to make people in order to be able to modify directly the code.

The guide is up-to-date you can tell because it has React 18 specific code. Also, did you read the comments on that guide, it specifically has info on react-bootstrap.

Pretty sure the error is caused by react-bootstrap (the require error). If you are not using the components you don’t need the library but just the normal bootstrap CSS. If so, you can just remove react-bootstrap.

1 Like

It’s not funny stackoverflow for now for me. :rofl:
If I want to edit my post then modify the snippet, I clik on:
stack snippet
The the snippet opening but it’s empty :crazy_face:

If copy the snippet in a new answer, it’s the same.
So how can I modified it ? :innocent:

This StackOverflow thread might help - it shows how to edit a snippet.

1 Like

Yes, thanks I will try tomorrow.