I found the barrier to entry was unnecessarily frustrating due to the lack of a _good_ beginners tutorial calling out common pitfalls. But don’t let this sway you, because once you move past this, it is really fun.

Here are the things they don’t tell you about getting started.

1. You should download the basic examples zip from the their site.
2. You’ll want to grab the processing.init.js and the processing.js from the zip or tarball to include on your page.
3. As you begin coding you must tag any processing.js script on your page with

   <script type=“application/processing”>
   //your script here
   </script>

4. You must have a corresponding

   <canvas width=“200px” height=“200px”></canvas>

   tag after your script in order for it to render the drawing. Make height and width whatever size you’d like.

5. Another note is that you can have multiple canvases on your page, you’re not limited to one.
6. The processing.init.js looks for

   <script type=“application/processing”></script>

   tag on your page and performs the processing.js initialization, if you don’t have this included on your page nothing will be drawn.

7. An alternative to using the processing.init.js and <script type=”application/processing”></script> is to use the datasrc attribute on the canvas tag.

   <canvas datasrc=”your_processing_script.js”></canvas>

These are just some of the things I ran into and I hope this helps anyone trying to get started with processsing.js. Next time I will post something using the processing.js library.