# MIT App Inventor and Particle.IO

## What is App Inventor?

![](https://cdn-learn.adafruit.com/assets/assets/000/035/927/medium800/hacks_logo.png?1474572906)

Making custom Applications for Android OS can be difficult unless you have a deep understanding of Java. MIT's App Inventor removes that barrier by providing an easy to use drag and drop style of coding to App development.

Most IoT projects need a user interface and while IFTTT and DO Buttons work well, sometimes you want something a bit more versatile.

This guide will take you through the steps to create a dedicated App for your IoT project using any of the Particle devices. We will focus on the simple Web Connected LED sketch from Particle, then point out the critical parts of the App Inventor code that will let you send and receive any information to and from the Particle device.&nbsp;

To get started with MIT App Inventor, go to the following link;

[http://appinventor.mit.edu/](http://appinventor.mit.edu/)

1. Once there, click on the&nbsp;[Create apps!](http://ai2.appinventor.mit.edu/) button in&nbsp;the top right of the page.
2. App Inventer uses your **Google account** for verification and will ask you to grant access to it. Don't worry, they wont sell off your information.
3. Click the **Start new project** button and we are all set.

# MIT App Inventor and Particle.IO

## The Design View

This is set up to work with the **Web Connected LED** example app for the **Particle Spark** , **Photon** , or **Electron**.

**App Inventor** is an easy way to make **Apps** for the **Android** platform. We will go through how to use **App Inventor** for communicating with any **Particle** device.

# The Designer

You will want to make two buttons. The button names do not matter, but we will just call them **ButtonOn** and **ButtonOff.**

![AppInvent01](http://www.richa1.com/RichardAlbritton/wp-content/uploads/2016/04/AppInvent01-1.png)

Next we will add the **Web** component with the following attributes.

![AppInvent02](http://www.richa1.com/RichardAlbritton/wp-content/uploads/2016/04/AppInvent02.png)

1. Check **AllowCookies**.
2. Enter&nbsp; **https://api.particle.io/v1/devices/** in the **Url** field.

# MIT App Inventor and Particle.IO

## Code Blocks

Now we get into the coding. The thing to keep in mind is that a Particle function can only be called with an HTTP POST request. App Inventor makes it easy to send GET data so we will have to jump through a few hoops to get there.

This green button below links to the file which may be imported directly into App Inventor.

[Particle.aia on the Adafruit GitHub repository](https://github.com/adafruit/Adafruit_Learning_System_Guides/blob/master/MIT_AppInventor_Particle/Particle.aia)
![](https://cdn-learn.adafruit.com/assets/assets/000/031/826/medium800/hacks_AppInvent09.png?1460966247)

# MIT App Inventor and Particle.IO

## Set Global Variables

First, lets set up some global variables. These can be found under Variables and initialize globally. To this we will add a Text value to start with.

![](https://cdn-learn.adafruit.com/assets/assets/000/031/822/medium800/hacks_AppInvent04.png?1460965815)

1. Make sure the **serverURL** is set to “ **https://api.particle.io/v1/devices/** “.
2. Copy the&nbsp; **Device ID** and use that for the **deviceID** variable.
3. Locate the&nbsp; **Access Token** from your Particle account and use that for the&nbsp; **accessToken**.
4. **Fun** should be set to the function name from the Particle code. For this instance, we are calling “led”.
5. **Var** is a placeholder for the value we will be sending to the function. It is blank.
6. **HTTP\_Reply** can be used to get a conformation message from the Particle device.
7. **PINstate** can be used later to toggle the On/Off button.

# MIT App Inventor and Particle.IO

## The Send Procedure

In App Inventor, a Procedure is a block of code that&nbsp;can be called on to run at any time. This saves time and space when you need to run the same code over and over again.

![](https://cdn-learn.adafruit.com/assets/assets/000/031/823/medium800/hacks_AppInvent06.png?1460965912)

1. From the **Procedures** blocks, add the **Do** block.
2. Name this procedure “ **SendToParticle** “.
3. Add the **Set Web1** block from the **Web1** section to the new procedure.
4. Now we will assemble a string for the&nbsp; **set Web1.Url** by using the **Join** block from Text.
5. All together we will be joining the **serverURL, deviceID,** “ **/** “, **Fun,** “ **?access\_token=** “, and **accessToken**.
6. Under the **Set.Url** block, we will add a **Call.PostText** block from the **Web1** section.
7. To this we will add a **Join** block for&nbsp;sending to our Particle function via **POST** request.
8. We will join “ **params=** ” and the **Var** value.

When ever this&nbsp;procedure is called Val will be sent via POST to:

**https://api.particle.io/v1/devices/your-device-id/led?access\_token=your-access-token**

#### &nbsp;
# MIT App Inventor and Particle.IO

## The Button Click

For now we will just use one button for ON and one for OFF. So we want to grab the **when.click** from the **ButtonOn** and **ButtonOff** blocks.

![](https://cdn-learn.adafruit.com/assets/assets/000/031/824/medium800/hacks_AppInvent05.png?1460965999)

1. To that we will add a **Set** block for the **Var** variable. Also add the value of **“on”** to this.
2. Next we will be calling on the&nbsp; **SendToParticle** Procedure.

That is it!

Once this App is loaded onto your phone it will turn the built-in LED, attached to Pin 7 on the Particle device, on or off.

# MIT App Inventor and Particle.IO

## What Next?

Well this is a good place to get you started. From here you can try to make the button toggle the LED on or off.

![](https://cdn-learn.adafruit.com/assets/assets/000/057/445/medium800/hacks_AppInvent08-169x300.png?1531238977)

Change the button into an image to make things look a little nicer.

Add a Relay to Pin 7 on the Particle device and you can turn an actual light on or off.

The possibilities are nearly endless and this will help get you well on the road to making it easy to use the next big IoT thing.


## Featured Products

### Particle Photon Starter Kit

[Particle Photon Starter Kit](https://www.adafruit.com/product/2723)
The Particle Photon Kit includes a [Photon with headers](https://www.adafruit.com/products/2721), a shiny white half-size solderless breadboard, a USB-micro cable, and a couple of extra surprises (two resistors, an LED, and a photocell) to help you start building your Internet of...

No Longer Stocked
[Buy Now](https://www.adafruit.com/product/2723)
[Related Guides to the Product](https://learn.adafruit.com/products/2723/guides)
### Particle Electron Cellular IoT Kit - 2G Global

[Particle Electron Cellular IoT Kit - 2G Global](https://www.adafruit.com/product/3233)
 **The Electron** is a small cellular IoT board made by Particle. This tiny development kit has everything you need for creating **2G** &nbsp;cellular connected products. Includes a prepaid, no contract data plan&nbsp;and instant web access to your Electron with...

No Longer Stocked
[Buy Now](https://www.adafruit.com/product/3233)
[Related Guides to the Product](https://learn.adafruit.com/products/3233/guides)
### Particle Electron Cellular IoT Kit - 3G Americas/Aus

[Particle Electron Cellular IoT Kit - 3G Americas/Aus](https://www.adafruit.com/product/3234)
 **The Electron** is a small cellular IoT board made by Particle.&nbsp;This tiny development kit has everything you need for creating **3G** &nbsp;cellular connected products.&nbsp;Includes a prepaid, no contract data plan and instant web access to your Electron with...

No Longer Stocked
[Buy Now](https://www.adafruit.com/product/3234)
[Related Guides to the Product](https://learn.adafruit.com/products/3234/guides)
### Particle Photon with Headers

[Particle Photon with Headers](https://www.adafruit.com/product/2721)
Discontinued - **you can grab this&nbsp;** [Adafruit ESP32 Feather V2 - 8MB Flash + 2 MB PSRAM - STEMMA QT](https://www.adafruit.com/product/5400)&nbsp; **instead!**

**The Photon** is a $19 tiny Wi-Fi development kit for creating connected projects and...

No Longer Stocked
[Buy Now](https://www.adafruit.com/product/2721)
[Related Guides to the Product](https://learn.adafruit.com/products/2721/guides)
### Particle Photon without Headers

[Particle Photon without Headers](https://www.adafruit.com/product/2722)
 **The Photon** &nbsp;is a $19 tiny Wi-Fi development kit for creating connected projects and products for the Internet of Things. It's easy to use, it's powerful, and it's connected to the cloud.

The tools that make up the Photon's ecosystem (and come along...

No Longer Stocked
[Buy Now](https://www.adafruit.com/product/2722)
[Related Guides to the Product](https://learn.adafruit.com/products/2722/guides)
### Particle Maker Kit with Photon

[Particle Maker Kit with Photon](https://www.adafruit.com/product/2798)
The Particle Maker Kit has&nbsp;just about everything you need to get started with your Particle Photon. &nbsp;It's the kind of no nonsense starter kit that's filled with all the components and accessories you need to build&nbsp;simple internet enabled projects and up your hacker level...

No Longer Stocked
[Buy Now](https://www.adafruit.com/product/2798)
[Related Guides to the Product](https://learn.adafruit.com/products/2798/guides)

## Related Guides

- [MagTag Daily Christmas Countdown](https://learn.adafruit.com/magtag-daily-christmas-countdown.md)
- [Wearable Continuous Temperature Monitor with Adafruit IO](https://learn.adafruit.com/wearable-temperature-monitor.md)
- [Fish Head MONSTER M4SK Eyes](https://learn.adafruit.com/wide-set-monster-m4sk-creature-eyes.md)
- [RP2040 RunCPM Emulator with USB Keyboard & HDMI screen](https://learn.adafruit.com/rp2040-runcpm-emulator-with-usb-keyboard-hdmi-screen.md)
- [Fake TV Light for Engineers](https://learn.adafruit.com/fake-tv-light-for-engineers.md)
- [Prophet 600 GliGli mod](https://learn.adafruit.com/prophet-600-gligli-mod.md)
- [DeviceScript, TypeScript for Microcontrollers](https://learn.adafruit.com/devicescript.md)
- [Sandblaster - 3D printed sand buggy](https://learn.adafruit.com/sandblaster-3d-printed-sand-buggy.md)
- [PyPortal Weekly Countdown Clock](https://learn.adafruit.com/pyportal-countdown-clock.md)
- [FFT: Fun with Fourier Transforms](https://learn.adafruit.com/fft-fun-with-fourier-transforms.md)
- [Build an ESP8266 Mobile Robot](https://learn.adafruit.com/build-an-esp8266-mobile-robot.md)
- [Native MP3 decoding on Arduino](https://learn.adafruit.com/native-mp3-decoding-on-arduino.md)
- [Python Debouncer Library for Buttons and Sensors](https://learn.adafruit.com/debouncer-library-python-circuitpython-buttons-sensors.md)
- [Adafruit PiCowbell Proto for Pico](https://learn.adafruit.com/picowbell-proto.md)
- [Using NeoPixels with Netduino Plus 2](https://learn.adafruit.com/using-neopixels-with-netduino.md)
