An open-source playground that supports Civet

[hatemhosny]

Thank you for such a nice project.

Please allow me to introduce LiveCodes, a feature-rich, open-source, client-side, code playground that supports 80+ languages and frameworks. The announcement post gives a general overview.

Civet is one of the supported languages.

Civet starter template is available for a quick start: https://livecodes.io/?template=civet
(see all starter templates).

You can start an empty Civet project using this link: https://livecodes.io/?civet

There is a compiled code viewer (that shows compiled JS code), integrated console and test runner. Modules can be imported from npm, denoland, GitHub and others.

Projects can be shared, exported and deployed (to GitHub Pages), in addition to a lot more features.

There is even a free AI code assistant (similar to GitHub Copilot).

Playgrounds can be embedded in any webpage, using a powerful, yet easy-to-use, SDK.

This is an example for an embedded Civet playground:

<div id="container"></div>

<script type="module">
  import { createPlayground } from 'https://unpkg.com/livecodes';

  createPlayground('#container', {
    params: {
      civet: "console.log 'Hello Civet!'",
      console: "open",
    },
  });
</script>

Preview

Please refer to the SDK documentations for details.

Comprehensive documentations are available with live demos, code samples and screenshots.

LiveCodes is open-source, free with unlimited usage, no ads and no account required. It can be easily self-hosted (if you want), and can be used for commercial projects (MIT license).

Disclosure: obviously, I'm the author of LiveCodes.

I thought you would be interested to know about LiveCodes. Otherwise, please feel free to close this.

[dux]

Very nice, thx