Write Processing just like you would in the native Processing IDE, except it works in your browser and you can put your sketch in the web. The only difference is that you write code in Javascript instead of Java.
This repository serves as a template for writing responsive Processing code for web browsers. It is based on the p5js framework for Javascript. The template is ready to go, so you can instantly start writing code for your project and don't have to worry about the environment. You only have to work on one file and still have a working environment. By default, the HTML canvas displaying the code gets scaled full page and resizes with the browser window. Debugging works just as fine as in the native Processing environment when you use your browser console.
As this boilerplate code is meant to serve for experiments, none of the code is minified.
- Download or clone the git.
- Write your Processing code into
/js/main.js. You can follow the p5js workflow or write Javascript your style. - Change
index.htmlto your requirements (or do nothing to it). You can write HTML as you like and still have the Processing sketch in the background. - Launch your
index.htmland have fun.
Versions used in this compilation:
- p5.js v1.3.1 (minimized)
- normalize.css v8.0.1
- structure and HTML based on HTML5 Boilerplate v8.0.0s