avatarMoto DEI

Free AI web copilot to create summaries, insights and extended knowledge, download it at here

5267

Abstract

n in configuration: Lambda is not easy when you use external library (including Pandas!); and Cloud Functions receives HTTP request from only one URL per function, which means we have to copy the Python code and edit a few lines again and again when having multiple life events we want to log.</p><p id="caee">In this article, I demonstrate the cases when we use Cloud Functions and Heroku. Local server case is pretty much the same as the Heroku one in a sense of the code.</p><h1 id="5d8f">Demo 1 for API Solution — Google Cloud Functions</h1><p id="2f1a">To have Google Cloud Functions receive the HTTP request and push record to Google Sheets, the followings are the steps:</p><h2 id="f8b7">Step 1 — Create a new GCP project</h2><p id="a60f">It is better to create a new one for isolation from other projects you already have. I created a new one with the name “Record iPhone Click”.</p><h2 id="4e7b">Step 2 — Configure Google Sheets first to receive the data push from Cloud Functions</h2><p id="420c">Set up the Google Sheets side first because we need the authentication info for the Cloud Functions code.</p><p id="2731">Following <a href="https://gspread.readthedocs.io/en/latest/oauth2.html">the description in this page</a>,</p><ol><li>Enable “Google Drive API”.</li><li>Enable “Google Sheets API”.</li><li>Go to “APIs & Services > Credentials” and choose “Create credentials > Service account key”.</li><li>Fill out the form</li><li>Click “Create key”</li><li>Select “JSON” and click “Create”. Download of a JSON file automatically takes place.</li><li>Note the address from “client_email” in the JSON file.</li><li>Save the JSON file to somewhere the Cloud Functions can access to.</li><li>Create a spread sheet in Google Sheets. Write “event” in cell A1 and “time” in cell B1, as a header for the final log record.</li><li>In the sheet file, pressing the “Share” button on the top right, add client_email you get from step 7 above as an authorized user.</li></ol><p id="8002">This is all!</p><h2 id="f9a7">Step 3— Configure a new function in Cloud Functions</h2><p id="7d5f">Go to “Cloud Functions” and CREATE FUNCTION. Use Trigger type as “HTTP”.</p><figure id="470c"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*sfQJna2dUwl9BDo56HSOlw.png"><figcaption>Configuration of new Cloud Functions (snapped by author)</figcaption></figure><h2 id="8eb4">Step 4— Input code to main.py and requirements.txt</h2><p id="20ab">Press Next on the bottom left, and go to the code input page.</p><figure id="f8c9"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*VJWARHoVEK5B3hekVaA00Q.png"><figcaption>Code of new Cloud Functions</figcaption></figure><p id="0b5b">Here’re the code I actually used.</p> <figure id="c098"> <div> <div>

            <iframe class="gist-iframe" src="/gist/daydreamersjp/c9b95c4b72e13f6d04353948abb31359.js" allowfullscreen="" frameborder="0" height="undefined" width="undefined">
          </div>
        </div>
    </figure></iframe></div></div></figure>
    <figure id="98a9">
        <div>
          <div>
            
            <iframe class="gist-iframe" src="/gist/daydreamersjp/32cd250e55cb52abe27252e8b7a87ae2.js" allowfullscreen="" frameborder="0" height="undefined" width="undefined">
          </div>
        </div>
    </figure></iframe></div></div></figure><p id="8f69">Just remember that the service account JSON file is required to be downloaded into local folder and when you want to do it in Cloud Functions, you have to save the file in <code>/tmp/</code> sub-folder. Otherwise, Cloud Functions refuses to build your app.</p><h2 id="4db5">Step 5 — Deploy the function</h2><p id="ecae">Click “Deploy” button and wait for the successful deployment. It can take a few minutes.</p><h2 id="0aab">Step 6 — Find the URL and check if it’s working</h2><p id="dcd0">URL can be found in the details of the function.</p><figure id="6b67"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*P29otPLs5zRS8RnvdNnvcQ.png"><figcaption>Where you can find the URL.</figcaption></figure><p id="a238">If you test-click it, you will see the following-like message, which means the code is successfully deployed. If you see internal error, server error, or any other errors, something is wrong.</p><figure id="4a1a"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*RpZatPBiRp76-vcoLl0aOw.png"><figcaption>Successful message.</figcaption></figure><p id="7a1d">Here you should also see a new record in the sheet you created.</p><figure id="ad40"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*XykO93ZbNcUWCClXicuXtQ.png"><figcaption>Newly inserted record in the sheet.</figcaption></figure><h2 id="3206">Step 7 — Send the URL to your iPhone and make a Safari link on your home screen</h2><p id="b0e5">Open your URL on your iPhone and add the shortcut to Home Screen.</p><figure id="84b6"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*Tnr0zLz9WBMv77bMBPvF7A.png"><figcaption>Add your link to Home Screen</figcaption></figure><p id="a155">Then, you can see the new icon on your iPhone home screen.</p><p id="07fa">Done!</p><figure 

