Workshop IOT

1. Première application IOT: BLYNK

Etape 1 : installation de l’application

1. Aller sur blynk.cloud et créer un compte gratuit. Pour cela, cliquer sur Créer un nouveau compte.

Figure 1

2. Écrire une adresse e-mail correcte, le même e-mail sera utilisé par la suite sur l'application Mobile
Blynk. Cocher la case : J'accepte la déclaration et cliquer sur le bouton S’inscrire.

1
 Figure 2
Un e-mail de confirmation sera envoyé sur votre identifiant e-mail.

Figure 3

• Ouvrir l'identifiant de messagerie, cliquer sur le lien envoyé par Blynk, puis cliquer sur Créer un mot de
passe.

2
 Figure 4

Etape2 : Créer un nouveau modèle pour ESP32 dans Blynk Cloud

Pour commencer, cliquer sur Templates

Figure 5

3. Cliquer ensuite sur New Template pour créer votre premier modèle

3
 Figure 6

4. Entrer le nom du modèle, sélectionner le type de matériel (ESP32), sélectionner le type de connexion (wifi),
écrire une petite description, et enfin, cliquer sur le bouton Terminé.

Figure 7
Étape 3 : Créer des flux de données dans Blynk Cloud

1. Sur les Datasteams, cliquer sur New Datastream et sélectionner Virtual Pin.

4
 Figure 8

2. Écrivez le nom, sélectionnez le code PIN virtuel, le type de données, vous pouvez également sélectionner
les unités et vous pouvez également définir les limites minimale et maximale. Une fois tous les paramètres
définis, vous pouvez cliquer sur le bouton Créer.

Figure 9

3. Maintenant, cliquer à nouveau sur le bouton New Datastream et suivre exactement les mêmes étapes pour

5
 la température et l’humidité. Le PIN virtuel est automatiquement incrémenté. Après avoir défini tous les
paramètres, cliquer sur le bouton Créer.

4. Quoi qu'il en soit, vous pouvez voir que nos flux de données sont prêts et nous pouvons maintenant cliquer
sur le bouton Enregistrer.

Figure 10

Figure 11
6
 Figure 12

Étape 4 : Configurer le tableau de bord Web Blynk Cloud

1. Aller maintenant dans le tableau de WebDashboard. Faites glisser et déposer le commutateur pour
contrôler la Led. Cliquer sur Settings.

Figure 13

2. Sélectionnez le Datastream « LED(V0) », activez les étiquettes Afficher on/off, si vous le souhaitez, vous
pouvez également changer la couleur, et enfin, cliquez sur le bouton Enregistrer.
7
 Figure 14

3. Maintenant, ajouter une jauge pour surveiller la température. De la même manière, vous pouvez cliquer sur
le bouton des paramètres de la jauge et sélectionner le flux de données et effectuer d'autres paramètres.

Figure 15

8
 Figure 16

4. Ajouter une deuxième jauge pour surveiller l’humidité.

Figure 17
Une fois que vous avez ajouté tous les widgets, cliquez sur le bouton Save and Apply.

9
Étape 5 : Ajouter un appareil à l'aide d'un modèle dans Blynk IoT

1. Cliquer sur Rechercher, puis cliquer sur New Devise.

Figure 18

2. Sélectionner la première option, c'est-à-dire From Template.

Figure 19
10
 3. Donner n'importe quel nom au modèle et au périphérique et cliquez sur Créer.

Figure 20

Un nouvel appareil sera créé. Un extrait du fichier d'en-tête de code apparaîtra sur le tableau de bord qui représente

le BLYNK_TEMPLATE_ID, le BLYNK_DEVICE_NAME et le BLYNK_AUTH_TOKEN.

Copier et enregistrer ce code car il sera utilisé dans l'IDE Arduino.

11
 Figure 21
Mon tableau de bord est prêt, maintenant je peux utiliser ce bouton pour contrôler la Led et les jauges pour surveiller
la température et l’humidité.

Étape 6 : Configurer le tableau de bord mobile de l'application Blynk IoT

1. Si vous souhaitez également utiliser votre

téléphone portable pour contrôler et
surveiller différents appareils et capteurs,
vous devrez installer l’application Blynk
IoT.

Accédez à l'AppStore et recherchez

l’application Blynk, assurez-vous
d'installer Blynk IoT. Une fois
l'application Blynk IoT installée,
connectez-vous avec le même identifiant et
mot de passe.

Figure 22
12
 2. Cliquez ensuite sur ESP32 que nous
avons créé dans le tableau
de WebDashboard ; il apparaîtra
dans l’application mobile Blynk

.
Figure 23

3. Activer le mode développeur pour ajouter les

widgets

• Dans l'application Blynk

• Accédez à Mon profil / Profil d'utilisateur
dans le menu de gauche
• Vérifiez que le commutateur du mode
développeur est réglé sur ON

Figure 24

13
 4. Cliquer sur le bouton pour passer en
mode développeur.

Figure 25

Figure 26 Figure 27

5. Cliquez ensuite sur le bouton et liez la variable LED. Cliquez donc sur la Led (V0) dans
DATASTREAM.

14
 Figure 28

6. Cliquez ensuite à nouveau sur le bouton Ajouter un widget et cette fois ajoutez une jauge. Liez
ensuite la variable Temperature (V1) à celle-ci.

15
Figure 29 Figure 30
7. Cliquez à nouveau sur le bouton Ajouter un widget et ajoutez une deuxième jauge pour l’humidité.
Liez ensuite la variable Humidity (V2) à celle-ci.

Figure 31

16
Mon application Blynk IoT est prête.

Figure 32
Maintenant, je peux utiliser cette application mobile pour contrôler la Led et surveiller la température et
l’humidité.

Etape 7 : Programmation de la carte ESP32

Pour effectuer cette tâche, à savoir la programmation de la carte ESP32, on a besoin du code adéquat.
Pour l’obtenir on va utiliser l’outil « sketch generator » élaboré par Blynk. Ouvrir votre navigateur
web et taper le lien suivant :

examples.blynk.cc

17
 Figure 33 : Sketch generator de Blynk

Donc pour générer le code (programme) qu’on doit le téléverser dans notre ESP32, il faut :

1. Choisir le type de carte « ESP32 » dans « BOARD ».

2. Choisir le type de connexion « ESP32 WIFI » dans « Connection ».
3. Ecrire le code d’authentification du projet.
4. Enfin il faut choisir l’exemple adéquat dans Example. Pour notre projet chercher
l’exemple « DHT11 »

18
 Figure 34: Génération du code adéquat

Avant de copier ce code il y’a quelques paramètres à régler. Le premier paramètre est les
informations du point d’accès wifi. La variable « ssid[] » désigne le nom du point d’accès wifi. Alors
que la variable « pass[] » désigne le mot de passe de ce point d’accès.

char ssid[] = "YourNetworkName";

char pass[] = "YourPassword";

Le deuxième paramètre est celui de la broche (pin GPIO) ESP32 qu’on va utiliser avec la broche «
out » du capteur DHT11. Dans ce workshop on va utiliser le GPIO 15 pour notre DHT11.

#define DHTPIN 15 // What digital pin we're connected to

Le troisième paramètre à régler sont les pins virtuels de la température et de l’humidité. Ces derniers
doivent être les mêmes que celles choisies dans l’étape 4.

Blynk.virtualWrite( (V2, h) ;
Blynk.virtualWrite( (V1, t) ;

Après le réglage de ces paramètres :

1. Copier le programme
2. Ouvrir ARDUINO IDE. Créer un nouveau fichier (sketch). Par défaut ce nouveau fichier
contiendra les deux fonctions void setup et loop. Effacer tout le contenu de ce nouveau fichier
pour obtenir un fichier totalement vide.

19
 3. Coller le programme copié auparavant. Sauvegarder le nouveau fichier.
4. Sélectionnez votre carte dans Outils ►Type de carte (DOIT ESP32 DEVKIT V1)
5. Vérifier le programme.

C’est tout se passe bien on peut passer à la dernière partie « Réalisation et test ».

Etape 8 : Réalisation et test

1. Réaliser ce circuit sur une plaque à essai.
a. Brancher le pin + du capteur DHT11 au pin in (3V3) de l’esp32 ;
b. Brancher le pin - du capteur DHT11 au pin GND de l’esp32 ;
c. Brancher le pin out du capteur DHT11 au GPIO 15 de l’esp32 ;

Figure 35 : Circuit à réaliser

20
 Figure 36

2. Configurer IDE Arduino pour ESP32

Il existe un module complémentaire pour l'IDE Arduino qui vous permet de programmer l' ESP32
à l’aide de l'IDE Arduino et de son langage de programmation.

Figure 37

21
 Entrez https://dl.espressif.com/dl/package_esp32_index.json dans le champ « URL de
gestionnairede carte supplémentaire » comme indiqué dans la figure ci-dessous. Cliquez ensuite sur
le bouton « OK » : puis Ouvrez le gestionnaire de cartes. Allez dans Outils > carte > Gestionnaire
de cartes. Saisir le type Esp32 > Esp32 by Espressif Systems.> Installer.

Figure 38

3. Installer dht sensor library

22
Dans croquis (Sketch) choisissez inclure une bibliothèque puis gérer les bibliothèques

Figure 39
Installez dht sensor library.

Figure 40

4. Installer Blynk library

23
 Figure 41

5. Test de l'installation

Branchez la carte ESP32 à votre ordinateur. Avec votre IDE Arduino ouvert, suivez ces étapes :

a. Sélectionnez la carte DOIT ESP32 DEVKIT V1.

b. Sélectionnez le port (Si vous ne voyez pas le port COM dans votre IDE Arduino, vous devez
installer les pilotes CP210x USB vers UART Bridge VCP) à partir du lien suivant :
https://www.silabs.com/products/development-tools/software/usb-to-uart-bridge-vcp-
drivers

Figure 42

24
 c. Téléverser le programme élaboré à l’étape 7 dans votre ESP32.
d. Tester le projet en cliquant sur le bouton « run »

Figure 43: Bouton run

2. ThingSpeak

Figure: ThingSpeak

Etape 1 (Création d’un compte thingspeak):

1. Accédez au site https://thingspeak.com/ et créer votre compte.
2. Connectez-vous alors avec votre nom d’utilisateur.

Etape 2 (création d’une chaine) :

1. Créer une nouvelle chaine en cliquant sur “New channel”
2. Donner un nom à votre chaine, au field1 : temperature et au field2=humidite

25
 Figure : Ajout d’une chaine

3. Achevez la création par cliquer sur save channel.

Figure 56 : Chaine créee

26
 4. L’étape suivante consiste à écrire le programme. Pour ce faire nous avons besoin
d’introduire des données spécifiques tirées du site dans le programme qui sont les clés.
Cliquez sur API Keys et copier le clé “Write API Key” et “Read API Key” :

Figure 57 : Paramètres de la chaine

Etape 3 (programmation de la carte ESP32) :

Téléverser le programme “thingspeak_dht.ino” après avoir remplacé les paramètres du point

d’accès wifi et le clé “Write API Key” par vos paramètres. Tester le Fichier

Figure 58: Code ThingSpeak Arduino IDE

27
 Etape 4 (Application Android ThingView) :
1. Installer depuis Play Strore l’application ThingView Free

Figure 59 : Application ThingView

2. Lancer l’application :

28
 Figure 60 : Ajout d’une chaine dans ThingView

3. Commencer par cocher public

4. Remplisser les champs Channel id et key ( Read api Key de thingspeak) depuis la plateforme

29
 3. Adafruit IO :

Adafruit io est une plateforme IOT dédiée home automation (domotique).

Etape 1 (Création d’un compte) : Créer votre compte sur la plateforme adafruit io
https://io.adafruit.com
Etape2 (Création du dashboard):
• Cliquer sur l’onglet “IO” et “new dashboard”

Figure 83 : Création du Dashboard Adafruit io

• Donner un nom à votre dashboard

Figure 84 : Donner un nom à votre Dashboard

• Ajouter un bouton on/off au dashboard, pour commander une led à distance, en

cliquant sur “create new block”

30
 Figure 85 : Création d’un nouveau bloc

• Choisir on/off

Figure 86 : Bouton On/off

• Créer un nouveau feed (topic) Light

31
 Figure 87 : Ajout d’un nouveau feed (topic)

• Cocher le nouveau feed ainsi crée et cliquer “next step”

Figure 88 : Association du feed au bloc

• Configurer le block bouton

32
 Figure 89 : Configuration du bloc on/off

• Ajouter un nouveau bloc “jauge” pour afficher la température

Figure 90 : Ajout du bloc Jauge

• Créer un nouveau feed (topic) temperature

33
 Figure 91 : Ajout d’un nouveau feed

• Cocher le nouveau feed ainsi crée et cliquer “next step”

Figure 92 : Association du feed au bloc

• Configurer le bloc jauge

34
 Figure 93 : Configuration du bloc Jauge

Refaire les mêmes étapes pour ajouter un bloc jauge d’humidité.

• Cliquer sur “edit layout” afin d’organiser votre dashboard en déplaçant les
blocs existants

Figure 94 : Dashboard crée

• Cliquer sur “My Key” et copier les paramètres “Username” et “Active Key”

35
 Figure 95 : Paramètres du dashboard

Etape3 (programmation de la carte esp32):

• Installer la bibliothèque “Adafruit_MQTT”

Figure 96 : Installation de la bibliothèque Adafruit Mqtt

• Téleverser le programme “ESP32adafruit.ino” après avoir remplacé les

paramètres du point d’accés wifi et les paramètres récupérés à l’étape précédente
“Username” et “Active Key”. Tester.

Etape4 (google assistant): On va utiliser le site IFTTT pour la mise en oeuvre de la

commande vocale.
• Cliquer sur “create” pour créer votre applet et cliquer sur “add (if this)”

36
 Figure 97 : Création d’un nouveau Applet IFTTT

• Choisir le service “google assistant”

Figure 98 : Service Google assistant

• Choisir l’option “say a simple phrase”

37
 Figure 99 : Choisir l’option « say a simple phrase »

• Connecter votre compte google à ifttt

Figure 100 : Obtenir l’autorisation de l’utilisation de votre compte google

• Configurer le service et cliquer sur “create trigger”

38
 Figure 101 : Configuration du service

• Cliquer sur “add (then that)” et choisir le service “adafruit”

Figure 102 : Service adafruit

• Cliquer sur “send data to adafruit io”

39
 Figure 103 : option « send data to adafruit io »

• Connecter votre compte adafruit à ifttt

Figure 104 : Obtenir l’autorisation d’utilisation du compte Adafruit IO

• Choisir d’envoyer “1” au feed “Light” et cliquer sur “create action”

40
 Figure 105 : Configuration du service adafruit

• Terminer par “continue” et “finish”

Figure 106 : Aperçu de l’applet

41
 Figure 107 : finalisation de l’applet

• Tester en ouvrant “google assistant“ de votre smartphone et prononcer la phrase

configurée auparavant. Refaire les mêmes étapes pour éteindre la led.

42
43
44
45
46