Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/henryhale/livecode
⚡️ Minimal code playground
https://github.com/henryhale/livecode
beginner-friendly code-playground codemirror6 henryhale live livecode-editor livecoding minimal vue vuejs
Last synced: 3 days ago
JSON representation
⚡️ Minimal code playground
- Host: GitHub
- URL: https://github.com/henryhale/livecode
- Owner: henryhale
- License: mit
- Created: 2023-03-14T13:58:38.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-06-06T06:42:19.000Z (5 months ago)
- Last Synced: 2024-11-07T06:40:27.721Z (6 days ago)
- Topics: beginner-friendly, code-playground, codemirror6, henryhale, live, livecode-editor, livecoding, minimal, vue, vuejs
- Language: JavaScript
- Homepage: https://henryhale.github.io/livecode/
- Size: 504 KB
- Stars: 7
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: .github/CONTRIBUTING.md
- License: LICENSE.md
Awesome Lists containing this project
README
![](./public/brand.png)
LiveCode
A front-end code playground tool right in your browser. It's intended for use wherever possible most especially, live coding sessions for front-end developers.
![](./media/screenshot.png)
## Features
- Easy to use
- Minimal and fast
- Live updates and preview
- Builtin IDE with syntax highlighting, suggestions, and more
- Local storage for backup (CTRL + S to save and automatic restore)## Demo
Try this demo online: [Click Here](https://henryhale.github.io/livecode)
## Why?
I needed an offline tool to quickly learn and test front-end code (the basics). There are many code playgrounds online that offer much more but I intended to create a minimal, zero-config and easy to use playground.
If you need a more fully fledged online code playground, try;
- [StackBlitz](https://stackblitz.com)
- [CodeSandbox](https://codesandbox.io)
- [CodePen](https://codepen.io)## Get Started
[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/henryhale/livecode)
## Install
To setup `LiveCode` locally, follow the steps below;
- Clone this repository
```sh
git clone https://github.com/henryhale/livecode.git
```- Install all dependencies
```sh
pnpm install # or npm install or yarn install
```- Run dev server
```sh
pnpm dev # or npm run dev or yarn run dev
```## Bugs, Issues and Contributions
I'm glad you took time to check `LiveCode`. Thank you very much.
All contributions are welcome, please follow the steps [here](https://github.com/henryhale/livecode/blob/main/.github/CONTRIBUTING.md)
For any bug or issue, kindly open one [here](https://github.com/henryhale/livecode/issues).
## Credits
Thanks to these amazing projects, `LiveCode` heavily depends on them;
- [Vue.js](https://vuejs.org)
- [Vite.js](https://vitejs.dev)
- [TailwindCSS](https://tailwindcss.com)
- [CodeMirror](https://codemirror.net)
- [LowDB](https://github.com/typicode/lowdb)## License
Released under [MIT License](./LICENSE.md)