NMD 105 Creative Coding I

P5js Pitfalls

Where to write code?

When to put code in setup, draw, or outside.

Horizontal whitespace usually doesn't matter, but consistent indenting helps debugging.

Vertical whitespace is always optional.

p5js reads from top to bottom. Don't refer to something now that isn't defined until later.

Punctuation and syntax

Double quotes "" versus single quotes '' versus backticks ``.

Every ( has a ), every { has a }, every [ has a ], but they are not always on the same line.

= versus == versus ===

let versus var versus nothing

Naming stuff

Capitalization matters: mouseX works, mousex doesn't

Use nouns for most variables: puppy, numberOfCats

Use verbs for functions: addBird(), detectCollision()

Use phrases for true/false (Boolean) variables: isFalling, hasParent

Don't abbreviate unless you have to: makeCloud is better than mkCld

Use "camelCase" to combine words: addBird is better than add_bird or addbird

Can't use the same name for a different variable or function.

Some names are already taken: width, mouseIsPressed

⚠️ Beware of Googling code

You won't understand it

I'm customizing each assignment to each student

🍀 Stack Overflow when you're lucky

☹️ Stack Overflow when you're not so lucky

Asking for help

Give enough info

• Make sure that you have created a p5js account (eg, "105-mary") in the editor at upper right, then save your sketch and copy the URL.
• Paste this URL in a post to #working.
• In the same post, describe the specific problem (think "I can't get the upper right box to line up" instead of "It's not working").
• Also paste in any error you see in the editor console at lower left.

Post to #troubleshooting!

• Your classmates can learn from your example.
• Your classmates may respond faster than your instructors.

To post privately

• Direct Message Katarina or me on Slack, though it may take us longer to reply.