Flutter for data engineering and data science! Flet.dev — running Flutter apps built in Python on Google Cloud with Cloud Run

Flutter is Google’s SDK for crafting beautiful, fast user experiences for mobile, web, and desktop from a single codebase. According to a 2021 developer survey Flutter is the most popular cross-platform framework.

Source: https://flutter.dev/

Now, thanks to Flet.dev it has potential to bridge software and data engineering/science worlds and become a standard for building cross-platform, interactive multi-user applications and data products!

Flet.dev project brings Flutter to data engineers and data scientists by enabling them to easily build realtime web, mobile and desktop apps in their favourite language: Python — whereas software engineers will typically use Flutter with Dart. No frontend experience is required. Flet.dev is open source and available on Apache-2.0 license.

Source: flet.dev

After this short introduction think of all the opportunities where you can use it to build data applications for:

• Prototypes of AI solutions utilizing Google GenAI models (PaLM2, Imagen, Chirp, … )
• Data Science what-if simulations
• Optimization what-if simulations
• Demos of Machine Learning models built on GCP Vertex AI platform

This article is foundation to all these use cases as we show how to deploy data applications built with flet.dev on Google Cloud platform on its fully-managed compute environment for deploying and scaling serverless HTTP containers: Cloud Run.

One of the requirements when selecting hosting platform for Flet apps is support for WebSockets because Flet apps use this mechanisms for real-time partial updates of their UI and sending events back to your program. Cloud Run satisfies this requirement without any additional configuration.

Let’s put our hands dirty and build hello-world Flet application.

When it comes to development tools, you can use whichever IDE you like (Pycharm, Visual Studio Code, or you can check brand new IDE from Google named IDX — https://idx.dev/ — which uses latest AI technology to help in your daily coding). It can be running locally on your laptop or you many want to use managed development environments available as Google Cloud Workstations when you have to meet the needs of security-sensitive enterprises.

We want to make this guide easy to follow regardless of how and where you code, therefore we will use Cloud Shell which comes with a built-in code editor with an integrated Cloud Code experience, allowing you to develop, build, debug, and deploy your cloud-based apps entirely in the cloud from the browser. Open Cloud Shell:

We will first build hello world Flet app which is Counter app example from Flet.dev documentation: https://flet.dev/docs/#flet-app-example

Create empty python file named main.py and copy the following code into it:

import flet as ft
import os

def main(page: ft.Page):
    page.title = "Flet counter example"
    page.vertical_alignment = ft.MainAxisAlignment.CENTER

    txt_number = ft.TextField(value="0", text_align=ft.TextAlign.RIGHT, width=100)

    def minus_click(e):
        txt_number.value = str(int(txt_number.value) - 1)
        page.update()

    def plus_click(e):
        txt_number.value = str(int(txt_number.value) + 1)
        page.update()

    page.add(
        ft.Row(
            [
                ft.IconButton(ft.icons.REMOVE, on_click=minus_click),
                txt_number,
                ft.IconButton(ft.icons.ADD, on_click=plus_click),
            ],
            alignment=ft.MainAxisAlignment.CENTER,
        )
    )

ft.app(target=main, port=int(os.environ.get("PORT", 8080)), view = ft.AppView.WEB_BROWSER)

It will create a single input field (ft.TextField) and two buttons (ft.IconButton). Every button has option to specify logic that should be executed when user clicks it (on_click). In our case we will either increment or reduce counter of clicks (minus_click, plus_click python functions).

To run the app install flet module:

pip install flet

Running our app locally is as easy as executing our main.py script:

python main.py

Last line of our script includes view = ft.AppView.WEB_BROWSER:

....
ft.app(target=main, port=int(os.environ.get("PORT", 8080)), 
view = ft.AppView.WEB_BROWSER)

This is how we instruct Flet to prepare web interface of our application.

If we run the same code from our laptop but instead instruct Flet as follows:

ft.app(target=main)

the app will be started in a native OS (dekstop) window. Similarly you can instruct Flet to prepare your applications to be run as mobile app on Android or iOS (as PWA — Progressive web apps — which is a way to turn app-like websites into website-like apps or via Flet app for iOS and Android).

In this article we focus on web interface. When you run:

python main.py

you should get confirmation that your app is ready and listening for your requests:

To preview your application click the Web Preview button and then select [Preview on port 8080] option from displayed menu (here you can also change port if you started your Flet app on a different one).

Cloud Shell opens the preview URL on its proxy service in a new browser window.

Steps so far simulated running Flet app locally. We will now deploy our application on Cloud Run.

To do so we will need two additional files:

• requirements.txt — where we will list all our dependencies that are needed to run our code. So far we use just Flet but in coming articles we will use it together with BigQuery, Vertex AI etc. In our hello world example, requirements.txt file will just include request to install flet:

flet>=0.2.4

• Dockerfile — Cloud Run provides fully-managed compute to run containers and Dockerfile is like a recipe with instructions on what should be packaged into Docker image representing our application.

FROM python:3-alpine

WORKDIR /app

COPY requirements.txt ./
RUN pip install --no-cache-dir -r requirements.txt

COPY . .

EXPOSE 8080

CMD ["python", "./main.py"]

That is really all we need! We are ready now to deploy our application to Cloud Run!

In order to start deployment go to Cloud Shell and use the following command:

gcloud run deploy <your_app_name> --allow-unauthenticated

• allow-unauthenticated will make your app available to everyone.

You will be asked to specify in which region you want Google to host and scale your app:

We choose europe-central2 which is Poland/Warsaw.

All that is needed to build Docker image from Dockerfile, push the resulting Docker image to Artifact Registry and then deploy it to Cloud Run as service is handled for us behind the scene:

When all is ready we get information that Cloud Run service for our application is ready.

Click [Service URL] from the summary to see your application online:

As you can see getting your app up and ready is really easy with Cloud Run. However you will probably want to know how popular and performant is your service in terms of request count, latency etc. These are core metrics for your DevOps or SRE engineers as well. Cloud Run collects these metrics automatically and displays them on service dashboard:

Container instance count deserves one comment. You can configure the maximum concurrent requests per container instance. By default each instance can receive up to 80 requests at the same time; you can increase this to a maximum of 1000.

The following diagram shows how the maximum concurrent requests per instance setting affects the number of instances needed to handle incoming concurrent requests:

With concurrency set to 1 every request will be handled by a distinct container instance. With concurrency set to 80 — every container instance has up to 80 slots that can be used to handle incoming requests. If the number of incoming requests will be larger than 80 then Cloud Run will prepare additional container instances to handle this demand. Each container instance will be able to handle up to 80 requests.

Our Cloud Run service will get 100 percent of traffic, however it is possible to define multiple so-called revisions (think of it as versions) within a service and manage how much traffic should be redirected to every revision. Very useful option for A/B test or canary deployments:

Your app is ready to serve traffic and Cloud Run is there to scale it.

If you would like to learn more about Cloud Run I highly recommend starting from the book: Building Serverless Applications with Google Cloud Run: A Real-World Guide to Building Production-Ready Services by Wietse Venema.

Flet.dev has the potential to make Flutter even more popular by opening it up to a wider range of developers. It makes it easy to build cross-platform data applications, which is a valuable skill for data engineers and data scientists. Cloud Run makes it easy to deploy and scale these data applications.

This article is authored by Lukasz Olejniczak — Customer Engineer at Google Cloud. The views expressed are those of the authors and don’t necessarily reflect those of Google.

Please clap for this article if you enjoyed reading it. For more about google cloud, data science, data engineering, and AI/ML follow me on LinkedIn.