How to get preview in a separate window

I don’t believe you can separate the windows when you’re using Web Editor. What you could do however, although it’s a little bit of extra work, is setting up your own local server and run your p5 sketch locally from your computer (so instead of doing everything via the Web Editor). This requires the following steps:

  1. Make sure you have a text editor, such as Sublime Text for Mac.

  2. Make a folder on your computer with the files index.html, style.css, and sketch.js. You can copy-paste the content for these files from your Web Editor sketch. Click on the little arrow below the play button and you’ll see the three files.

  3. Set up a local server using one of these methods.

  4. Open the files from step 2 in your text editor. Each time you edit one of the files, save it and the local server will instantly update your p5 website.

BAM! Fullscreen p5 sketches are now possible :slight_smile:

2 Likes