- Set up a database on Google Firebase
- Develop an Android App using MIT App Inventor
- Use the Android App to control an LED on the NodeMCU
- NodeMCU board (quantity: 1 no.)
- Micro USB cable A to B (quantity: 1 no.)
- Breadboard (quantity: 1 no.)
- Android mobile phone (quantity: 1 no)
- Google account
- MIT App inventor account
- Arduino IDE on your computer
MIT App inventor is an easy way to make Android apps. It provides you a simple solution to drag and drop blocks. We will use this to interact with a database we make on Google Firebase. We will then control an LED on the NodeMCU using the Android app. To see how MIT App inventor looks, click MIT App Inventor
Create a Realtime database on Google Firebase
Step 1: Go to https://firebase.google.com/ and login using your Google account. Click on GO TO CONSOLE
Step 2: Click on Add project
Step 3: Give a project name. Select Analytics location as India. Click on Create project
Step 4: Click on settings the symbol beside Project Overview. Click on Project settings.
Step 5: Under the Service accounts tab, click on Database secrets. Click on Show and copy the secret code. Make a note of this code as you will need it while programming.
Step 6: On the left hand side, go to Develop and select Database. Scroll to find Realtime Database and click on Create database
Step 7: Select Start in test mode. Click on Enable.
Step 8: Copy the URL above the database and make a note of it. Make sure to remove “https://” and any”/” and “\”.
Create an Android App using MIT App Inventor
Step 1: Go to ai2.appinventor.mit.edu and create a new Project.
Step 2: From User Interface on the Palette, drag and drop a button onto the screen as shown. Repeat once
Step 3: In Properties, change the Height and Width to Fill parent
Step 4: Change the Text of the buttons to ON and OFF.
Step 5: From Experimental on the Palette, drag and drop FirebaseDB onto the screen as shown. Ignore any warnings you get
Step 6: Select FirebaseDB1 in Components. In Properties, paste your Firebase Database URL in the FirebaseURL area. Make sure Use Default is unchecked and ProjectBucket is empty
Step 7: Click on Blocks (top right corner) to continue with the logic part of the code
Step 8: Select Button1 in Blocks. Drag the Button1.Click block onto the canvas. Repeat for Button2
Step 9: Select FirebaseDB1 in Blocks. Drag the FirebaseDB1.StoreValue block onto the canvas. Repeat this once more.
Step 10: Attach the FirebaseDB1.StoreValue blocks to the ButtonX.Click blocks
Step 11: From Text, drag the text string (” “) block and attach it to tag on the Firebase blocks.
Step 12: From Math, drag the number (0) block and attach it to valueToStore on the Firebase blocks. Repeat once
Step 13: Change the text and number values in the blocks
Step 14: Now your App is ready. You can make color changes to your screen and button. To download the App, click on Build and select App (save .apk to my computer ). Copy this apk to an android phone and install
If you have trouble making the App as shown, you can download the AIA file of the completed project and upload it to MIT App Inventor as shown below, make changes to your Firebase URL and download the apk.
Opening an .aia file in MIT App Inventor
Download the FirebaseArduino library Open Arduino IDE. Go to Sketch -> Include Library -> Add .ZIP library. Add the zip file you downloaded.
You will also need to install ArduinoJson library version 5.13.1. Go to Sketch -> Include Library -> Manage libraries. Search for ArduinoJson, select version 5.13.1 and click install.
To copy the code, right click on view raw at the bottom of the code, click on open link in new tab and then copy the code.
Uploading the code
Step 1: Enter the final code in the Arduino IDE window.
- When you click on New to open a new blank code in the Arduino IDE, you will get a new window with two functions: void setup() and void loop()
- You can either type commands as shown in the final code under void setup() and void loop() functions or
- Delete the contents of this window. Then copy and paste the final code in the Arduino IDE window.
Step 2: Compile/ verify the code by clicking on the verify button.
- Make sure the board is connected to your computer
- Check if the correct board and port is selected.
Step 3: Upload the code by clicking on the upload button, which is right next to the verify button.
- The Arduino IDE provides a progress bar when it’s uploading.
- After it is done, you will see “Done uploading” on the bottom left of your IDE.
- If you encounter any errors, you need to go back to the code and fix the errors.