Options

id="2566"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*oy4ZqfuoCAZP-_UfyDsUUA.png"><figcaption>What we finally got</figcaption></figure><h2 id="2725">Step 8 — To make the URL links for your other life logs, copy the function again and again, set up the event name, and add each shortcut to your home screen.</h2><p id="af2e">This is the most inconvenient part of this option: Cloud Function’s code can be only linked to one HTTP request URL. Therefore, if you need more than one life logs (like “feed baby”, “baby wakes up”, “arrived at office”, etc.), only you can do is to create the functions again and again.</p><figure id="b165"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*r-cRB_bGZFVXICV2YL16ug.png"><figcaption>Make separate functions to every event.</figcaption></figure><p id="8cb7">This process can be significantly reduced when you have more control in API set up like the next option using Heroku!</p><h1 id="c80e">Demo 2 for API Solution — Heroku</h1><p id="1267"><a href="https://towardsdatascience.com/need-to-prepare-a-demo-site-for-your-analysis-on-python-think-of-heroku-flask-dash-f8680a859105">In my another post</a>, I have discussed a lot what is the benefit of Heroku and how to set up. Thus, I will only talk about the code to be committed to GitHub repository synced with Heroku. Once set up, Heroku can pull your app from GitHub automatically and deploy it.</p><figure id="2572"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*0NATIDUgJAmCfZPpaEG8Pg.png"><figcaption>Heroku synchronizes with GitHub repository and serves the most updated app 24/7. (Image by author)</figcaption></figure><h2 id="9f26">Step 1 — Prepare GitHub repository to be synced with Heroku</h2><p id="784d">Here’s my GitHub repository:</p><figure id="6b34"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*aGmPsWPUHWDtJ1gqyLQgDQ.png"><figcaption></figcaption></figure><p id="feae">The requirements.txt is exactly the same as the one in Demo 1 with Cloud Functions above.</p><p id="ed26">Here’re the contents in other two files:</p> <figure id="b5ab"> <div> <div>

            <iframe class="gist-iframe" src="/gist/daydreamersjp/7235810ce968e0b9a5320c090b7d227c.js" allowfullscreen="" frameborder="0" height="undefined" width="undefined">
          </div>
        </div>
    </figure></iframe></div></div></figure>
    <figure id="3fce">
        <div>
          <div>
            
            <iframe class="gist-iframe" src="/gist/daydreamersjp/cbc241262586f16f72a76756995b7240.js" allowfullscreen="" frameborder="0" height="undefined" width="undefined">
          </div>
        </div>
    </figure></iframe></div></div></figure><p id="ee90">As you can see in the code, in Heroku code, you need to code some additional lines to set up app through Flask. On the other hand, we can set up multiple URLs with sub-directories linked to each life log you want to set up (like <code><i>main domain/feed-baby</i></code>) , without preparing multiple apps for them, unlike Cloud Functions case above.</p><h2 id="4ed9">Step 2 — Configure Heroku to sync with GitHub repository</h2><p id="c606">This step owes a lot <a href="https://towardsdatascience.com/need-to-prepare-a-demo-site-for-your-analysis-on-python-think-of-heroku-flask-dash-f8680a859105">my another post here</a> to tell you how. Nothing is different as long as you choose the right GitHub repository we just set up.</p><h2 id="4c0c">Step 3— Find the URL and check if it’s working</h2><p id="26c0">Find the root URL from Heroku set up and add sub-directory for the life log, such as <a href="https://record-iphone-click.herokuapp.com/"><code>https://<your subdomain="" of="" heroku="" app="">.herokuapp.com/</your></code></a><code>arrive-at-office/</code> . Check on your browser and your sheet if the API is working properly.</p><figure id="36e7"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*iewQXHqqD9HPi5mauXWcZw.png"><figcaption>Check on your browser</figcaption></figure><figure id="2b31"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*AzSHn9UdyrRG1V-UhOGHyA.png"><figcaption>Check on your sheet</figcaption></figure><h2 id="0697">Step 4— Send the URL to your iPhone and make a Safari link on your home screen</h2><p id="4b6e">This step is exactly the same as in the case of Cloud Functions above.</p><figure id="a8b2"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*oy4ZqfuoCAZP-_UfyDsUUA.png"><figcaption>What we finally got</figcaption></figure><h1 id="95a0">Ending Note</h1><p id="d777">In this post, I demonstrated an example that combining the skills which data scientists already know can reach further applications than we usually expect.</p><p id="cdf6">The iPhone (or any smart phone) can make an HTTP request and when we can set up the work flow properly, initiated by HTTP request &gt; kick off the code &gt; give results, anything can be done. This post demonstrated a very simple example to note the life log to Google Sheets with one tap of iPhone icon, but any further advanced application can be produced and it is up to your imagination!</p></article></body>

