Tag: React

What is React Js?

React.js is a JavaScript library for building user interfaces, particularly for single-page applications where the user interface needs to be highly dynamic and responsive. React allows developers to create reusable UI components and manage the state of these components efficiently. One of the ke...

Reactive styles in React Native

When the new React Context API introduced, they showcased it with runtime theme and localization changing. React Context API is a perfect match for these use cases, because it allows to provide some not so frequently changing value deep down the view tree and makes accessing this value really e...

Code Coverage Reports and Custom Configuration with Istanbul, Jest, and React

A few months ago, I met the one and only Robert “Uncle Bob” Martin (“Clean Code,” “The Clean Coder,” “Clean Architecture,” etc ). One of many questions people had for him was, “What parts on my application need to be covered with unit tests?&rdqu...

Test suite code coverage & tools like Istanbul in React Native

Test code coverage is a measure of how much of your code is being tested by your test suite. It is a way to quantify the effectiveness of your tests and ensure that your code is thoroughly tested. Test code coverage is typically measured as a percentage of the lines of code that are executed duri...

Bun: Running a react app with bun and tailwind (using react-app)

I have been looking for a definite solution to run react with bun. Ever since the launch of Bun 1.0, I have been really interested in bun technology and was eager to try it out but unfortunately, the process was not clear and I couldn't find a good guidelines online. Following is the step-by-ste...

React Native: Ultimate Guide to Create a Home Screen Widget for iOS and Android

Widgets are awesome tools that make your home screen look more attractive and also provide you with quick and useful information. In this post, we’ll show you how to create widgets for both Android and iOS and how to incorporate them into your React Native app. How does the widget work? ...

React Native performance optimization using Render Locks

At Synaptic, we track thousands of signals across hundreds of metrics that gauge the performance of millions of companies in our database. While designing Inbox, a structured feed of such signals, one of the primary objectives was to make it easy for our users to make sense of a company’s perf...

How To Build a Home Screen Widget for iOS and Android in React Native

Objective: Learn how to build a native widget and share information with your React Native app on click of the widget open the application’s home screen. React Native widget The widget is an important addition to an app and often a highly requested feature. Unfortunately, you...

How to Reduce App Build Size in React Native

Developing a React Native app offers unparalleled flexibility and efficiency, but as your project grows, so does the app’s size. A bloated app can lead to slower downloads, increased data usage, and diminished user satisfaction. In this guide, we’ll explore effective strategies to shrink...

Deploying React Application in Kubernetes Cluster with Horizontal Pod Autoscaler using Terraform

Infrastructure as Code is using the files/code to drive or manage your IT infrastructure rather than physically doing it. IAC solves major pain issues of the company i.e. Management, Cost, Scalability, availability, and lesser discrepancies. IAC is very fast as we use the declarative approach i...