- Enterprise Mobility
- Cross Platform Apps Development
- Ecommerce & CMS
- Front-End Technology
- Back-End Technology
- UI/UX Design Services
Enterprise Mobility (Cross Platform)
Ecommerce & CMS
Front End Technology
Back End Technology
UI/UX Design Services
- HIRE US
- Mobile Developer
- Web Developer
- QA Tester
- ecommerce & CMS
eCommerce & CMS
- Design & Development
- On-Demand Solutions
- Support & Testing
- Digital Marketing
- API Integrations
Design & Development
- OUR WORK
- CONTACT US
Firebase has proved to be a great boon to mobile and web app development. The backend support it provides is very handy in app development. It really enhances the overall app’s functionality.
This document will help you show the integration with Firebase and demonstrate how you can insert and retrieve data using Firebase.
But before going further let’s see some of the positive aspects of Firebase for an external database.
Why use Firebase:
- Faster compared to REST APIs
- Real-time callback
- Easy to integration
- Offline access to cached data
- Manage by Google so better security
So you get an idea of why Firebase is ruling these days and why you should choose this ‘support system’. Now we turn to the installation process.
Create a project using below command $ react-nativeinit “ProjectName” Now install Firebase into Your project $ npm i -S firebase So now firebase is installed into your project.
I believe you have already created an android project in the Firebase console. If not then please add Project in Firebase using this Link. If you are an absolute beginner then you can check out this Link to understand how to create a project in the Firebase console.
After creating a project you need to add firebase config into your app. There will be three options in the console Android, iOS, and Web app, You have to select web app.
On click of the third option, the below screen will see below the screen and you need to copy this config and paste it into your component Will Mount () method.
Now select the database from the slider under the develop section.
After selecting a database, you must check that you have selected a real-time database, not a cloud firebase. And in the rules tab, you must have to select read and write as true so that it allows you to read and write database without any authentication.
Now you are ready to use firebase inside your app and play with it.
In this demo, I am storing Users in a list so in Firebase I have a list of Users and can get all the users.
The below screenshot explains inserting user objects into firebase. You can change the list object name from ‘users’ to whatever you want to add and customize the object according to your record.
This block of code returns the list of objects if you have inserted any. And you can play like you can check if a user is in a list and create login and signup using these blocks of code.
Your inserted records will display like below
We hope that we have covered all the basics regarding Firebase Real-time Database in React Native. For more information, we are here to help you at metizsoft.com.
We develop cross-platform apps using React Native Technology and provide budget-friendly tech solutions to our clients.
Director at Metizsoft Solutions, Chetan Sheladiya today stands at the top of a leading Mobile Application Development company, which further specializes in Online Business Marketing, Social Media Marketing, and Web Development, amongst other areas. A tech-lover at heart, Chetan has had more than a decade's worth of experience, dealing with hundreds of projects, and creating a bunch of unique IT solutions along the way. His other interest lies in sharing his ideas and opinions with people as passionate about technology, as he is. You can find his thoughts expressed on LinkedIn, Twitter, and Facebook.
June 18, 2021
Choosing the best front-end technology is a huge deal. React Native App has become the foremost choice among many successful...
February 28, 2018
Braintree Payment Gateway is a simple and modern way to accept payments. Along with its list of flexible features, it...