Creating an iPhone App-Like Only With Your Data Science Skills: One-Tap Life Logger Linked to Google Sheets

All you use are Python and GCP Cloud Functions or Heroku.

Image by author

I haven’t trained myself as a mobile app developer, therefore having my own app on my iPhone is beyond my fair dream. But, some simple functionalities like the one I will demonstrate in this post can be equipped without any software development skills and processes, like Swift programming and app store review.

Here, I thought about creating something with a simple function like when you clicked on an icon and it noted the time you clicked on it.

How about the following life logs that you click on, none of which you feel like setting up a spreadsheet just for that purpose?

  • When arriving at the office: as soon as you get to the office, you check your email, so you forget to write down the time you got there, right? (not the case for remote-workers)
  • When leaving office: you’re usually running, so you forget to write down the time, right? (not the case for remote-workers)
  • When feeding baby: you forget to write it down because you’re usually cleaning up a mess, right? (it’s the case of everyone)
  • When Baby wakes up: the war is on! I don’t have time to take notes! (it’s the case of everyone)

And let’s quit storing it locally on the device and put it in the cloud. That’s how we do everything now.

Photo by Derek Owens on Unsplash

That’s how I came up with the idea: when you tap the icon on your iPhone (or any other smartphone), it automatically remembers the time and records it in Google Sheets.

In this post, I will to write about how I made this happen, without really building the mobile app, even only with data science skill sets!

Table of Contents

  • Plan the Solution
  • Demo 1 for API Solution — Google Cloud Functions
  • Demo 2 for API Solution — Heroku
  • Ending Note

Plan the Solution

Now here’s how I planed the background architecture.

What we want is the icons on iPhone home screen. Tapping one of the icons triggers something and logs records in Google Sheets somehow. Without the use of special programming skills, how can we do it??

How can you connect your iphone icon and Google Sheets, without CS skills? (Image by author)

Here’s how I cheated: the icon is not an app, it is a Safari shortcut to a specific HTTP request. In the middle, an API appears, which receives HTTP call and pushes records to Google Sheets in the end.

Tap icon -> HTTP request -> trigger of API -> push to Google Sheets. (image by author)

This trick has solved most of the technical problems but there still remains one question: who and how to host the API.

Who will host the API? (image by author)

There are many possibles API solutions, but each them can have pros and cons.

Pros and cons per API solution

By use of personal server, you have to prepare many but have more freedom in configuration in return. Maintenance cost is high to keep the machine running all the time to wait for HTTP requests, therefore it is an overkill for a small app like ours this time.

PaaS (like Heroku) is a viable option to keep your app hosted and served all the time. It is rather easy to set up as we will see later. Actually, I think this one is the most fair solution among all; the only note is that the Heroku free account has monthly limitation of use — 1000 hours per month for all apps combined. This is equivalent to 41.7 days, thus enough for one app but may matter when you already have another app running on Heroku.

Serverless service on cloud like Lambda on AWS or Cloud Functions on GCP is another possible option. Although it is the easiest for deployment because almost every infra is hosted and only you need is the Python code to run, each serverless service has its unchangeable limitation in configuration: Lambda is not easy when you use external library (including Pandas!); and Cloud Functions receives HTTP request from only one URL per function, which means we have to copy the Python code and edit a few lines again and again when having multiple life events we want to log.

In this article, I demonstrate the cases when we use Cloud Functions and Heroku. Local server case is pretty much the same as the Heroku one in a sense of the code.

Demo 1 for API Solution — Google Cloud Functions

To have Google Cloud Functions receive the HTTP request and push record to Google Sheets, the followings are the steps:

Step 1 — Create a new GCP project

It is better to create a new one for isolation from other projects you already have. I created a new one with the name “Record iPhone Click”.

