![Cover image for [REQUEST] Allow embedding CodeSandbox from GitHub urls](https://forem.dev/images/Pg2xSkJ1aUK8EvXOlRf43hDbr96b45CF9ILOBflu1LM/rs:fill:1000:420/g:sm/mb:500000/ar:1/aHR0cHM6Ly9mb3Jl/bS5kZXYvcmVtb3Rl/aW1hZ2VzL3VwbG9h/ZHMvYXJ0aWNsZXMv/ZXFyNHZzNnFrb3lm/N3dkeDVzNjIucG5n)
Hello community!
I was writing my first tutorial series in dev.to where I would like to embed some CodeSandbox examples.
Currently this can be done in dev.to via liquid tags, like stated in Editor Guide.
{% codesandbox ppxnl191zx %}
The issues is that embedding seems to work only by sandbox ID, however the CodeSandbox have an awesome feature, that you may run a sandbox from GitHub repo/directory.
https://codesandbox.io/s/github
So we may use this type of url
https://codesandbox.io/s/github/modularcoder/tutorial-react-tree-menu/tree/master/stage4-react-router
However embedding this type of sandboxes doesn't seem to work in dev.to
{% codesandbox https://codesandbox.io/s/github/modularcoder/tutorial-react-tree-menu/tree/master/stage4-react-router %}
Would be really amazing to add this support which should be quite easy to implement I suppose.
That helps to embed the sandbox from the github repo, which can be constantly developed, so there is no need to manually update the sandbox contents every time when there are changes in the tutorial repo.
What do you think about this?
Thanks!
Top comments (3)
Looking at it there are 4 things we need to tell the codesandbox tag in order to get this to work.
We need to tell it:
githuband so not to expect an ID.modularcoder/tutorial-react-tree-menutree/masterstage4-react-routerThe codesandbox tag differs from the jsfiddle and codepen variants in that it only accepts an ID and won't try and work it out from the URL.
I think if we were to add this functionality we would want to be able to take a full URL and extrapolate from that.
After looking ad liqud _codesandbox partial render, I suppose if just the tag regexp validation would be extended, this might work out of the box.
github.com/forem/forem/blob/master...
So basically it would be allowing
github/{whatever}type of ids validationWhat about adding support for these type of ids to validation?
So wondering if extending codesandbox ID validation regexp will make it work
github.com/forem/forem/blob/master...