create account

Make Your Own Web Server using NodeMCU devkit v1.0 by japh

View this thread on: hive.blogpeakd.comecency.com
· @japh · (edited)
$32.39
Make Your Own Web Server using NodeMCU devkit v1.0
#### What Will I Learn? <br><hr>

- You will learn how to configure a <b>web server</b> using NodeMCU devkit v1.0.
- You will learn basic applications of web server requests like controlling the state of its general purpose input/output pins or gpio pins.
- You will learn the practical application of this tutorial in electronic projects, studies or in the industry.<p>

#### Requirements
<center><hr><b>Materials Needed</b><hr></center>
- NodeMCU devkit v1.0
- LED
- 220 ohms Resistor (1/4 W)
- USB Cable (Type A to Mini B)
- Junction Wires
- Computer

<center><hr><b>Software Applications </b><hr></center>
- Open-Source Arduino Software (IDE) / Arduino IDE

#### Difficulty<hr>
- Basic

<hr><p><br>
<b>Description: </b><br>Aside from being a <b>microcontroller</b>, the NodeMCU devkit v1.0 has also<b> a built-in wifi module</b>. On my previous tutorial, I have discussed that the NodeMCU is an established <b>open source IoT platform</b>. <p>https://www.robotistan.com/nodemcu-lolin-esp8266-developement-board-usb-chip-ch340-19703-67-B.jpg<a href="https://www.robotistan.com/nodemcu-lolin-esp8266-developement-board-usb-chip-ch340-19703-67-B.jpg"><center>NodeMCU devkit v1.0</center></a>
<p>Thus, it eliminates the need to use an another Wi-Fi module and an Arduino board, like Arduino UNO, to establish a web server.<p>A <b>web server</b> is a PC framework that process demands by means of Hyper Text Transfer Protocol. It is the conventional fundamental system that is used to disseminate data on the World Wide Web. You are actually using HTTP/HTTPS always without being aware of it. As the matter of fact, I am using HTTPS while I am writing this tutorial.<p> Moreover, using NodeMCU devkit v1.0, you don't have to implement <em>softserial communication</em> anymore between modules because you are using a single board.<p>Softserial allows serial communication using software on the digital pins of the Arduino to mimic its functions from a Wi-Fi module, as an example.<p><blockquote>For further research about NodeMCU
devkit v1.0. Here is its official <a href="www.nodemcu.com">website</a></blockquote><p>
In this <b>tutorial</b>, we will use the microcontroller and wifi module capabilities of the NodeMCU devkit v1.0
board to implement wireless infrared communication.</div><p></p>
<h2>Tutorial Contents</h2>
<center><b>"Make a Web Server Inside a Single Board using NodeMCU devkit v1.0"</b></center><br>
<b>Step 1:</b> <em>"Downloading the ESP8266 Boards and its Necessary Files"</em><hr>
<br>Open Arduino IDE. And create a new sketch.<p>
Make sure that you have already downloaded and installed the boards and the necessary files to make the NodeMCU devkit v1.0. If you haven't install or download them, kindly click <a href="">here</a>. And follow the first step of my tutorial there. 
<p>
After the installation of ESP8266, go to the <b>Tools</b> tab and change the board to <em>NodeMCU
1.0 (ESP-12E Module)</em><p><center>https://res.cloudinary.com/hpiynhbhq/image/upload/v1516177346/khn1srl1nqv4vlel6oav.png</center>


<p><b>Step 2:</b> <em>"Programming Your Board"</em>
<hr>

In order to control the test if your web server is working and is able to send request, I will use an LED connected to GPIO4.<p>https://pradeepsinghblog.files.wordpress.com/2016/04/nodemcu_pins.png?w=616 <a href="https://pradeepsinghblog.files.wordpress.com/2016/04/nodemcu_pins.png?w=616"><center>Pin Configuration of NodeMCU devkit v1.0</center></a> <p><b>Don't forget to use resistor to couple your LED. To prevent the LED from burning out when current flows exceed its limit.</b> It is a good practice for safety. To do this, 
assemble this circuit: <blockquote>I used Fritzing Beta to make these
circuits and models.</blockquote><p>
https://res.cloudinary.com/hpiynhbhq/image/upload/v1516177267/jxmz4s9p2y9k5mtpjfla.png

<p>

