The buzziest apps like Instagram and Facebook are built on React Native. While the framework is extremely simple in use and caters to both iOS and Android, it’s become vital to embrace it if you’re an app developer or want to learn how to build open-source, high-quality applications. In this article, we’ll tell you about some of the premier React Native example projects as well as explain the value behind the technology.
Building apps using React Native: What does it mean?
React Native evolved in 2015 as a development framework created by Facebook. Essentially, it’s based on JavaScript and was introduced as a simplified method to create native applications for iOS and Android.
So how does it work? First of all, there’s no need to use multiple programming languages. An app that is built in React Native is a combination of the same blocks as any iOS or Android app, brought together with the use of JavaScript and React only. As Facebook calls it, React Native is JavaScript that utilizes the declarative model of React and Relay.
This means if you want to create a native app, but you don’t know Java and Objective-C (the primary languages for native app development in Android and iOS, respectively), you can either learn one of those or go with the easy alternative of using the React Native library.
The process of building React Native applications has two huge advantages. First of all, there’s a possibility to throw in native code if you like. So if you want to hone some parts of your application using native languages (Swift, Java, etc.), there’s a way to do it in React Native. Another important perk is that you don’t waste time on recompiling, because the framework allows you to simply reload React Native apps instead.
If you want to master the basics of React Native and try to build open-source React Native apps, learn more about the framework from the GitHub tutorial.
Successful React Native app examples
To better understand the beauty of it, let’s analyze a few React Native example projects. Even though the framework is pretty young, it’s a part of many outstanding open-source programs you’re acquainted with.
Skype: React Native example app
One of the biggest telecommunications platforms, Skype app is built on React Native. Created in Estonia, it’s a guru of video chatting that has many alternatives but has remained at the forefront of the market rally for years now.
Now let’s make one thing clear: Skype is owned by Microsoft, which has its own development framework based on C# – Xamarin. Nevertheless, they used React Native to build the app for video chatting. And not only did they build one of the best React Native apps, they’ve also made a dedicated set of developer tools called ReactXP. A cool testament to React Native’s quality.
Facebook and Facebook Ads: The homeland of React Native
Before Facebook gave the world React Native, they actually tested the framework on their own React Native examples. Facebook mobile app and Facebook Ads are both built on React Native. The initial experiment was about migrating the Events Dashboard feature to Facebook for iOS. Even though the dashboard was already optimized and covered a range of interactive elements on the native platform, they managed to improve it even more with React Native. For instance, it takes the iOS app much less time to start up. Plus, all events descriptions in the React Native application are generated on a server, which minimizes data processing operations.
As for Facebook Ads, the Android app became the first to be built on a cross-platform development framework of React Native – from A to Z. Placing ads covers lots of advanced features connected with currency operations, geolocation tracking, scheduling, and more. The goal was to hone the transitions between features and make the app built with React Native feel more lightweight. And they nailed it quite successfully.
Instagram and Walmart: Native app examples
Instagram story
Yes, it’s one of those famous React Native apps too. Only in this case, the company tried to integrate the framework into the native application. The goal they pursued was to improve developer velocity and speed up the process of engineering and implementing features.
If you want to know the full story of using React Native for Instagram, check it here.
How Walmart embraced React Native
Walmart is one of the largest online retail stores in the U.S., and its owners aim to become the best of the best globally. Naturally, browsing experience and a solid mobile app for placing orders mean the world to this company. React Native was chosen by Walmart as a tool to refine the existing iOS app that seemed to be too slow and not robust enough for a global audience. The original app was an amalgam of native development and webviews and the goal was to remove the webviews components because it substantially hampered the app’s performance.
The most problematic was Walmart’s Pharmacy app – an important part of the mobile app infrastructure. Using React Native app development, the company rebuilt the app and integrated it back into the original one. As a result, it became way faster to load and easier to navigate. Check out the full story on Medium.
Airbnb: When apps built with React Native should go
.jpg)
Now it’s time to tell you the holy truth about React Native: It’s far from a one-size-fits-all solution. Just like any development technology, actually. Airbnb is one of the React Native app examples that clearly demonstrate that.
In 2016, Airbnb embraced React Native to grow and strengthen their app infrastructure. Back then, the share of mobile was growing exponentially for the company, and it was very hard to maintain. React Native became the true Airbnb salvation for many reasons:
- With too few mobile developers, they wouldn’t be able to implement the functionality they wanted if they had chosen to go with native components.
- They started with native development, so they had to keep the bar high. React Native was the only framework that allowed them to do that.
- The accelerated speed of development helped the Airbnb team focus on implementing more features. For instance, they launched Experiences as a React Native sample.
In 2018, Airbnb made a decision to sunset React Native and switch to native development. The main reason is the framework has already played its vital part in the company’s growth: It helped to get rid of the problematic hybrid approach and move faster with development. Today, the focus of Airbnb has shifted. The team is testing server-driven rendering frameworks and new product development approaches.
If we analyze the impact of React Native on the company growth, it’s huge, revolutionizing the way Airbnb organized their mobile app ecosystem. Sixty percent of Airbnb engineers who worked on developing the React Native mobile app say their experience with the framework was amazing and 20 percent describe it as positive.
So the main lesson you can take from the Airbnb case is the following: React Native is a perfect way to accelerate programming and strengthen your app ecosystem, but it’s never a universal solution for all types of product development strategies. So, please, expect no miracles.
Townske: React Native example of building an app from scratch
So we’ve already talked about the perks of integrating React Native into the existing infrastructure. Apart from merging, the framework also works perfectly for developing apps from scratch. Townske, a travel publishing service, is a nice example.
The company launched with a well-crafted web version of the platform, but they needed an iOS app as well. The Townske team included one programmer and one designer at the time, which wouldn’t allow them to nail the task through native development. That’s when React Native first hit the scene. By embracing the new framework, Townske managed to achieve a range of different goals:
- They launched their first public beta in a month.
- The speed of development and deployment surpassed any expectations: It was lightning fast.
- Most importantly, it allowed Townske to easily apply the same logic as they used for the web version.
Why you should consider switching to React Native
Whether to migrate content, fix functionality, or develop a full-featured mobile app from scratch, React Native is perfectly tailored for many tasks. The quality of development is comparable to natively developed products. To understand that, all you have to do is compare one of your favorite native application examples to Facebook or Instagram apps. Nevertheless, no programming approach suits all needs. We’ve collected the key arguments in favor of React Native if you’re in doubt:
- Low risks. React Native is easy to use and extremely cost-efficient – you don’t need a big team of in-house developers to write the code for your app. Plus, you’ve probably used lots of great React Native apps like SoundCloud or Wix, so you know the framework works.
- Share code across iOS and Android. This is one of the core reasons to pick React Native over coding from scratch. Instead of having two different development streams for iOS and Android you can create a single codebase with React Native and apply it to both. Not only do you save lots of money and time, the code sharing approach also allows you to ensure maximum consistency across the app infrastructure.
- Performance. While you can use hot reloading instead of recompiling in React Native, the iteration speed for such app examples is huge. No native development framework can help you achieve similar results. Plus, React Native significantly simplifies Android and iOS lifecycles, without damaging the performance.
- Constant improvements. React Native is still a very young framework. Part of the reason why Airbnb couldn’t stick to it any longer was that the speed of the company growth surpassed the evolution of React Native. The important thing is it continues evolving. Built by Facebook, the framework is now being developed and refined by the whole community.
.webp)
Conclusion: Own the best React Native examples
Apps made with React Native not only simplify the life of a developer, but they are also a huge asset for a young startup with limited engineering resources. Or, you could use React Native app examples to expand an existing mobile infrastructure. One way or another, it’s totally worth a try if you know the goal of developing an app.
