LiveCodes avatar

LiveCodes

Official

@live-codes

0Followers
|
34Public Repos
|
15Published Skills

A Code Playground That Just Works!

Skills Distribution
DomainDeveloper To...Frontend Integration (40%)Browser-based Comp.. (30%)Documentation Engi.. (30%)

Agent Skills by LiveCodes

Showing 15 vetted skills indexed across 1 GitHub repositories.

live-codeslive-codes
1.5k

livecodes

Embed client-side code playgrounds in web apps using YAML frontmatter.

Official
Advanced
live-codeslive-codes
1.5k

livecodes/markdown-integration

Integrate LiveCodes with documentation sites to render code blocks as interactive playgrounds.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/configuration

Configure LiveCodes Playground behavior via Config object, URL parameters, and EmbedOptions.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/language-support

Configure per-editor languages, CSS processors, and WASM runtimes in LiveCodes playgrounds.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/self-hosting

Deploy LiveCodes to static servers, GitHub Pages, or Docker.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/headless-mode

Compile and run code headlessly via the LiveCodes SDK.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/module-resolution

Resolve bare module imports to CDN URLs via import maps.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/testing

Automate browser-based Jest and Testing Library tests in LiveCodes playgrounds.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/sdk-embedding

Embed interactive LiveCodes playgrounds into web pages with createPlayground.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/import-export

Import external code sources into LiveCodes and export projects as HTML, JSON, or ZIP.

Official
Advanced
live-codeslive-codes
1.5k

livecodes/gh-action

Generate LiveCodes playground preview links and post them as PR comments.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/getting-started

Bootstrap LiveCodes projects and playgrounds via CDN, npm, or self-hosted deployments.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/display-modes

Configure LiveCodes playground display modes via config, query parameters, or URL.

Official
Intermediate
live-codeslive-codes
1.5k

livecodes/sdk-methods

Control LiveCodes playgrounds programmatically via SDK methods like run and getCode.

Official
Advanced
live-codeslive-codes
1.5k

livecodes/framework-wrappers

Generate framework-specific LiveCodes SDK wrappers for React, Vue, Svelte, Solid, Preact, and Web Components.

Official
Intermediate

Frequently Asked Questions About LiveCodes

FAQPage Schema
What specific tasks can I perform with LiveCodes?▼

You can embed interactive, multi-language code environments into web pages, compile code headlessly, resolve bare module imports via import maps, and execute browser-based unit tests. It supports exporting projects as ZIP or JSON and provides programmatic control over playground instances through standardized methods.

Which frameworks are supported for integration?▼

LiveCodes provides dedicated wrappers for React, Vue, Svelte, Solid, Preact, and Web Components. These wrappers allow developers to integrate interactive playgrounds into their existing component-based architectures while maintaining full control over configuration, display modes, and runtime behavior.

What are the deployment and hosting requirements?▼

You can deploy instances to static servers, GitHub Pages, or Docker containers. The system supports bootstrapping via CDN or npm packages, allowing for flexible self-hosting configurations that do not require backend server-side processing for code execution.