Then, open a new sketch in the Arduino IDE and input this code:<p></p>
<hr>
<code>#ifndef UNIT_TEST
<br>#include <<a href="">Arduino.h</a>>
<br>#endif
<br>#include <<a href="">ESP8266WiFi.h</a>>
<br>const char* ssid = "my wifi SSID";
<br>const char* password = "my wifi password";
<br>//For testing web server request.
<br>int LED = D2;
<br>WiFiServer server(301);
<br>IPAddress ip(192, 168, 43, 67);
<br> gateway(192, 168, 43, 1);
<br>IPAddress subnet(255, 255, 255, 0);
<br>IPAddress dns(192, 168, 43, 1);
<br>void setup(void) {
<br>Serial.begin(115200);
<br>delay(10);
<br>//For the output pins
<br>pinMode(LED, OUTPUT);
<br>//Initially turning off the LED
<br>digitalWrite(LED, LOW);
<br>// Connect to WiFi network
<br>Serial.println();
<br>Serial.println();
<br>Serial.print("Connecting to ");
<br>Serial.println(ssid)
<br>//Static IP Setup Info Here...
<br>WiFi.config(ip,dns,gateway,subnet);
<br>WiFi.begin(ssid, password);
<br>while (WiFi.status() != WL_CONNECTED) {
<br>delay(500);
<br>Serial.print(".");
<br>}
<br>Serial.println("");
<br>Serial.println("WiFi connected");
<br>// Start the server
<br>server.begin();
<br>Serial.println("Server started");
<br>// Print the IP address
<br>Serial.print("Use this URL to connect: ");
<br>Serial.print("http://");
<br>Serial.print(WiFi.localIP());
<br>Serial.println("/");
<br>}
<br>void loop() 
<br>{
<br>// Check if a client has connected
<br>WiFiClient client = server.available();
<br>if (!client) {
<br>return;
<br>}
<br>// Wait until the client sends some data
<br>Serial.println("new client");
<br>while(!client.available()){
<br>//    delay(1);
<br>client.setNoDelay(1);
<br>}
<br>// Read the first line of the request
<br>String request = client.readStringUntil('\r');
<br>Serial.println(request);
<br>client.flush();
<br>// Match the request for each of the appliances,lights and lock. 
<br>// For turning on the LED
<br>  {
<br>digitalWrite(LED,HIGH);
<br>}
<br>// For turning off the LED
<br>if (request.indexOf("/turn off LED") != -1) 
<br>{
<br>digitalWrite(LED,LOW);
<br>}
<br>// Set ledPin according to the request
<br>// Return the response
<br>client.println("HTTP/1.1 200 OK");
<br>client.println("Content-Type: text/html");
<br>client.println(""); //  do not forget this one
<br>client.println("<!DOCTYPE HTML>");
<br>client.println("<<a href="">html</a>> ");
<br>client.println("<<a href="">title</a>>My AWESOME Web Server!!<<a href="">/title</a>>`");
<br>client.println("<<a href="">H1</a>>My AWESOME Web Server!!");
<br>client.print("<<a href="">h4</a>>LED SWITCH:<<a href="">/h4</a>>`");
<br>client.print("<<a href="">br</a>>");
<br>client.println(<a href="">"<a href=\"/turn on LED\"\"><button> TURN ON LED </button></a>"</a>);
<br>client.println(<a href="">"<a href=\"/turn off LED\"\"><button>TURN OFF LED</button></a>"</a>); 
<br>delay(1);
<br>Serial.println("Client disconnected");
<br>Serial.println(""); 
<br>}</code><hr><p>
<blockquote>The program simply let your NodeMCU devkit v1.0 board to connect ot your local access point or your Wi-Fi hotspot <code>const char* ssid = "my wifi SSID"</code> and use the password <code>const char* password = "my wifi password"</code> to authenticate. I have set the port, ip, default gateway, subnet mask and the dns addresses of the web server as static in the program. This is to make sure that when your server shuts down, it will still have the same ip address when it is establish again.I am using GPIO4 as as output pin since it is where I connect the LED.And on the codes ` client.println<> `, I am just simply writing an html program for web server. To give my web server, an awesome content.</blockquote>
Now, connect your NodeMCU devkit v1.0 to your computer using the USB cable (Type A to Mini
B). Go to the <b>device manager</b> then, identify its port number if it is your first time to use this board. Now, go the Arduino IDE and click <b>Tools</b> > <b>Port</b> and look for the
port of your NodeMCU dekit v1.0.<p>
Upload the program above. <em> Make sure to input it properly. (I have already compiled this
program and it has no errors)</em><p>
<b>Step 3:</b> <em>"Test Your Web Server"</em><hr>
After uploading your program to your board, you can test your web server by using your web browser. But make sure that your computer or device is connected on the same local access point or Wi-Fi hotspot. If you do, you are on the same local area network now and you can access your web server already.<p>
To access your web server, just type the ip address you set like in my case, it is <code>192.168.43.67:301</code><p>
Your web page must look like this.<p>
https://res.cloudinary.com/hpiynhbhq/image/upload/v1516177813/t0fglpljsuzhovc4oetw.png

