Using Google Sheets, Flutter and Fincra API to build a Cinema Ticketing App

Prerequisites:

This app will be built with the flutter framework, using google sheets for storing the data and the Fincra API for receiving payments. For this you'll need:

  • Flutter version 3.3.3

  • A Google Account with Google Cloud Console

  • A Fincra Merchant account

Goal:

At the end of this guide, you will have built a mobile app that connects to a Google spreadsheet to pull listed movie data, let users buy movie tickets, and automatically update the spreadsheet with new information whenever a purchase is made.

Outline:

  • Step 1: Set up Google Sheets Credentials

  • Step 2: Set up Google Spreadsheet Document

  • Step 3: Set up your Fincra Account

  • Step 4: Set up Flutter Local Code

Step 1: Set up Google Sheets Credentials

To get started, you'll need to get credentials from your Google console by following the process below to let your app access the spreadsheet.

  • Go to https://console.developers.google.com

  • Create a new project and name it "movie-app"

  • Click the menu and go to "Enable API & Services"

  • Enable Google Drive API and Google Sheets API

  • Next, you'll need to create a service account credentials, click the Menu button, and under API & Services, click Credentials, then click Create Credentials and create a Service Account.

    A service account is a robot account that can access your documents (spreadsheet) and perform actions on your behalf.

  • Fill in the service account details

  • Once the service account is created, click Keys and create a new JSON key, and it should automatically download the JSON file.

Step 2: Set up Google Spreadsheet Document

  • Create a new Google Spreadsheet document, or make a copy of this one
    docs.google.com/spreadsheets/d/1gzCSczMfb1s..

  • Invite your service account to have edit access to the spreadsheet

  • Make sure you have two sheets named Movies and Payments respectively

Movies Table

Payments Table

Step 3: Set up your Fincra Account

  • Go to https://app.fincra.com/auth/signup to open an account

  • After signing up you should have access to a test account like the one below, don't worry the test account is fine for this guide

Step 4: Set up Flutter Local Code

  • To get started quickly, I've already implemented the UI of the movie app, all you'll need to do is clone the flutter app repo

    Here: https://github.com/pauleke65/movie_app

    Next, you'll need to configure the Google sheets service to let the app use the service account you previously created and access the spreadsheet.

  • Open the google_sheet.dart file and update the credentials with the ones in the previously downloaded JSON file.

  • Make sure to add your spreadsheet id in the _spreadsheetId variable

    Sample: https://docs.google.com/spreadsheets/d/1gzCSczMfb1s8sXy81unXs3vR3JMBwFVTdJxDxk19ScI where 1gzCSczMfb1s8sXy81unXs3vR3JMBwFVTdJxDxk19ScI is the spreadsheet id.

  • Next, open the payments.dart file and update it with your Fincra API Credentials

  • Open your Fincra dashboard and go to Settings, then copy your Business Id and paste it in businessId

  • Next Click API Key & Webhook

  • Paste your Secret Key in apiKey and your Public Key in publicKey

  • In the Payment class, you will find two main functions getCheckoutLink() which uses the Checkout > Create Checkout endpoint to generate a checkout link that the user can use for payments.

    More info here

  • And the verifyPayment() method, which uses the Checkout > Verify Payment endpoint to verify the status of the payment if it was successful or it's still pending.

    More info here

  • Now, in your terminal run flutter pub get to download the dependencies, then flutter run to get your app up and running.

Congratulations🎉, you just created a cross-platform app with Flutter that uses Google Sheets as its database and the Fincra API to receive payments😃

Conclusion

So what exactly just happened?

Well, let me explain.

First, we set up our Google console service account and credentials so that we could let our app access our spreadsheet in order to retrieve the list of movies, and record payment history whenever a payment is made.

Next, we created our google spreadsheet, opened a Fincra account and set up our Flutter app that pulls the list of movies from the Google sheets and lets the user pay for a movie ticket with Fincra while recording the transactions history on the Google sheets table.

Voila✨