ArduBlock 2.

0
Block coding program for Arduino platforms

Arduino WEB
ESP 8266 01
12 projects

ardublock.ru
№1 - Connecting the ESP 8266 ArduBlock 2.0

Connect the ESP module to the Arduino board.

RX - 10 pin 3.3v
TX - 9 pin GND

Examination:
Connect the Arduino board to your computer.

Make sure the LED

lights up on the ESP module.

On initial power up, the ESP will create an access point!

Open WIFI networks on PC.

ESP WIFI network (no password).

Congratulations!
ESP is ready to go!
№2 - WIFI search ArduBlock 2.0

ArduBlock 2.0 - Communication modules - Block - ESP 8266 - Scan WiFi

Connection pin. Work speed.

Upload the program to the Arduino board.

Board model. Port: COM4.

Open the serial port monitor.

Reset ESP.

3 ESP operating mode.

Network search.

Start broadcasting.

List of available WiFi networks.

If the ESP does not see the WiFi network,

then reset the Arduino board.

Congratulations!
We found the name of the WiFi router!
№3 - Connecting to a WIFI router ArduBlock 2.0

ArduBlock 2.0 - Communication modules - Unit - ESP 8266 - Connect WiFi

Login
Password
WIFI router.

header
WEB page.
WEB pages.

Блок для создания

WEB страницы.
Upload the program to the Arduino board.

IP address of ESP.
Board model. Port: COM4.

Open the serial port monitor.

WiFi connection.

1 Working mode ESP.

If ip 0.0.0.0 ? error,
then ESP 8266 failed
connect to the router!
Reboot Arduino!

IP address of ESP.

Enable port 80.

Open web.
Download the first
empty page.

Congratulations!
We connected to the WiFi router and loaded the first Web page!
№4 - Connecting to ESP 8266 ArduBlock 2.0

ArduBlock 2.0 - Communication modules - Unit - ESP 8266 - Server WiFi

WEB page.
Block to create
WEB pages.

Upload the program to the Arduino board.

IP address of ESP.
Board model. Port: COM4.

Open the serial port monitor. Reboot ESP.

2 ESP operating mode.

IP address of ESP.

Enable port 80.

Open WIFI networks on PC. Connect

to the WiFi network.
ESP WIFI network
(no password). Open web.
Download
empty page.
Congratulations!
We have connected to ESP and loaded the Web page!
№5 - Web - Text display ArduBlock 2.0

ArduBlock 2.0 - Communication modules - Block - Text

Connection block.

Web page title.

Web page text.

Download the program to the Arduino board!

Open the web page:

Congratulations!
We have displayed the text on the Web page!
№6 - Web - Button ArduBlock 2.0

ArduBlock 2.0 - Communication modules - Block - Button ID

Connection block.

Web page title.

Web page text.
Button with id = 1 Name = ON.
Button with id = 2 Name = OFF.

If a click was made

from the web page, then
ID equals valuefrom the button.
If ID value = 1,
then turn on Led pin 13.
If ID value = 2,
then disconnect Led pin 13.
Download the program to the Arduino board!
Open the web page:

Led pin 13.

Congratulations!
We have displayed the text on the Web page!
№7 - Web - Variable value ArduBlock 2.0

ArduBlock 2.0 - Communication - Block - Var int

Connecting the ESP 8266.

Let's declare the variable W.

In the variable W we write

temperature value with
Thermometer DS18B20.

W variable.

Let's write the variable W as a code in a block of text. Thermometer DS18B20

W variable.

Temp: “+String(W)+”
Congratulations!
We have displayed the temperature value on the Web page!
№8 - Web - Header ArduBlock 2.0

ArduBlock 2.0 - Communication Modules - Block - Kode

ESP 8266 connection.

The title of the page.

Title on the web page.

Kode:

<h1>ArduBlock</h1>
<h2>ArduBlock</h2>
<h3>ArduBlock</h3>
<h4>ArduBlock</h4>
<h5>ArduBlock</h5>
<h6>ArduBlock</h6>

Congratulations!
We've rendered the title on the Web page!
№9 - Web - Variable text ArduBlock 2.0

ArduBlock 2.0 - Communication - Block - Var String

ESP 8266 connection.

Numeric variable.

Text variable.

Reading values
from DS18B20.

text + variable + text

Sending a text variable to a Web page.

Thermometer DS18B20

Result:

Congratulations!
We've rendered a text variable on a Web page!
№10 - Web - Page update ArduBlock 2.0

ArduBlock 2.0 - Communication Modules - Block - Kode

ESP 8266 connection.

Numeric variable.

Text variable.

Reading values
with DS18B20.

Page update!

Code: Page update! Refresh every 15 seconds!

<meta http-equiv=’refresh’ content=’15’>

Congratulations!
We've set automatic updates to the Web page!
№11 - Web - Link ArduBlock 2.0

ArduBlock 2.0 - Communication Modules - Block - Kode

ESP 8266 connection.

Code: Link to the site!

<a href=’http://ardublock.ru’>ArduBlock</a>

Congratulations!
We have created a link on the Web page!
№12 - Web - Arduino pin link ArduBlock 2.0

GND

Line break code: <br>

Code: Link to pin!

<a href=’/i/1’>ON</a>

<a href=’/i/2’>OFF</a>

<a href=’/i/3’>ON</a>

<a href=’/i/4’>OFF</a>

<a href=’/i/5’>ON</a>

<a href=’/i/6’>OFF</a>

<a href=’/i/7’>ON</a>

<a href=’/i/8’>OFF</a>

<a href=’/i/9’>ON</a>

<a href=’/i/0’>OFF</a>