<p>
<b>Step 4:</b> <em>"Do Web Server Request by Switching the LED"</em> <hr>
Press the button, <button>Turn on LED</button> and the LED connected to GPIO4 of the NodeMCU board should glow.<p>Then, press the button, <button>Turn off LED</button> and the LED should turn off now.<br><br>

<h3> Curriculum</h3><hr> 
- <a href="https://utopian.io/u/25578052">Auxiliary Wireless TV Power Remote Control using NodeMCU devkit v1.0</a>


<p>
This tutorial is useful if you want to implement wireless communication between devices in a local area network using the internet. Internet of Things is now a technological trend. And this tutorial will help you have a nice start in IoT technology.<br><br>

<blockquote>I hope you enjoy this tutorial. Till next time!</blockquote><p>
Your contributor, @japh


<br /><hr/><em>Posted on <a href="https://utopian.io/utopian-io/@japh/make-your-own-web-server-using-nodemcu-devkit-v1-0">Utopian.io -  Rewarding Open Source Contributors</a></em><hr/>
👍  , , , , , , , , , , , , , , , , , , , , , , , , , , ,
properties (23)
authorjaph
permlinkmake-your-own-web-server-using-nodemcu-devkit-v1-0
categoryutopian-io
json_metadata{"community":"utopian","app":"utopian/1.0.0","format":"markdown","repository":{"id":35590819,"name":"nodemcu-devkit-v1.0","full_name":"nodemcu/nodemcu-devkit-v1.0","html_url":"https://github.com/nodemcu/nodemcu-devkit-v1.0","fork":false,"owner":{"login":"nodemcu"}},"pullRequests":[],"platform":"github","type":"tutorials","tags":["utopian-io","steemstem","philippines","cebu"],"users":["japh"],"moderator":{"account":"deathwing","time":"2018-01-17T12:17:31.393Z","reviewed":true,"pending":false,"flagged":false}}
created2018-01-17 08:34:27
last_update2018-01-17 12:17:30
depth0
children6
last_payout2018-01-24 08:34:27
cashout_time1969-12-31 23:59:59
total_payout_value22.599 HBD
curator_payout_value9.794 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length9,493
author_reputation2,049,464,088,432
root_title"Make Your Own Web Server using NodeMCU devkit v1.0"
beneficiaries
0.
accountutopian.pay
weight2,500
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id30,125,089
net_rshares4,671,092,969,342
author_curate_reward""
vote details (28)
@deathwing ·
Thank you for the contribution. It has been approved.

