3. Reto 3. Interacciones

3.10. Ejercicios

3.10.1. p5.js y HTML

Dificultad: fácil

Vamos a empezar desde cero. En esta actividad vamos a repasar cómo crear los archivos básicos que necesitamos para programar con p5.js.

1. Crea una carpeta para guardar tus archivos.
2. Abre tu IDE (Integrated Development Environment o, lo que es lo mismo, el programa que hayas escogido para programar).
3. Crea un archivo JavaScript (en muchos IDE creas un «Archivo nuevo» y, cuando lo guardas, pondrás la extensión .js).
4. En el archivo JavaScript copia las siguientes líneas básicas de p5.js:

   --->  	function setup() {
   				createCanvas(1500, 500);
   			}
   
   			function draw() {
   				  background(200);
   			}  
   

5. Crea un archivo HTML (guárdalo con la extensión .html).
6. Importa la librería de p5.js.min y tu archivo .js en el HTML.
7. Para comprobar que todo está correcto, abre el .html en el navegador y deberá aparecerte un rectángulo gris.