Building Mobile Applications Using React Native & GCP

Written by Danish Kiani

Software Engineer

Develop a mobile backend with Google Cloud Endpoints. Automatically generated strongly typed client libraries for iOS, Android, and JavaScript make calling backend APIs simple.

The client is an early-stage agricultural technology company working to enhance pollination rates and crop yields by working with flies and other wild pollinators.

Royal Cyber team worked with them on a mobile application; the app provides a detailed overview of the farms, crops, bees, and pollinator count for the users to manage farms accordingly.

How Did the Idea Spring Up?

  • To help farmers manage the farms efficiently using the application

  • To increase the pollinator count

  • To manage crops

  • Track the record of bees

Problem-Statement

There was no such application to manage the pollination count and the crops, and farmers had to do everything manually.

Now That React Native and GCP Have Been Used, Result?

  • Moving to digital instead of paperwork

  • More efficient and fast process

  • GCP took care of all possible services in one place, i.e., Big Query, Cloud storage, Cloud Functions.

  • One code is written and runs on both platforms, i.e., Android and iOS

How Is It Different from the Apps that in the Market?

There is no other competition app in the market, and it is an IoT application. It will get accurate data from IoT devices and link that with our database through which we can see the real-time data in a mobile application through which farmers can manage the farms accordingly.

How We Achieved and Excelled

  • Strategy
  • Requirement Gathering
  • Business Understanding
  • Planning
  • Implementation / Testing in agile process
  • Deployment
  • Maintenance
  • We proceeded in sprints
  • We used agile methodology
  • Had weekly standups with clients to track the progress

We developed it in react native and used GCP service for our APIs deployment and database.

Why React Native?

There are many options for cross-platform mobile application development, like Xamarin, Cordova, and ionic, but none provide quality and speed as react-native provides. React native have virtual DOM, which makes it faster, and it interacts with native modules to provide a native feel of the application. React-native is a cross-platform mobile application development framework created by Facebook in 2015, We code once, and it works efficiently on both Android and iOS. The benefit of using react native is that you can develop the application in less time and with fewer resources; also, in terms of quality and feel, it resembles a native application.

React Native and Redux

We used Redux in our project; Redux is a library for state management that ensures that the application logic is well-organized and that apps work as expected. In addition, Redux makes it easy to understand your application's code regarding when, where, why, and how the application's state is updated.

Redux Observable

For handling side effects, we used Redux Observable, RxJS-based middleware for Redux. Compose and cancel async actions to create side effects and more. Redux-observable truly shines the most for complex async/side effects. If you are not comfortable with RxJS, you might consider using redux-thunk for simple side effects and then redux-observable for the complicated things. That way, you can stay productive and learn RxJS as you go. Redux-thunk is much simpler to understand and use, but that also means it's far less powerful. Of course, if you already love Rx as we do, you will probably use it for everything! An Epic is a core primitive of redux-observable. It is a function that takes a stream of actions and returns a stream of activities.

Why GCP?

Google Cloud Platform (GCP), presented by Google, is a suite of cloud computing services that runs on the identical infrastructure that Google uses internally for its end-user products, such as Google Search, Gmail, file storage, and YouTube. Combined with a set of management tools, it offers a series of modular cloud services, that includes computing, data storage, data analytics, and machine learning. In addition, GCP offers many services at reasonable rates that we can use during our development. For example, in our project, we used:

  • Big Query: Big Query is a Serverless, highly scalable, and cost-effective multi cloud data warehouse designed for business agility.
  • Cloud Storage: Object storage for companies of all sizes. Store any amount of data. Then, retrieve it as often as you'd like.
  • Cloud Function: Cloud Functions lets you to trigger your code from Google Cloud, Firebase, and Google Assistant or call it from any web, mobile, or backend application via HTTP directly.

We developed RESTFUL APIS to access and get data from GCP; RESTFUL APIS is an architectural style for an application program interface (API) that employs HTTP requests to access and use data. That data can be used to GET, PUT, POST, and DELETE data types, which indicates to the reading, updating, creating, and deleting data.

Challenges:

  • We faced some challenges while implementing redux and redux observable with hooks because we came from the nonfunctional component background.
  • We faced some issues while adding unit test cases in react-native to test our components, but we succeeded.

Solutions:

  • For managing the state, we used redux to store the data and one place globally.
  • Testing the app on code level we used jest for unit test cases.

However, React Native is appropriately mature that the benefits outweigh any drawbacks. Royal Cyber delivers on its promise of high-quality, cross-platform mobile development, and if you're starting a mobile project, you should be getting in touch with our expert team. For more information, you can email us at [email protected] or visit www.royalcyber.com.

Leave a Reply