4.1 App Screen 1 (UI + Backend integration)

After working with Data and Auth APIs, we now proceed to the front-end and the back-end part of your app and finally their integration.

Since our app was Android based mobile app , we used Android Studio for our designing part.

We recommend the following documentation for novice.

For the back-end development, the required connection to the database was on the Console offered by Hasura. Hasura offers built in Data and Authentication APIs .

Futher, following documents can be of a great help

After basic registration and log-in screens as follows,

Screenshot of our Home Screen, which then provides access to the main frames of our App is:

First Screen of our App allows the user to add as many passwords as he/she wants. These passkeys will be stored in an encrypted manner and could be revealed only by long-pressing. ( We will learn this in our Second Screen Integration part)

This AddPass key has two fields:

Application name : name of the app whose passkey has to be stored

Password: password of the corresponding app

This is how the screen looks

And now we are done with the first screen and its integration.

Next, we will learn UI and Backend Integration of the Second Screen of our app.

Happy Learning! :)