Lab: Serial output from P5.js

Building on what I learned in the last lab about serial input from Arduino to a computer running P5.js, this lab was about reversing the direction and outputting serial data from P5.js to an Arduino.

The goal of this lab was to feed input from mouse clicks on the canvas of a P5.js sketch out to an Arduino to control the brightness of an LED. Here is the setup that I used:

And the circuit diagram and Arduino code:

void setup() {
  Serial.begin(9600);           // initialize serial communications
}
 
void loop() {
  if (Serial.available() > 0) { // if there's serial data available
    int inByte = Serial.read();   // read it
    Serial.write(inByte);         // send it back out as raw binary data
    analogWrite(5, inByte);       // use it to set the LED brightness
    // if you're using a speaker instead of an LED, uncomment line below  and comment out the previous line:
    //  tone(5, inByte*10);     // play tone on pin 5
  }
}

I was able to get this up and running with the P5.js sketch at this link.