Skip to content

Commit

Permalink
docs(README): Add image and link to demo
Browse files Browse the repository at this point in the history
  • Loading branch information
ff6347 committed Nov 20, 2023
1 parent 720a853 commit 721e74b
Show file tree
Hide file tree
Showing 2 changed files with 13 additions and 2 deletions.
15 changes: 13 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,16 +1,27 @@
# P5 Code Sandbox

<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->

[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors-)

<!-- ALL-CONTRIBUTORS-BADGE:END -->

Small experiment to have a code sandbox for testing p5.js code. Based on [this blog](https://joyofcode.xyz/create-a-coding-sandbox) post "Create a JavaScript Code Sandbox" by Matija.
![](docs/assets/p5-code-sandbox.png)

Experiment to have a code sandbox powered by Monaco editor for testing p5.js code. Based on [this blog](https://joyofcode.xyz/create-a-coding-sandbox) post "Create a JavaScript Code Sandbox" by Matija.
The idea is to be able to build a documentation page for sketches produced during seminars, like in my seminar [gestalten-in-code](https://interface.fh-potsdam.de/gestalten-in-code/) but have all the sketches editable in the sandbox.

**See a demo over at [p5.inpyjamas.dev](https://p5.inpyjamas.dev/)**

## Features

Current feature set is limited but it can:

- Save changes to local storage
- Control via component prop if changes should be saved to local storage
- Control via URL SearchParameters if the local storage should be disabled
- Format using Prettier
- All the great features Monaco has.

See [@ff6347 p5js code sandbox project for planned features](https://github.com/users/ff6347/projects/2/views/1)

Expand Down Expand Up @@ -89,4 +100,4 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d

<!-- ALL-CONTRIBUTORS-LIST:END -->

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!
This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!
Binary file added docs/assets/p5-code-sandbox.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 721e74b

Please sign in to comment.