Get Started

Quick Start

p5play can be used with online code editors such as the p5.js web editor and OpenProcessing!

Visit p5play.org to learn more.

Using p5play with VSCode

Although online code editors can be an easy way to get started using p5play, they don't provide the best coding experience.

I highly recommend using p5play with Visual Studio Code.

• it's free, no storage limits or fees
• available on all platforms, even Chromebooks
• provides intelligent code completion and error checking
• provides hover-over documentation
• has a built-in terminal and git support

By using VSCode instead of an online code editor you can gain experience with an industry standard tool.

Download Visual Studio Code, then add the p5play VSCode extension.

Use the extension to easily create a new p5play project:

1. In VSCode's menu, select view then click "Command Palette..."
2. You should see the Command Palette appear, type "p5play" into it
3. From the list of options that appear, select "p5play: New Project"
4. Create or choose an empty folder to put your project in.
5. Start coding!

The p5play-template folder contains a basic p5play project that can be used as a starting point for your own projects.

Installing the p5play VSCode extension will also install Live Server. This extension enables you to run your projects in a web browser. Click "Go Live" in the bottom right corner of VSCode to start the server.

Use p5lay with npm

If you want to be able to easily update to the latest version of p5play locally, install bun or nodejs+npm. Then in the file menu hover over "Terminal" and select "New Terminal". In your p5play project folder run bun update or npm update.