How to connect an IONIC Angular application to Google Cloud Platform

This is a simple example of how to connect your application to the Google cloud and deploy the service.

Our SAE application is an application capable of connecting to the Google cloud platform service, this application is developed with the angular framework.

The strapi framework was used to manage the database and the api for the application that we have developed, with the aim of facilitating access to user data from a service.

We use the version of strapi 3.6.8, we can find within its documentation the installation of this framework and it can be used in any operating system configuring from the terminal.

We use strapi to create our API and to be able to mount it on a server with internet connection from our application.

This is the application running from the browser, you can see that we can create a table to our database and add fields with different data types. In addition, we can modify these records at any time without affecting the other rows or columns of our database that is located on our server.

Once the tables have been created, the records can be manually entered into each field depending on the type of data assigned and their length will save the information with an auto-increment id number that helps the application so that each time we add the records appear.

These are the types of data with which we can create our tables and it also allows us to relate each of them and later obtain the data from a query through the API.

All the registered information will be shown in our application with various data arrangements with names, but it will also be possible to modify, update and register new users with a friendly form ready to enter the data in the simplest way.

When registering a new user we can see the fields of our database, where we enter our data to the form, a list of fields where we can enter in which group it goes and semester was also added. Once the user is registered, we can see in the students section 2 buttons appear, one to delete and the other to edit the user's data. If we want to delete, it will ask us for a confirmation and it will be removed from the database.

If we want to modify the data, we select the modify button and the data that we registered at the beginning will appear, in each of the corresponding fields, if we modify the data we only click on update and the changes to the database will be reflected in the database. database.

Now we see in the part of our code, there are the methods that it sends to call the data of the api. Where it passes the parameters from the database to the application interface, we can also work with the data through various assigned methods.

You can see the records of the database manager and the data obtained from the application

Video of how the ionic app works from the cloud platform with Apis

Leave a Reply

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

Go up