DonnC
6 min readApr 19, 2021

Flutter and IFTTT

Do more with the things you love.

What is IFTTT

IFTTT, which is short for If This Then That, is the easiest way to do more with hundreds of the apps and devices you love, including Twitter, Dropbox, Evernote, iRobot, Fitbit, Amazon Alexa, and Google Assistant etc.

On IFTTT, these are called services. IFTTT helps you connect your services together in remarkable new ways with Applets.

Applets are like mini, active apps you can create — things your apps can’t do on their own. For example, an Applet can sync your Amazon Alexa to-dos with your Google Calendar. Or create events in your iPhone Calendar, via Google Assistant etc.

How IFTTT work?

A user needs to get acquainted with the creation of applets to use this app. An applet refers to a trigger-to-action relationship responsible for performing a particular task. A user can also create an applet to receive personalized notifications when specific conditions are met. After activating an applet, the user need not remember the commands, as IFTTT handles everything. The user also can also turn an applet on or off and edit the settings. A simple example of an applet is, if it is 1:00 PM, then turn off the bedroom lights.

Example App: Send Gmail email from Flutter

To demonstrate the power of this platform, imagine a scenario where user sends us a feedback via the app and we want to be notified about this feedback via email or twitter or any other service. The main advantage of using IFTTT is that, we can skip using some third party plugins in our application which (might) later break our code for example, if we want to send an email, we would need a flutter plugin that does that. So our simple flow is, If user sends feedback, then notify us via gmail.

IFTTT Setup

If you don’t have an IFTTT account already, sign up for free.

I hope you have it now, lets proceed to the fun part of this powerful platform

First, on your account home page. Click on the top create button to create our applet.

After clicking, you should now see a screen like this

Here as the name says, we need to configure the If This, the event we need to listen to first so that we take appropriate action (Then That). So for our simple example, it will be a webhook request from our app that will trigger the service. For that, click the Add button and search for webhook service. You should see something like below

About Webhook Service

Receive a web request. This trigger fires every time the Maker service receives a web request to notify it of an event. With this, we endless opportunities to connect to other services as we will make a web request to our service url from anywhere, be it via website, mobile app or your IoT devices. We will use http library to connect to this webhook service, just hang in there.

After this, click on the Webhooks service to configure it. You will need to provide the event name of your choice, for this example i used event name as feedback since i will fire a user feedback from app to trigger gmail service to send us the feedback.

After creating the webhook trigger, you will be brought back to the screen of creating your applet as before

Now we need to configure the Then That part, this is how easy IFTTT is, just a click of a button, configure and start playing around with it. Lets add our service of choice, in this case, Gmail.

IFTTT has hundreds of services you can choose from and are easy to configure too. Just browse through or search for any of your choice and configure it.

Search for Gmail and select it just as we did with Webhook, you should then see a screen like this

Here you can choose any of the options given. Here for simplicity i chose the second option. Click it and lets configure whats needed here You will find out that, IFTTT configuration is easy and straight forward. You can customize the messages as per your needs and save your configuration. I left mine as they are for simplicity

The Value1, Value2 and Value3 are the optional data you will post when you perform your POST request to your webhook service that we configured at first. You can customize the body here to make it more appropriate. Remember EventName? Thats the event name we named feedback it will be needed when we make a request as you might have many events configured with many applets you create.

After you are done with this configuration. Our applet will now make sense and looks like below

Now makes sense, isnt it? 😉. Just continue with everything from here

Webhook URL

Where is the webhook url? 🤷‍♂️

To get your webhook url, go to

Click on the Documentation button on the top right corner of your profile. Here you will see the webhook service url and key you will use for making web request

As i said earlier, this page explains everything straight forward. We need the url and key so that we make the requests from our flutter app. 😎

Show me the Code

Enough with stories, lets create a flutter app and connect all this in one and send yourself a feedback to your gmail from your flutter app

Add dio or http plugin to your pubspec.yaml file

Here i created a simple service function to make a request to our webhook which will trigger our event on IFTTT and the rest will be magic from there

Thats all the magic there is to it, just a simple post request to the webhook url and we are done.

For the UI, i made a simple one page ugly ui like this in your Stateful widget

Thats all from me for now 😃. I hope you found this article useful.

Do check your email after running😄

Result:

More on IFTTT

Here i demonstrated a working demo with Gmail, but with IFTTT, you can hook up almost any service. This is handy when you cant find a plugin that connects directly to the service you want. Want to populate a google sheet from your app? Look for its service and configure it.
Doing a smart home automation project? You might find IFTTT to be very handy. Want to save a file to Dropbox or GDrive instead? Configure its service.
IFTTT sure opens up numerous doors to connect our projects to other popular services out there. Thats it from me ✌. Happy Fluttering

Sign up to discover human stories that deepen your understanding of the world.

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

DonnC
DonnC

Written by DonnC

Assistant to the Emperor 🫅🏼

No responses yet

Write a response