Step 2 — Configure Google Sheets first to receive the data push from Cloud Functions

Set up the Google Sheets side first because we need the authentication info for the Cloud Functions code.

Following the description in this page,

  1. Enable “Google Drive API”.
  2. Enable “Google Sheets API”.
  3. Go to “APIs & Services > Credentials” and choose “Create credentials > Service account key”.
  4. Fill out the form
  5. Click “Create key”
  6. Select “JSON” and click “Create”. Download of a JSON file automatically takes place.
  7. Note the address from “client_email” in the JSON file.
  8. Save the JSON file to somewhere the Cloud Functions can access to.
  9. Create a spread sheet in Google Sheets. Write “event” in cell A1 and “time” in cell B1, as a header for the final log record.
  10. In the sheet file, pressing the “Share” button on the top right, add client_email you get from step 7 above as an authorized user.

This is all!

Step 3— Configure a new function in Cloud Functions

Go to “Cloud Functions” and CREATE FUNCTION. Use Trigger type as “HTTP”.

Configuration of new Cloud Functions (snapped by author)

Step 4— Input code to main.py and requirements.txt

Press Next on the bottom left, and go to the code input page.

Code of new Cloud Functions

Here’re the code I actually used.

Just remember that the service account JSON file is required to be downloaded into local folder and when you want to do it in Cloud Functions, you have to save the file in /tmp/ sub-folder. Otherwise, Cloud Functions refuses to build your app.

Step 5 — Deploy the function

Click “Deploy” button and wait for the successful deployment. It can take a few minutes.

Step 6 — Find the URL and check if it’s working

URL can be found in the details of the function.

Where you can find the URL.

If you test-click it, you will see the following-like message, which means the code is successfully deployed. If you see internal error, server error, or any other errors, something is wrong.

Successful message.

Here you should also see a new record in the sheet you created.

Newly inserted record in the sheet.

Step 7 — Send the URL to your iPhone and make a Safari link on your home screen

Open your URL on your iPhone and add the shortcut to Home Screen.

Add your link to Home Screen

Then, you can see the new icon on your iPhone home screen.

Done!

What we finally got

Step 8 — To make the URL links for your other life logs, copy the function again and again, set up the event name, and add each shortcut to your home screen.

This is the most inconvenient part of this option: Cloud Function’s code can be only linked to one HTTP request URL. Therefore, if you need more than one life logs (like “feed baby”, “baby wakes up”, “arrived at office”, etc.), only you can do is to create the functions again and again.

Make separate functions to every event.

This process can be significantly reduced when you have more control in API set up like the next option using Heroku!

Demo 2 for API Solution — Heroku

In my another post, I have discussed a lot what is the benefit of Heroku and how to set up. Thus, I will only talk about the code to be committed to GitHub repository synced with Heroku. Once set up, Heroku can pull your app from GitHub automatically and deploy it.

Heroku synchronizes with GitHub repository and serves the most updated app 24/7. (Image by author)

Step 1 — Prepare GitHub repository to be synced with Heroku

Here’s my GitHub repository:

The requirements.txt is exactly the same as the one in Demo 1 with Cloud Functions above.

Here’re the contents in other two files:

As you can see in the code, in Heroku code, you need to code some additional lines to set up app through Flask. On the other hand, we can set up multiple URLs with sub-directories linked to each life log you want to set up (like main domain/feed-baby) , without preparing multiple apps for them, unlike Cloud Functions case above.

Step 2 — Configure Heroku to sync with GitHub repository

This step owes a lot my another post here to tell you how. Nothing is different as long as you choose the right GitHub repository we just set up.

Step 3— Find the URL and check if it’s working

Find the root URL from Heroku set up and add sub-directory for the life log, such as https://.herokuapp.com/arrive-at-office/ . Check on your browser and your sheet if the API is working properly.

Check on your browser
Check on your sheet

Step 4— Send the URL to your iPhone and make a Safari link on your home screen

This step is exactly the same as in the case of Cloud Functions above.

What we finally got

Ending Note

In this post, I demonstrated an example that combining the skills which data scientists already know can reach further applications than we usually expect.

The iPhone (or any smart phone) can make an HTTP request and when we can set up the work flow properly, initiated by HTTP request > kick off the code > give results, anything can be done. This post demonstrated a very simple example to note the life log to Google Sheets with one tap of iPhone icon, but any further advanced application can be produced and it is up to your imagination!

Python
Heroku
Cloud Functions
Data Science
iPhone
Recommended from ReadMedium