ideas
ideas copied to clipboard
open-source-ideas
Script/Page to convert gist to runnable demo
Project description
A JavaScript library which takes a link to a gist and for each file in the gist (e.g. something like this gist) it creates a syntax highlightet, editable input field, and the result of that file.
This can either be a script that you can include on your blog, or it could be a standalone web page where you can take a query parameter to a Gist ID and automatically create series of input fields.
This page or script can be used to create workshops, editable demo files, examples for documentation, etc.
One could also take this one step further and take a gist of a markdown document and look for code blocks. This way one could automatically make blogposts interactive just based on the Gist sha ID.
Relevant Technology
JavaScript, HTML, CSS, Web. Specifically Ace/CodeMirror, sandboxing javascript and running it in the browser.
Who is this for
This is for someone who sees the value of having the possibility of automatically creating interactive demos and editable code from Github Gists. Probably a medium timeframe project.
have you seen? https://github.com/viebel/klipse
it is widget like, where you are loading the script into an html document and initiate different editors with some code that can be from a gist URL: http://blog.klipse.tech/javascript/2016/06/20/blog-javascript.html#evaluating-a-gist
Interesting. Thanks for letting me know. This can definitely be used to achieve some of the things I was envisioning. But what I thought could be extra cool is to create a website/service that takes an ID to a gist and just makes the thing interactive. This you can do things like bookmarks to open a gist in the page, you could attach a runnable demo from more restrictive blogs such as Medium, etc.
Maybe https://github.com/viebel/klipse is enough, I don't know. What do you think?
If I remember correctly, there's a way to get gists imported in codepen.io. I checked that out a few months ago, but now I've forgotten it :(
One could also take this one step further and take a gist of a markdown document and look for code blocks.
1138-4EB/issue-runner is composed of a python script and a bash script. It allows to execute/run snippets of code found in the first comment of GitHub issues.
Here's my code for this: https://github.com/ChaseKnowlden/gist-loader.
