React Native

Integrating Firebase Push notification with React native iOS application. In this article, we will talk about how we can integrate FCM (Firebase Cloud Messaging) with React Native iOS application. If you want to go through FCM and Android app integration then read this article. Pre-requisite :- You should have Apple Developer Account to make push notifications work properly. Let’s start with integrating firebase push notification, before going on to the code we have to set up a few things. ...

Redux for Beginners – Zero to Hero In this article, we will learn basic Redux concepts which you can apply to any application. You can apply it to React or any other framework. Redux is a state management tool independent of React. In an upcoming blog, we will learn how to use this with React. The complete video content of this blog is here : You can also check the Hindi version of this Video ...

React Native Chat Application using Firebase & Hooks [ Part 1 ] In this tutorial, we will be building full-fledged chat application. We can share text, images, and videos through this chat application. In this part 1, we will build one-on-one chat application and in the upcoming part, multiple participants will be able to chat through the application. First, make sure you have all pre-requisites to create a React-Native App as per the official documentation. If you are already done with that setup, skip this documentation and go on implementing the chat application. ...

How to pick images from Camera & Gallery in React Native app If you would like access to the entire source code, you can check out the GitHub repo here. For step-by-step tutorial, continue reading below. **Picking images from Gallery and Camera **is one of the most important and basic functionalities that is required in almost all the apps. Advanced functionalities are built upon this basic core facility. For picking the image in React Native, we will use a popular and superior library called react-native-image-picker. This provides the ImagePicker component in which you can provide the image picking option from Gallery or Camera. ...

React Native API calls with Fetch and Axios In this tutorial, we will implement most popular ways for API calls into React Native application. We will build a project and along with it learn different methods for API calls including 1) fetch() method and 2) Axios method provided by React-Native. We will also see the different configurations and properties of these methods using fetchand axios in react native applications. ...

How to know if a React Native App goes to background ? We all question sometimes that — Is it possible to know if a React Native app has gone to background? Is there any callback or event which can be captured. The answer is AppState. As a bonus, we will cover adding security screen to react native application. In this article, we will go through AppState API and implement a scenario having a security screen which will be shown while switching between apps and while app is in foreground. ...

Top 7 useful Ionic and React Native Hybrid App Templates/Starters in COVID-19 Pandemic The coronavirus outbreak has spread global panic, with people searching for sure-fire ways to protect themselves and also adapt to new ways businesses are going to thrive. COVID-19 has changed the world and people’s minds. The technologies are significantly playing a vital role in the day to day lives and have impacted in better ways in this COVID-19 pandemic which has created a fundamental impact on business and its working standards. The technologies are playing a crucial role and are assisting us to reduce the spread of this crisis while helping businesses stay open. ...

Implement AdMob in React Native with Firebase This post is done on a special request from one of our thousands readers. If you have more requests, let me know in the comments In this post, you will learn how to implement **AdMob functionality, **i.e. Google advertisements, in React Native apps. We will implement this in a simple React Native app and test on iOS simulator. ...

RefreshControl - Pull to Refresh in React Native Apps In this post, you will learn how to implement Pull to Refresh functionality in React Native apps. We will implement this in a simple React Native app and test on device. Pull-to-refresh is the functionality we use to refresh data in our apps, where we pull the screen towards bottom to load new data. See example below ...

Anonymous login in React Native Apps with Firebase In this post, you will learn how to implement anonymous login in React Native apps using Firebase. We will also learn how to link an existing anonymous login with a new set of email password, so an anonymous user can convert into a normal user. We will implement these in a simple React Native app and test on device. ...