Control de un LED por WiFi con ESP32 y Arduino Cloud

¡Hola a todos! Bienvenidos una vez más al blog. En esta ocasión vamos a dar un paso fundamental en nuestros proyectos de electrónica: la introducción al Internet de las Cosas (IoT).

En este tutorial completo, aprenderemos a configurar la placa ESP32 para controlar componentes de forma remota, utilizando la plataforma oficial Arduino Cloud.

Referencia del material utilizado

Para aquellos que necesiten adquirir la placa, podéis encontrar el modelo exacto aquí: Placa ESP32 (Modelo del vídeo) .

(Este es un enlace de afiliación. Si decides comprar a través de él, recibo una pequeña comisión que ayuda a mantener el contenido del canal, sin ningún coste adicional para ti).

Índice de pasos del vídeo:

• 00:00 Introducción y motivos de la elección de la ESP32.
• 01:25 Registro y primeros pasos en Arduino Cloud.
• 03:10 Creación del "Thing" y configuración de variables.
• 04:45 Vinculación del dispositivo y Secret Key.
• 06:15 Configuración de las credenciales WiFi.
• 07:30 Instalación del Arduino Create Agent.
• 08:50 Lógica del código: encendido y apagado.
• 11:05 Diseño del Dashboard para escritorio y móvil.
• 13:20 Prueba final: Control remoto exitoso.

Conclusiones y próximos pasos

Como podéis ver, una vez superada la configuración inicial, las posibilidades que ofrece la integración de ESP32 con Arduino Cloud son inmensas. Este proyecto es el "Hola Mundo" del IoT.

Snap!: Estructuras condicionales

Hagamos que nuestro programa tome decisiones. Para ilustrar la explicación, desarrollaremos un programa en el que un personaje pregunte al usuario por el resultado de multiplicar dos números extraídos al azar entre 1 a 9. Si el usuario introduce la respuesta correcta, el personaje lo felicitará y deberá cambiar su postura o expresión en señal de alegría. Si no, deberá decirle que se ha equivocado y mostrará el resultado correcto. El proceso deberá repetirse una y otra vez en un bucle infinito.

En el enunciado de este ejercicio aparecen dos conceptos nuevos: por un lado decisión de actuar de un modo u otro según la condición de que se haya acertado o fallado en el resultado.

Por otro lado el cambio en el gesto del personaje si se acierta. Intentaremos explicar estas dos cuestiones.

En primer lugar elegiremos un escenario adecuado y cargaremos dos disfraces con diferente gesto para el objeto 1.

A continuación empezamos creando tres variables, una para cada uno de los dos números que hemos de extraer al azar y otra que utilizaremos para guardar el resultado de la multiplicación de esos números:

A las variables creadas les asignamos sus valores en el arranque del programa:

A continuación le preguntamos al usuario usando el bloque preguntar y esperar:

donde hacemos uso del bloque unir para componer nuestra pregunta. En este punto el programa espera la respuesta del usuario y tras introducirla es guardada en el bloque 

Por ello el siguiente paso será comprobar si la respuesta del usuario es correcta, es decir si respuesta es igual a resultado. Para ello hacemos uso del bloque si-sino de la categoría Control:

Si la condición se cumple, es decir, si el contenido de respuesta es igual al contenido de la variable resultado, el personaje deberá felicitar al usuario. Por ello, dentro de ese hueco, usamos el bloque decir y esperar configurado como se muestra:

Si la condición se no cumple, dentro del hueco sino deberemos decir al usuario que se ha equivocado y mostrarle el resultado correcto. Lo hacemos mediante:

Finalmente utilizamos un bucle por siempre para repetir todo el proceso indefinidamente y obligamos al principio del programa a que el disfraz del personaje sea el normal para evitar que empieza con el gesto contento. El resultado final es:

Ejecutar el programa

<< Anterior

Índice

Siguiente >>

Snap!: Operadores matemáticos

Ya en la entrada anterior hicimos uso del operador suma  para sumar dos números introducidos por el usuario.

En esta nueva entrada vamos a profundizar un poco más en el uso de los operadores matemáticos. Para ello vamos a desarrollar un programa que, pidiendo al usuario los datos necesarios, calcule su índice de masa corporal (IMC).

Buscando en Internet encontramos que el cálculo del IMC se hace según la fórmula:

