Add imgs folder under snippets

[zhongdeming428]

I do think there should be a folder named imgs or pics under snippets for storing some pics that illustrated the code if needed.

[skatcat31]

You mean a folder for storing rendered examples of the codes output?

[zhongdeming428]

You mean a folder for storing rendered examples of the codes output?

Storing some .gif files is better.

[skatcat31]

That's a rendered example of the codes output XD

[zhongdeming428]

Yes it is!The example can demostrate the code clearly.So it's better to add a folder for storing rendered examples, then we can refer it in the markdown.

[fejes713]

This is a great idea, it would definitely be useful once our code base grows. Only one concern about this, git in general is not so good for storing and tracking large files such as pictures, videos, gifs. Maybe we could make use of our Digital Ocean sponsorship and somehow use their storage plan.

Opinions on this one @Chalarangelo, @skatcat31 ?

[zhongdeming428]

GitHub repo can store files less than 1GB.A short demo .gif only takes no more than 200KB, for example :gif demo.

So that I think Digital Ocean sponsorship is not necessary,u can store files in GitHub repo tentatively.

@fejes713

[skatcat31]

@zhongdeming428 yes, but with no telling how big our repo may get it's a 'limited storage of unlimited potential' design flaw

[zhongdeming428]

All depend on u.Appreciate for ur receiving my suggestions.Thx!

[getdaydream]

Maybe using an online IDE to demonstrate the demo which allows people to fiddle with code ? Like stackblitz or jsfiddle.

[skatcat31]

@getdaydream that's not such a bad idea. If they have an API we can use to send the code over on click that might be useful. Or if they have an embedded one...

[getdaydream]

@skatcat31 I have tried StackBlitz API. You can either create a new project & open it in a new tab or create a new project & embed it on the current page. See sdk.openProject(project[, opts]), sdk.embedProject(elementOrId, project[, embedOpts]). And here is a live demo.

[zhongdeming428]

@getdaydream it's so nice! Looks like VS Code,more useful than codepen

[fejes713]

I like this idea as well. It will require some additional work but is definitely worth the effort. Being able to live test something before implementing is definitely a good addition.

[skatcat31]

So does this mean we'll have to go and create projects for each approved snippet? I feel like they probably have a web api somewhere for doing it programatically

[getdaydream]

@skatcat31 don't have to go and create projects. Just extract code from every markdown and send the code to this api(sdk.embedProject(elementOrId, project[, embedOpts])). It will create an anonymous project and embed it on the current page. In this way, we can generate live demo for every markdown and use it in docs website.And yes, additional scripts is needed.

[rishichawda]

@zhongdeming428 We can also use mdxjs if we want to display any demo or example since that would be easier to do rather than separately adding and managing assets.

[fejes713]

Closing this due to inactivity. We might move with this in the future.

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for any follow-up tasks.