You can contact us on [Discord](https://discord.gg/uTyJkNm).
**[[utopian-moderator]](https://utopian.io/moderators)**
properties (22)
authordeathwing
permlinkre-japh-make-your-own-web-server-using-nodemcu-devkit-v1-0-20180117t121735546z
categoryutopian-io
json_metadata{"tags":["utopian-io"],"community":"utopian","app":"utopian/1.0.0"}
created2018-01-17 12:17:33
last_update2018-01-17 12:17:33
depth1
children1
last_payout2018-01-24 12:17:33
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length172
author_reputation269,077,595,754,009
root_title"Make Your Own Web Server using NodeMCU devkit v1.0"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id30,159,294
net_rshares0
@japh ·
Thank you, @deathwing. My efforts paid off.
properties (22)
authorjaph
permlinkre-deathwing-re-japh-make-your-own-web-server-using-nodemcu-devkit-v1-0-20180117t152244518z
categoryutopian-io
json_metadata{"tags":["utopian-io"],"users":["deathwing"],"app":"steemit/0.1"}
created2018-01-17 15:22:48
last_update2018-01-17 15:22:48
depth2
children0
last_payout2018-01-24 15:22:48
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length43
author_reputation2,049,464,088,432
root_title"Make Your Own Web Server using NodeMCU devkit v1.0"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id30,194,831
net_rshares0
@leryam12 ·
Another worthy contribution indeed @japh . Will be following your tutorials more :) Steem On!
properties (22)
authorleryam12
permlinkre-japh-make-your-own-web-server-using-nodemcu-devkit-v1-0-20180117t090005156z
categoryutopian-io
json_metadata{"tags":["utopian-io"],"users":["japh"],"app":"steemit/0.1"}
created2018-01-17 09:00:09
last_update2018-01-17 09:00:09
depth1
children1
last_payout2018-01-24 09:00:09
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length93
author_reputation1,861,063,781,145
root_title"Make Your Own Web Server using NodeMCU devkit v1.0"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id30,128,766
net_rshares0
@japh ·
Thank you for following my tutorials @leryam12.
I will try to improve more. Sharing my knowledge is something I love.
properties (22)
authorjaph
permlinkre-leryam12-re-japh-make-your-own-web-server-using-nodemcu-devkit-v1-0-20180117t113122001z
categoryutopian-io
json_metadata{"tags":["utopian-io"],"users":["leryam12"],"app":"steemit/0.1"}
created2018-01-17 11:31:30
last_update2018-01-17 11:31:30
depth2
children0
last_payout2018-01-24 11:31:30
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length117
author_reputation2,049,464,088,432
root_title"Make Your Own Web Server using NodeMCU devkit v1.0"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id30,151,953
net_rshares0
@minnowsupport ·
<p>Congratulations!  This post has been upvoted from the communal account, @minnowsupport, by Japh from the Minnow Support Project. It's a witness project run by aggroed, ausbitbank, teamsteem, theprophet0, someguy123, neoxian, followbtcnews, and netuoso. The goal is to help Steemit grow by supporting Minnows.  Please find us at the <a href="https://discord.gg/HYj4yvw"> Peace, Abundance, and Liberty Network (PALnet) Discord Channel</a>.  It's a completely public and open space to all members of the Steemit community who voluntarily choose to be there.</p> <p>If you would like to delegate to the Minnow Support Project you can do so by clicking on the following links: <a href="https://v2.steemconnect.com/sign/delegateVestingShares?delegator=&amp;delegatee=minnowsupport&amp;vesting_shares=102530.639667%20VESTS">50SP</a>, <a href="https://v2.steemconnect.com/sign/delegateVestingShares?delegator=&amp;delegatee=minnowsupport&amp;vesting_shares=205303.639667%20VESTS">100SP</a>, <a href="https://v2.steemconnect.com/sign/delegateVestingShares?delegator=&amp;delegatee=minnowsupport&amp;vesting_shares=514303.639667%20VESTS">250SP</a>, <a href="https://v2.steemconnect.com/sign/delegateVestingShares?delegator=&amp;delegatee=minnowsupport&amp;vesting_shares=1025303.639667%20VESTS">500SP</a>, <a href="https://v2.steemconnect.com/sign/delegateVestingShares?delegator=&amp;delegatee=minnowsupport&amp;vesting_shares=2053030.639667%20VESTS">1000SP</a>, <a href="https://v2.steemconnect.com/sign/delegateVestingShares?delegator=&amp;delegatee=minnowsupport&amp;vesting_shares=10253030.639667%20VESTS">5000SP</a>. <br><strong>Be sure to leave at least 50SP undelegated on your account.</strong></p>
properties (22)
authorminnowsupport
permlinkre-make-your-own-web-server-using-nodemcu-devkit-v1-0-20180118t171000
categoryutopian-io
json_metadata""
created2018-01-18 17:10:03
last_update2018-01-18 17:10:03
depth1
children0
last_payout2018-01-25 17:10:03
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length1,700
author_reputation148,902,805,319,183
root_title"Make Your Own Web Server using NodeMCU devkit v1.0"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id30,438,537
net_rshares0
@utopian-io ·
### Hey @japh I am @utopian-io. I have just upvoted you!
#### Achievements
- You have less than 500 followers. Just gave you a gift to help you succeed!
- Seems like you contribute quite often. AMAZING!
#### Suggestions
- Contribute more often to get higher and higher rewards. I wish to see you often!
- Work on your followers to increase the votes/rewards. I follow what humans do and my vote is mainly based on that. Good luck!
#### Get Noticed!
- Did you know project owners can manually vote with their own voting power or by voting power delegated to their projects? Ask the project owner to review your contributions!
#### Community-Driven Witness!
I am the first and only Steem Community-Driven Witness. <a href="https://discord.gg/zTrEMqB">Participate on Discord</a>. Lets GROW TOGETHER!
- <a href="https://v2.steemconnect.com/sign/account-witness-vote?witness=utopian-io&approve=1">Vote for my Witness With SteemConnect</a>
- <a href="https://v2.steemconnect.com/sign/account-witness-proxy?proxy=utopian-io&approve=1">Proxy vote to Utopian Witness with SteemConnect</a>
- Or vote/proxy on <a href="https://steemit.com/~witnesses">Steemit Witnesses</a>

[![mooncryption-utopian-witness-gif](https://steemitimages.com/DQmYPUuQRptAqNBCQRwQjKWAqWU3zJkL3RXVUtEKVury8up/mooncryption-s-utopian-io-witness-gif.gif)](https://steemit.com/~witnesses)

**Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x**
properties (22)
authorutopian-io
permlinkre-japh-make-your-own-web-server-using-nodemcu-devkit-v1-0-20180118t170439467z
categoryutopian-io
json_metadata{"tags":["utopian-io"],"community":"utopian","app":"utopian/1.0.0"}
created2018-01-18 17:04:39
last_update2018-01-18 17:04:39
depth1
children0
last_payout2018-01-25 17:04:39
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length1,502
author_reputation152,955,367,999,756
root_title"Make Your Own Web Server using NodeMCU devkit v1.0"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id30,437,524
net_rshares0