Por tanto, nuestro programa deberá pedir al usuario su peso y altura expresados en kilogramos y metros respectivamente. Para ello empezaremos creando dos variables con esos mismos nombres para guardar los valores introducidos por el usuario.

Una vez creadas nuestras dos variables, empezaremos el programa pidiendo el peso y asignando el valor introducido por el usuario a la variable peso:

Repetimos la operación con la altura y procedemos a decir el resultado. Obsérvese cómo hemos implementado la fórmula haciendo uso de los operadores necesarios.

El resultado final en el que hemos utilizado un personaje del repositorio de Snap! y hemos introducido un escenario acorde con el tema:

Ejecutar el programa

<< Anterior

Índice

Siguiente >>

Snap!: Variables

En cualquier lenguaje de programación una variable es un espacio en la memoria de nuestro ordenador para guardar datos. Podríamos verla como una cajita que utilizaremos para guardar cosas.

Como a lo largo del diseño de un programa es habitual crear varias variables; cada una de ellas debe tener un nombre único que la identifique. El nombre de la variable lo elige el programador libremente. Aunque es recomendable que dicho nombre indique para qué se usa esa variable. Así, deberíamos huir de nombres como a, b, c, etc., y usar aquellos del tipo: edad, nombre, fecha_nacimiento, que nos indica el significado del dato que van a guardar.

Es muy importante también tener en cuenta que Snap! hace distinción entre mayúsculas y minúsculas, por tanto no es lo mismo un variable llamada edad que otra llamada Edad.

Para crear una variable usaremos el botón que nos ofrece esta opción dentro de la categoría Variables.

Nos aparecerá una ventana para introducir el nombre de la variable y dentro de ella la opción de si queremos que nuestra variable sea conocida por todos los objetos de nuestro programa o sólo por el objeto para el que estamos programando.

Una vez creada la variable, podremos ver que aparece a la izquieda:

y que se visualiza en la pantalla con su valor actual:

Como aplicación de lo aprendido, crearemos un programa que suma dos número introducidos por el usuario.

Para ello, crearemos dos variables con los nombre numero1 y numero2.

Utilizaremos el siguiente código, donde se hace uso de los bloques de asignación para dar valor a las variables creadas:

El resultado:

Ejecutar el programa

<< Anterior

Índice

Siguiente >>

Snap!: Entrada de datos

Veamos cómo permite Snap! la introducción de datos por parte del usuario en tiempo de ejecución.

Para ello crearemos un sencillo programa en el que se pregunta al usuario su nombre y tras la introducción del dato pedido, el programa saludará al usuario por su nombre.

Cuando queramos que el usuario introduzca datos por teclado, utilizaremos el comando preguntar y esperar de la categoría Sensores. 

Encajaremos este comando bajo el comando de inicio de programa:

Este comando hace aparecer en la parte baja de la pantalla una caja de texto y espera a que el usuario introduzca algún valor y pulse la tecla Enter:

Utilizaremos esa variable para devolver el saludo al usuario. Para ello haremos uso el comando ya conocido decir y en su interior deberemos meter la unión de la palabra Hola con el nombre del usuario que estará contenido dentro de la variable respuesta.

La construcción del código quedaría así:

Cómo se ve hemos hecho uso por primera vez de un comando de la categoría 

Operadores: el comando unión nos permite unir cadenas de caracteres o dicho de otro modo, palabras o frases.

El resultado final es el esperado:

Ejecutar el programa

<< Anterior

Índice

Siguiente >>

¡Hola mundo! en Snap!

Siguiendo la costumbre tan ampliamente extendida en el mundo de la programación, nuestro primer proyecto en Snap! será "un hola mundo".

Primeramente seleccionaremos la categoría Control:

y desde allí arrastraremos y soltaremos el comando:

Después arrastraremos el comando "decir" de la categoría Apariencia y lo encajaremos en el comando anterior.

De una forma tan simple ya hemos conseguido que al comenzar el programa haciendo clic en la bandera verde, aparezca un mensaje en pantalla con el saludo "¡Hola mundo!".

Snap! nos ofrece varias posibilidades de crear sprites o personajes en nuestros programas. La más fácil es importarlos desde el repositorio de disfraces:

Siendo ahora el resultado más atractivo:

Ejecutar el programa

<< Anterior

Índice

Siguiente >>