Gmail App In Thunkable X

In this blog i’m going to show you how you can send emails from your Gmail account to users email from your thunkable-X apps.

How to send emails from your Gmail Account from thunkable-X projects/App.

Hi tere, I’m tanish.. in this blog i’m going to explain you how you can send eamail fron your gamil address from your thunkable-X apps very easily using Googlr App Script. Note that you can only send 100 emails in a day.

  • 3 Text boxes [ For Name, Email & Commets ]
  • 1 Button [ to trigger the action ]
  • 1 API Component [ to submit the form ]
  • 1 Notifier [ to show the success/error message ]
  • 3 Labels [ Just to show some additional information on screen ūüėĀ ]

Now follow these below STEP-BY-STEP process…

Step – 1

Go to¬†x.thunkable.com¬†and craete a project. Here i have created with the title¬†Gmail App. In this project we have 3 text boxes for¬†Email, Subject¬†&¬†Message/body of email. Also a button to send the Email. Now Drag-n-Drop¬†API Component¬†we’ll use this to send the email [¬†here i have named it as Gmail_API¬†] and a¬†Notifier Component¬†to display notification/message. Also design your app a little bit if you want to

Step – 2

Go to¬†Google App Script¬†and create a new project by clicking on the¬†+ New project¬†button at the top left corner of the webpage. ( It’ll take you to a new tab ) Here i have created one with title¬†Gmail_APP¬†as you can see in the below image.

Now write this code in the code.gs

/*
* Written By : Ct tricks
* Date : 29/02/2020
* Contact : help.cttricks@gmail.com
*/

function doPost(e) {
//this function will send emails from your gamil address ....@gamil.com
var recipient = e.parameters.recipient;
recipient = decodeURI(recipient);

var subject = e.parameters.subject;
subject = decodeURI(subject);

var body = e.parameters.body;
body = decodeURI(body);

//here is the mail app acript to send emails from your gmail address to the user's emails address
MailApp.sendEmail(recipient, subject, body);
}

Step – 3

Now click on¬†Publish¬†>¬†Deploy as web app¬†a popup window will be open on your screen,¬†Execute the app as:¬†Me (Your_email_address) &¬†Who has access to the app :¬†Anyone, even anonymous. and then click on¬†Deploy¬†it’ll as for permissions simply grant those.

After successful deployment action url be like
https://script.google.com/macros/s/AKfycbwSeNUCZ80Mz6zXxxxx_XXXXxxxxBuWLWLTJxngXXQNsXXwlQ/exec Copy this API/Script url.

Step – 4

Now got to the blocks editor section of your thunkable-X project and Drag-n-Drop the When Submit button click event block into the blocks editor area.

Now Drag-n-Drop other compoennts to the block area as shown in the image above. Also make sure to put the API/Script URL in the Gamil_API components Set URL block, And Parameters such as recipient, subject & body to the queryparameters block of the Gmail_API component as shown in the image.

Here status returns the response code. So if the Status = 200 it means the form get submitted successfully else any error occyred.

Hmm.. Everything Is All Set.. you can test your app now. It is ready to send email from your gmail address right from this app

ūüė鬆A Bonus,¬†you can use this same method to verify your app users email address by using OTP verification method. I.e sendinga n OTP to your userd email and ask them to verify on your app. If you have any query or suggestion feel free to comment below

Leave a Reply

Your email address will not be published. Required fields are marked *