WebSockets

tutorial #12: Node.JS and p5.JS Tutorial

This tutorial covers how to use Node.JS, p5.JS, and socket.io (WebSockets) to create a shared HTML5 canvas across multiple browser sessions.

#12.1

Introduction to Node

13 Apr 2016

In this first video, I discuss the all the pieces required to create a shared, collaborative drawing canvas with p5.js, node, and web sockets.

#12.2

Using Express with Node

13 Apr 2016

In this video, I look at how to add express.js to your node application to serve static files.

#12.3

Connecting Client to Server with Socket.io

13 Apr 2016

In this video, I look at how to add socket.io to both the node server and the client JavaScript.

#12.4

Shared Drawing Canvas

13 Apr 2016

This video puts all of the pieces together: node, express, p5.js, and socket.io to show how to program a shared, collaborative drawing canvas.