Mannysbook is an easy-to-use code playground for Javascript/React. You can install any npm package within the editor.
To make installation as simple as possible you can run this code in any terminal/git bash to get running immediately
$ npx mannysbook serve
note: this does require Node version 14.x or higher.
After mannysbook is installed you will see a message prompting you to open localhost:4005 to view your code playground
Opened notebook.js. Please navigate to http://localhost:4005 to edit the file.
Mannysbook comes with a few flags to customize your experience.
By default Mannysbook saves all of the code you write to a txt file named notebook.js, so that the data persists between sessions. You can customize this by specifying a .js file to save everything to instead
$ npx mannysbook serve myFile.js
Mannysbook opens on localhost:4005 by default. You can change this with -p or --port
$ npx mannysbook serve -p {port-number}
$ npx mannysbook serve --port {port-number}
$ npx mannysbook serve -p 8080 playground.js
- You can use the
show()function to render anything inside it to the iframe - You can hover above or below any cell to show buttons to add more cells
- Any code written in a cell can be used in cells below it, code bundles from top to bottom.
- You can have text cells for documentation/comments (though you can still use regular JS comments). These text cells have markdown capabilities
- React/ReactDOM are programmatically imported
- the iframe has a root div
- you can import and use any npm package
- requires node v14 or newer
A quick instructional video can be found here: https://www.youtube.com/watch?v=0NybLaJEkuY
Message Manny Ledoux on the KenzieTown Slack or send an email to manny@aledoux.net to submit the bug you found. Please be descriptive!