Skip to content
Quinton Ashley edited this page Dec 1, 2024 · 43 revisions

Quick Start

The fastest way to use p5play in your own projects is by using an online code editor.

Visit p5play.org and scroll to the "No Installation Required" section.

Using p5play with VSCode

I highly recommend using p5play with Visual Studio Code.

  • its free, no storage limits or fees
  • available on Windows, macOS, Linux, and even Chromebooks
  • provides intelligent code completion and error checking
  • provides hover-over documentation
  • has built-in terminal and git support
  • its an industry standard tool

Using VSCode might take some time to set up, but it's worth it!

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

Use the extension to easily create new p5play projects from the p5play-template.

Upload your sketches to the internet for free using GitHub Pages, check out this video from The Coding Train (Dan Shiffman) on how to do it! https://www.youtube.com/watch?v=ZneWjyn18e8

Using p5play with npm

If you simply download the p5play.js library and link to it in your html for local use, you'd have to keep downloading it from the website to keep it updated.

It's better to use a package manager, install bun or nodejs+npm. Then in the VSCode file menu hover over "Terminal" and select "New Terminal". In your p5play project folder run bun update or npm update and use the local links in the html file.

Clone this wiki locally