If you want to use ESP32 or ESP8266 with the Arduino IDE and are starting to learn IOT, this guide is for you.
There are five main topics we are going to cover here:
- How to install ESP boards in Arduino IDE
- How to scan wifi networks around you (Testing ESP board)
- How to create first sketch to operate external LEDs via webpage
- Using MIT app inventor to create applications
- MIT app inventor application to send message to ESP.
How to install ESP board in Arduino IDE
You can use ESP board directly with Arduino IDE but you have to install the board first.
The process can be summarized as first you have to add a JSON link into the preference of your IDE software, add board from boards manager and you are good to go. This process is explained in detail here:
https://randomnerdtutorials.com/installing-the-esp32-board-in-arduino-ide-windows-instructions/
Installing the ESP32 Board in Arduino IDE (Windows, Mac OS X, Linux)
How to scan wifi networks around you (Testing ESP board)
The first thing we usually perform is to check our board using a default code available in Arduino lib. folder.
Go to File -> Examples -> Select Wifi scan and get a complete code.
Select your ESP board and upload the code
You can than read names and strengths of wifi around you.
How to create first sketch to operate external LEDs via webpage
This web page has a lot of different useful documentation regarding EPS32 :
https://randomnerdtutorials.com/esp32-useful-wi-fi-functions-arduino/
ESP32 Useful Wi-Fi Library Functions (Arduino IDE)
Now to create an ESP32 Webpage something like this,
We can use HTML language to build a simple webpage and set the output URL to each button.
A complete detailed guide is available here
https://randomnerdtutorials.com/esp32-web-server-arduino-ide/
Using MIT app inventor to create applications
MIT App Inventor is a web application integrated development environment originally provided by Google, and now maintained by the Massachusetts Institute of Technology.
It is a simple platform where you can build your own custom mobile application quickly in minutes. We can use MIT app inventor to build apps that communicate with ESP32, to create DIY home automation solutions. I am attaching a sample code here that takes input from the Web, we will provide these URLs to our buttons in MIT app inventor and with each button press, we can receive messages in ESP board via WiFi.
Raw Code for ESP8266:
#include <ESP8266WiFi.h>
const char* ssid = "WifiESP";
const char* password = "090078601";
String ClientRequest;
WiFiServer server(80);
WiFiClient client;
String myresultat;
String ReadIncomingRequest(){
while(client.available()) {
ClientRequest = (client.readStringUntil('\r'));
if ((ClientRequest.indexOf("HTTP/1.1")>0)&&(ClientRequest.indexOf("/favicon.ico")<0)){
myresultat = ClientRequest;
}
}
return myresultat;
}
int count=0;
void setup()
{
ClientRequest = "";
Serial.begin(115200);
Serial.print("Setting AP (Access Point)…");
WiFi.softAP(ssid, password);
IPAddress IP = WiFi.softAPIP();
Serial.print("AP IP address: ");
Serial.println(IP);
server.begin();
}
String wifi_msg;
int flag = 0;
int pap=1;
void loop()
{
client = server.available();
if (!client ) { return; }
while(!client.available()){
ClientRequest = (ReadIncomingRequest());
ClientRequest.remove(0, 5);
ClientRequest.remove(ClientRequest.length()-9,9);
// Serial.print(" ");
Serial.print(ClientRequest);
if (ClientRequest == "1"){ /* add your actions that you want when 1 is received */ }
if (ClientRequest == "2"){ /* add your actions that you want when 1 is received */ }
client.println("HTTP/1.1 200 OK");
client.println("Content-Type: text/html");
client.println("");
client.println("<!DOCTYPE HTML>");
client.println("<html>");
client.println("Wifi Connected");
client.println("</html>");
}
client.stop();
}
To understand MIT App inventor, a detailed guide is available on there own page here:
https://appinventor.mit.edu/explore/ai2/tutorials
Here is example of MIT app inventor code to send message via custom URL, you can take it as reference for your future project.
Thank you for reading
Follow Gotechies.net for more
Via. Shah Fahad Ahmed
