Tech & Experiences Vol. 2
Tech & Experiences is the lightning-fast way in which the Flux IT tech community shares its most juicy experiences and learnings from projects in multiple industries.
Integration of New Animations with Lottie
By Leonardo Galdames, Technical Leader
Scenario
The Flux IT Experience Design team realized that there was a need to incorporate new animations into a product, and using Lottie files was suggested due to their ease of implementation across multiple platforms at a low cost, given the small file size.
Subsequently, our Technology Department analyzed the feasibility of using Lottie files in React through various options.
How Did We Solve It?
The first key challenge was to create a customized component that was adaptable enough to make the most of Lottie animations. Our use case required two things: displaying the Lottie file as a static image on a button and triggering the animation when hovering over the button. This process involved close collaboration between UI Devs and Front-End Devs, thus ensuring not only that it worked but that it was also simple to use so as to replace existing animations.
A second challenge was ensuring that our app interpreted Lottie’s JSON files correctly. This required an additional effort, but we ultimately succeeded in having the application effectively translate these files.
Integrating a Core Insurance System with External Company Services
By Javier Marchesini, Solution Architect
Scenario
Our insurance client asked us to integrate their core system with an external company to provide the latter with a range of services that would allow them to commercialize their insurance products (a model known as “embedded insurance”).
How Did We Tackle the Integration?
We employed an event-based architecture and followed the event-driven architecture pattern (EDA) which uses events for behavior coordination and communication between systems.
Event-driven architecture uses events to notify the insurance core system of changes made in policies (if clients take out /cancel / modify their policies) from external systems. For example, if a new insurance policy is created and modified in an external system, events to report the changes will be issued.
This type of architecture provides us with the following advantages:
- Flexibility: it can adapt to changing system needs.
- Scalability: it easily scales to adapt to an increased volume of events.
- Resilience: it can help to improve the app’s resilience in the face of malfunctions.
Key components of event-driven architecture:
- Message brokers: an essential part of the architecture that is responsible for leading event distribution, thus ensuring that each part of the system receives relevant information in real time.
- Producers: components responsible for creating events.
- Consumers: components that receive events and take actions in response to them.
- Event store: each event has its own history, and the “event store” is the library that stores all those events.
Sending Notifications with Celery and RabbitMQ
By Leonardo Galdames, Technical Leader
Scenario
We needed to log every notification made in an internal product into databases. Additionally, users could receive notifications within the product itself, via email, or on Slack. Therefore, we had to include the possibility of adding more notifications for each of these channels and adding any others that might come up.
Since the project’s stack was built on FastApi (Python), we sought to implement a task queue that worked in batches and that was independent from the notification endpoint. With all this in mind, we chose Celery.
What is Celery?
Celery is a library that makes it possible to manage asynchronous and/or background tasks. These tasks can be translated as the delivery of notifications through different channels.
How Did We Solve It?
Perhaps a simple action like tagging different users in a post could involve numerous notifications (across different channels), which may take a certain amount of time but that should occur in parallel to the creation/editing of a post to avoid affecting response time or user experience.
With Celery (a library that needs to be combined with RabbitMQ), we were able to carry out the management of asynchronous notifications (tasks) (in terms of user experience) and background notifications.
Celery generates a task_id that helps us track tasks that have been executed successfully or not, thus allowing us to log them into the database. It also makes it possible to re-run any tasks that may have failed due to unforeseen circumstances.
Integrating Google and Apple Wallets with React Native
By Gabriel García, Technical Leader
Scenario
In an industry as competitive as the banking industry, it is essential for apps to reliably and quickly integrate new features that are revolutionizing the sector. Apple and Google wallets are fully developed in the native language of each platform, and this implied an extra challenge for this project since our client’s app was developed in React Native. We had to tackle the integration by searching for alternatives that allowed us to make it as “natively” as possible.
What Is Thales?
Thales Group is a company that developed an SDK that possesses the provisioning and tokenization feature for credit cards, thus offering a secure environment for information exchange.
How Did We Solve It?
For the development of this bank client’s app, we integrated the SDK provided by Thales into the React Native mobile app. We added the SDK files to the native part of the app and modified the services offered by the SDK to consume methods through React Native. The user registers, authenticates, and digitizes their physical cards in the wallets of the operating systems, thus enabling access to payments through them.
Bonus Track
We were able to maintain communication between the parties (Thales and the client) by conducting consultations and clarifying doubts throughout the entire process.
