In the past few years, React Native has become the open-source framework of choice for building apps that work across Android and iOS.
Released by Meta, React Native has gone from strength to strength, with many of the world’s Fortune 500s and hottest startups opting to use it.
Popular apps like Microsoft Office, the Facebook suite, Shopify, Discord, Bloomberg, Tencent, Tesla, Pinterest, and the Playstation app all run on the React Native framework.
In a nutshell, developers see React Native as a faster and cleaner way to build flexible and responsive cross-platform apps that work and feel like native ones. So it should come as no surprise that many Fortune 1000 companies and fledgling startups alike have leveraged it.
It’s also considered a direct competitor to Flutter in many ways. React Native rapidly speeds up development. Instead of two separate development teams, React Native would need just one for both your iOS and Android versions. Your app gets more cost effective to maintain and improve—directly rewarding your users with timely updates.
However, a pet peeve for a lot of React Native developers has been its inability to develop an app when APIs were unavailable. In fact, most local server setups today give developers only a single response per request.
This means that React Native doesn’t let developers select their mock response for requests at runtime.
And that’s where Barricade enters the picture.
Built by the Mutual Mobile team, Barricade lets you support multiple responses per request. It presents the developer with an interface that lets them modify the selected mock response for runtime requests.
It does this by replacing the global ‘XMLHttpRequest’ and the ‘fetch’ object with the ‘MockedXMLHttpRequest’.
All outgoing network calls configured with Barricade get blocked and registered local responses get returned. All this without requiring any changes to the existing network code. And the best part? It’s open-source!
During development, Barricade is useful for easily exercising all edge cases of a feature while you are building it without needing to frequently adjust the live server state.
Barricade also helps you test edge cases better during unit and integration testing as it can easily let you toggle each predefined response to a request.
In this example, we see Barricade respond to the flickr search API with one of two possible responses.
Everytime we hit the above API, Barricade executes the successResponseHandler function and returns the response data. This function will be useful in cases like the one below, where we have to return the paginated response to the same API call.
To get started with Barricade, take a look at the README file of our library at NPM. In the meantime, if you’re more of a Flutter person, then check out our handbook for Flutter navigation.
Barricade comes with a host of developer-friendly features, chief of which are its ability to:
Home to an award-winning team of engineers and developers, Mutual Mobile has led from the forefront ever since the smartphone revolution kicked off. Known for building products with stunning design that always puts users first, we’ve become the digital partner Fortune 100s and unicorn startups the world over trust.
So if you have an idea that you’d like to see materialize in React Native, we recommend you schedule a free consultation with a member of our team. They bring a lot of experience in building apps with React Native and could help you spot planning holes early on.
And in an industry that rewards early movers more than anything, this might be your safest bet.