"Getting Started with Instance Mode" Tutorial

[ksen0]

Topic

p5.js supports both "instance mode" and "global mode." This sketch shows the difference:
https://editor.p5js.org/p5/sketches/Instance_Mode:_Instantiating

Please share your confusions!

If you've had a confusing experience with instance mode in the past, please share how that was even if you don't want to work on the tutorial!

The task: translate existing materials to be more beginner-friendly

Here is the p5.js wiki entry explaining these ideas: https://github.com/processing/p5.js/wiki/Global-and-instance-mode

If you've found these resources a little daunting in the past, please feel free to set up a more approachable tutorial to be featured on the p5js.org website. This means creating a getting-started-with-instance-mode.mdx in main/src/content/tutorials/en.

Although there is an upcoming release of p5.js 2.0, the first version of this tutorial can focus on 1.x; but it might need to be updated for the 2.0 version of the website.

(This task is inspired by the discussion in processing/p5.js#7332 and processing/p5.js#7670, so feel free to check those out too.)

How to create a tutorial

Here's an example tutorial about a different topic: https://github.com/processing/p5.js-website/blob/main/src/content/tutorials/en/getting-started-with-nodejs.mdx?plain=1

[soumikadevarakonda]

Hello @ksen0, I would like to work on this issue. I'll start making the doc on instance mode. Please let me know if there are any specific requirements that I need to consider.

[ksen0]

Hi @soumikadevarakonda (and anyone else reading)! I closed the PR above because it was too high-level and did not use the existing resources or make them easier to understand. So I wanted to clarify a bit more what the task here is.

All interested contributors, please also read through the contributor guidelines, which include:

You should not file a pull request (or start working on code changes) without a corresponding issue or before an issue has been approved for implementation; that is because the proposed fix may not be accepted, need a different approach entirely, or the actual problem is somewhere else. Any pull requests filed before the issue has been approved for fixing will be closed until approval is given to the issue.

In this case, if you want to work on this topic, please post below what's your approach/plan for taking the existing detailed wiki page and making it more beginner-friendly as a tutorial. You can look at the other Tutorials on the site; note that they have code examples, diagrams, notes, and many linked references, so this definitely is not a quick project! But if you're familiar with p5.js and instance mode, it's a great first project to work on to get introduced to contribution.

[calebfoss]

Great plan for a tutorial! Another reference for whoever works on this: I created an example that gives a quick intro to this concept: Multiple Canvases