Created
February 3, 2022 03:15
-
-
Save marimeireles/16ccf76910f0dd760f61a2f55bf5c17b to your computer and use it in GitHub Desktop.
How to add P5js to your webpage
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//HTML | |
//Either download p5js or use the CDN link: https://p5js.org/download/ | |
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<!-- Include p5.js library --> | |
<script src="p5.js"></script> | |
<link rel="stylesheet" type="text/css" href="style.css"> | |
<meta charset="utf-8" /> | |
</head> | |
<body> | |
<script src="sketch.js"></script> | |
</body> | |
</html> | |
//JS | |
let beginSize; | |
// Initializing the canvas size, background color and beginlSize value | |
function setup() { | |
createCanvas(800, 600); | |
background(220); | |
beginSize = 5; | |
} | |
//The draw() function is automatically called after the setup() function, which runs once at the program’s start. | |
//The draw() loop infinitely runs the code block inside the function from top to bottom. | |
function draw(){ | |
// Sets a red background color | |
background(255, 0, 0); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment