Here we will learn how to create our first project on the Blynk IoT platform. We will connect an LED to some pin on the NodeMCU. Then we will be able to control it both through the blynk mobile app and the web portal through computers.

We will use NodeMCU throughout this tutorial. It is a WiFi capable Development Board based on the ESP8266 microchip.

This Tutorial contains:

  1. Account
  2. Templates
  3. Datastreams
  4. Setting up Web Dashboard
  5. Creating and Setting up Devices
  6. How to Use The Blynk App
  7. Adding Libraries and Boards
  8. Coding: Making a Basic LED Control Project
  9. End


1. Account

  First you have to go to the Blynk Site site, and make an account.

  After you have logged in to your Blynk account, you will be able to see a dashboard like this:

image


2. Templates

  Before creating a device, you need to create a template.

  What are Templates?

  At first, you have to create a template for each type of device you have. For example, in this tutorial, we will control an LED through a button on your smartphone or laptop. At first, we will make a template for a light, then we can make a device called light and tell that it belongs to this template.
  Creating templates is somewhat like defining objects in programming and creating devices is like making instances of those objects. There can be multiple devices under the same template.

  How to Create Templates?

  To create a template, first click on the new template button on the dashboard and fill up the form. I am using a NodeMCU which is based on the ESP8266 microchip. So, I have put “Hardware = ESP8266”.
  This is how mine looks:

image

  Finally click on button to create the template.
  After creating the template, you will see something like this:

image

  Under the Info tab, you can further edit the data you have just entered along with some other fields.

Note that we are given 2 informations (BLYNK_TEMPLATE_ID and BLYNK_DEVICE_NAME) under this Info tab. We will need those two pieces of information later. So, we will return to this Info tab again while writing the code.

  Editing the Metadata tab is not essential for device setup. So let us skip it and move on to the Datastreams tab.


3. Datastreams

According to Blynk: Datastreams is a way to structure data that regularly flows in and out from device. Use it for sensor data, any telemetry, or actuators.  

  What are Datastreams?

  Datastreams are the channels of data that will be shared between the devices. There are various sorts of datastreams:

Digital and Analog Datastreams: Digital and Analog Datastreams are generally used to read data from the sensors. Setting up such a data stream might let you read temperature data from your device with a temperature sensor and view it on your smartphone. It might also be simultaneously used to automatically turn on the AC when the temperature reaches a certain value.

Virtual Pins: These pins do not have any physical existence. They are mere buttons or sliders on your smartphone/laptop screen which help you to manually interact with these devices at your own will. Such a data stream will let you set up a virtual button on your smartphone whose value you can control manually. Thus you can set up an LED to turn on when the value of that virtual pin is 1 and turn off when that is 0. We can avail 255 virtual pins in the Blynk IoT platform.

*Number of possible Digital and Analog Datastreams depends on the device you are using.

In this tutorial, we will only concentrate on “Virtual Pins”.

  Setting up Virtual Pins

  To setup a Virtual Pin, navigate to the Datastream tab, hover on the button and select Virtual Pin. Next, fill up the form.
  I have taken Virtual Pin V0 (available V0-V255). Here we will controll an LED by reading the value from this pin. It has only two states (i.e.: on and off). So we will set datatype as Integer and set the minimum and maximum values to be 0 and 1. Default value is your choice!

  Mine looks like this:

image

  When done, click on button to create the datastream.


4. Setting up Web Dashboard

  This is the dashboard you will be using to control your devices. Though the web dashboard and the app dashboard works exactly the same way, you will have to setup both of them separately. :(

  Next move on to the Web Dashboard tab, drag and drop a switch in the working area (You might also like to add an LED that will show you the current state of the actual LED). You can resize the buttons.

  Finally click on the nut icon on the top left corner of the switch which you have just dragged and dropped onto your working area. Select the data stream you have just created and fill the rest of the information in according to your needs. Save it at the end.

  I have filled it up like this:

image

  If you have brought the LED to the workspace, which will show you the current state of the actual LED, you need to connect that to the required datastream too (in my case V0). Click on the icon to do that.

  This is how my Web Dashboard came up to be:

image

  When you are done click on the top right.

Congratulations! Your template is ready!


5. Creating and Setting up Devices

  Now that we have our template, we can create multiple devices from the same template. There are two ways of creating a device:

  1. Through Mobile App: In this way, we won’t upload the WiFi connecting credentials in the Code of the NodeMCU. After uploading the code, we will (sort of) login to the NodeMCU through Blynk Mobile App and enter the WiFi credentials there. In the code, you need to keep only the BLYNK_TEMPLATE_ID and BLYNK_DEVICE_NAME. You will get that in the Info tab of the template (as mentioned above). When the Blynk Mobile App connects to the device, it will automatically save the WiFi credentials and the Auth Token to the EEPROM of the NodeMCU. It will generate an Auth Token while creating a device.

  2. Through Auth Token: The last method only worked with the help of the Blynk Mobile App, but this process can be followed on both Mobile/PC. Here we will virtually create a device. Then we would be provided with an Auth Token. We would include Template ID, Device Name, Authorisation Token, WiFi SSID and, WiFi Password in our code. Then the device will work without any further setup through both the Blynk App and the web interface.

  We will learn both the processes in detail. We will only learn the second method (Through Auth Token) now. We will learn the Mobile App method while learning how to use the app towards the end of this page.

  Through Auth Token

  Go to the search tab on the navigation bar on the left.

image

  Then Click on button and select to add a device from Template (the other options are not for us). Select the template name and name the device. I will use a green LED. So I kept the name of my device as Green LED.

  Now, on the top right corner, you will see a pop up like this:

image

  This contains all the information which are needed to be put into the code apart from the WiFi credentials.

What? You clicked on the cross by mistake?   Don’t worry, you can always find these information under the Device Info tab.

  Next, for the coding part, go here to learn more.

  Through Mobile App

  Let us talk about this in the next section.


6. How to Use The Blynk App

  At first we need to download the Blynk IoT App.

*Remember to not download the Blynk (legacy) App.

  Device Setup through Mobile App

  First Upload this code to the NodeMCU. It contains the Blynk Template ID and the Blynk Device Name (which are properties of the template we are using). Find these informations under the Info tab of the template you are going to use. It contains code for directly writing the value of the concerned virtual pin (I am using V0) to the LED connected to the NodeMCU (I am using D5 pin). Thus it will make the D5 pin HIGH when the value of V0 will be 1 and make the D5 pin LOW when the value of V0 will be 0. We will manually control the value of the pin from the mobile/web dashboard according to our will. Thus we would be left with a button on our smartphone which can make our LED glow or turn it off.

  After uploading the code to the NodeMCU, open the Blynk app on your smartphone. As you will log into your Blynk account, your screen will look like Fig 1.

  Next do the following steps to connect the NodeMCU to a local WiFi network:

  • Add new device -> Connect to Wi-Fi -> Turn on WiFi and GPS of your smartphone -> Ready -> Select your device -> Grant Permission -> Select and Connect to the desired Wi-Fi network -> Name the Device (I will name it “Green LED”) -> Continue -> Set up as new -> Done -> Ok, great! -> Finish and exit -> Setup Dashboard -> Setup the mobile Dashboard. I preffer to set it up just like I did while making the template. Here’s how I did it:

  Click on the hamburger menu on the top right corner of the screen (As indicated in Fig 3). Next bring the Items indicated in Fig 4 to your workspace, resize them and place them according to your own will. Then click on each of them and configure them.

Fig 5 shows how I configured the switch. Just like the Button, do not forget to connect the LED to the same pin.
  My dashboard came up like Fig 6 at the end.

  Finally click on the button on the top left corner as in Fig 6 to come out of the Dashboard Setup Menu.

Now click on the Button to turn it on or off. Enjoy!


7. Adding Libraries and Boards

  To complete the coding part in the Arduino IDE we need to install some libraries into it. We would need to install ESP8266 Board and the Blynk Library in the Arduino IDE:

  1. ESP8266 Board: In the Arduino IDE, go to:

    • File -> Preferences -> Paste this link http://arduino.esp8266.com/stable/package_esp8266com_index.json in Additional Boards Manager URLs field -> OK

    image

      …next in the Arduino IDE, go to:

    • Tools -> Board: -> Board Manager… -> Search “ESP8266” -> install it -> Close it -> Again go to Tools -> Board: -> ESP8266 Boards (3.0.2) -> Select “NodeMCU 1.0 (ESP-12E Module)”
  2. Blynk Library: First click here ⬇ to download the code from this GitHub repository https://github.com/blynkkk/blynk-library as a .ZIP file.

  Then in the Arduino IDE, go to:

  • Sketch -> Include Library -> Add .ZIP Library… -> Select the downloaded .ZIP file -> Choose

8. Coding: Making a Basic LED Control Project

  As mentioned in the Devices section, there are two ways of creating devices:

  1. Through Mobile App: To create a device through the Blynk IoT mobile app, first we have to upload a code to the NodeMCU. In the Arduino IDE open the Blynk Edgent code for ESP8266:

    • File -> Example -> Blynk -> Blynk.Edgent -> Edgent_ESP8266

    image

    Then replace the code with the code below:

    // Fill-in information from your Blynk Template here
    #define BLYNK_TEMPLATE_ID "YourTemplateID"
    #define BLYNK_DEVICE_NAME "YourDeviceName"
       
    #define BLYNK_FIRMWARE_VERSION        "0.1.0"
       
    #define BLYNK_PRINT Serial
    //#define BLYNK_DEBUG
       
    #define APP_DEBUG
       
    // Uncomment your board, or configure a custom board in Settings.h
    //#define USE_SPARKFUN_BLYNK_BOARD
    #define USE_NODE_MCU_BOARD
    //#define USE_WITTY_CLOUD_BOARD
    //#define USE_WEMOS_D1_MINI
       
    #include "BlynkEdgent.h"
       
    int pin = D5;
       
    BLYNK_WRITE(V0){
      int val = param.asInt();
      digitalWrite(pin, val);
      if(val==1){
        Serial.println("LED switched ON");
      }else{
        Serial.println("LED switched OFF\n");
      }
    }
       
    void setup()
    {
      pinMode(pin, OUTPUT);
      Serial.begin(115200);
      delay(100);
      BlynkEdgent.begin();
    }
       
    void loop() {
      BlynkEdgent.run();
    }
    

      Replace the BLYNK_TEMPLATE_ID, BLYNK_DEVICE_NAME, and the two PINs with your own ones. Next connect the NodeMCU to your computer and select it under Tools -> Board: -> ESP8266 Boards (3.0.2) -> Select “NodeMCU 1.0 (ESP-12E Module). Also, select the Port to which you have connected the board. Finally, upload the code.

    Note: If you face issues while uploading/compiling, make sure you have successfully completed Step 7.

      After uploading this code, go here to see the steps for device setup through Blynk App.

  2. Through Auth Token: The last method only worked with the help of the Blynk Mobile App, but this process can be followed on both Mobile/PC. Here we will virtually create a device. Then we would be provided with an Auth Token. We would include Template ID, Device Name (Optional), Authorisation Token, WiFi SSID and, WiFi Password in our code. Then the device will work without any further setup through both the Blynk App and the web interface.

  After completing this step, upload the below code into your NodeMCU. Do not forget to replace them with your credentials.

/* Comment this out to disable prints and save space */
//#define BLYNK_PRINT Serial

/* Fill-in your Template ID (only if using Blynk.Cloud) */
#define BLYNK_TEMPLATE_ID "YourTemplateID"
#define BLYNK_DEVICE_NAME "YourDeviceName"
#define BLYNK_AUTH_TOKEN "YourAuthToken"

#include <ESP8266WiFi.h>
#include <BlynkSimpleEsp8266.h>

// Your WiFi credentials.
// Set password to "" for open networks.
char ssid[] = "YourWiFiSSID";
char pass[] = "YourWiFiPwd";
int pin = D5;

BLYNK_WRITE(V0){
  int pinValue = param.asInt();
  digitalWrite(pin, pinValue);
}

void setup()
{
  pinMode(pin, OUTPUT);
  Serial.begin(9600);
  delay(100);
  Blynk.begin(BLYNK_AUTH_TOKEN, ssid, pass);
}

void loop()
{
  Blynk.run();
}

  After you upload the code, you can easily access your device from both the mobile app and the Web Dashboard.

9. End

  This was my first blog. I tried to cover a lot in this. Please let me know if I have done some mistakes. If something doesn’t work etc please raise issues in the issues page of our GitHub Repository.

Happy Learning!