Pawi Visual Live Coding in VSCode

A tool for live-coding using latest web technologies and Visual Studio Code.

Some information on the project on dev.to.

Core

• (VSCode extension)
• snowpack-pawi (Snowpack plugin for HMR live-coding)
• pawi (Types and linker)

Libraries

• @pawi/base (Basic blocks: animation setup, midi)
• @pawi/three (Three.js blocks: 3D programming)

What is Pawi ?

Pawi is a set of tools, libraries and editor helpers to make the creation of delicate and complex visuals simpler and faster by enabling:

1. Code reuse (once a block is created, it can easily be reused in new projects, stable inter-block API)
2. Code sharing (publishing blocks as npm package for others to use)
3. Stability (library versions locked with npm, versioning, clear API surfaces)
4. Fast feedback loop (live coding, visual programming)

The project uses the latest web technologies and tries to have the lowest possible impact on performance (a function call).

Getting started

1. Install VSCode extension Pawi
2. Clone sample project
3. Install dependencies
4. Start server: npm run serve and choose an example
5. Open project in vscode
6. In VSCode, open the corresponding file src/[example]/branch.o.json
7. Open hamburger for library and start editing or edit some existing blocks.

If you find this interesting, say hello :-) @maia_tae