How can I watch for API data updates in react native such as new message received in a messaging app? - react-native

I am trying to build a messaging app with react native and I don't want to use pre-built messaging components such as gifted-chat because what I want is to learn how to code such mechanisms.
Posting data is simple. I can just call my RESTful API whenever the "Send" button is pressed.
But then I would like messages sent by the other person to appear at the bottom of the conversation so that it looks like real time messaging. But how can I listen for new messages sent by the other person? Asking the API every 'n' seconds doesn't seem like a good idea.

As Dan suggested use sockets, there are plenty of tutorials that can show you how to implement real-time messaging in node.js with socketio. Here is my favorite! A quick google search returns plenty more of varying degrees of simplicity.

If you don't want to build your own backend then you can try Firebase. You will find some tutorials on google about how to implement a chat app.

Related

Use Firebase cloud messaging or let the app asks for event and fire notification with an API?

We are developing an app for Android and IOS for students. student can receive notification for upcoming events like exams or interviews.
We are between two decisions: Using FCM with the development of a backed which manages the sending of notifications and the registration of tokens or using the schedulers that exist in IOS and Android then download a list of events from an API regularly and trigger a local notification which will require less development on the backend side but a little more on the frontend side.
What would be best in your opinion and can we trigger a notification even if the app is closed for the 2nd solution?
I would deffinitely recommend to use FCM. It is much easier than it looks like and the performance of your notifications would be much better regarding stability, timing, battery persistance and other. You can use on of the Firebase databases to store the notification tokens and the Firebase Cloud Functions to send them from there. I have made a very similar App for Kindergarden children and it works great. I'm not sure if it would even work at all when you do it on your own. At least not as you expect it. For me that sounds like much more work.

Assigning webhooks to Firebase Messaging "subscribe to topic" event

In my current project I am using the Kreait Firebase PHP SDK to send out push notifications to Android & iOS devices that have subscribed to notifications on named topics. No issues thus far. However, rather than have fixed topic names I would now like to generate topic names based on the current "condition" of the connecting device. The condition could, for example, be a geographic location.
This is not too difficult either and I have modified my app to handle this. However, in order to put the ability to have such autogenerated topics to use I need to know the topic names on my server so I can send out targeted messages via Kreait. I find Google's Firebase documentation a bit dense at times and have not been able to establish whether it is possible to assign webhooks that get called by Firebase whenever a SubscribeToTopic, UnsubscribeFromTopic event occurs.
A simple question - does FCM even offer anything like this capability? If so, any pointers to the relevant documentation would be much appreciated.
There is no public API to get a list of topic names from Firebase, nor is there a way to hook into the subscription mechanism.
Your best bet is to simply make two calls when a user subscribes to a topic: one to Firebase, and one to your own backend API that keeps a list of active topics/conditions.

Alternative to giftedchat react native

In all the react-native tutorials I have seen so far, on building a chat app, I see them using gifted chat.
After installing the library, it is really buggy and slow. Below are some things I experience when using it.
When I have messages over 100, it takes time to load my chats.
When I press the send button, It takes time as well before updating the chat list(about a second).
Are there any other alternatives to gifted chat?
Slowness or fastness would depend on the "backend" (database and/or server) you are integrating your chat app (or component) with. Firebase (from Google) FireStore or Firebase Realtime DB would be one of the best options to choose from. This might help you in integrating Firebase DB with gifted-chat.
react-native-gifted-chat seem not to be actively maintained.
I found react-chat-elements I did not try it yet.
If you found something else please leave a comment.
good look with your search.

Can I Get Updates on the device's Contacts List - with React-Native

On a React-Native mobile app, I need to access the contacts list, which is stored on the mobile device. The following 2 libraries provide this functionality. However, it seems that none of them provides information about which contacts have been updated (added/deleted/changed) recently.
Is there any library, which (1) provides some sort of notifications, which my app can subscribe to, to get updates about the contacts' list, or (2) provide a timestamp for when each contact was last updated?
I looked into the following libabries, but they do not seem to have this functionality.
Expo Contacts (https://docs.expo.io/versions/v35.0.0/sdk/contacts/)
React-Native-Contacts (https://github.com/rt2zz/react-native-contacts)
Your feedback is highly appreciated...
I saw this in the Expo Contact library : Notifications Expo Contact
You just need to add listener, and after u can sort by categories :
Notifications.addListener(listener)
Notifications.createCategoryAsync(name: string, actions: ActionType[])
it return an EventSubscription object , u can remove notifications by :
EventSubscription.remove()
Hope it will help,
If you need a easy way for notification, Firebase CLoud Messaging is the easiest way for configuring notification, and you can send global notification too by the firebase admin panel ,
This is not currently possible. If you want this feature please request it in the issue tracker and we can deliberate.
The library would have to expose an event the javascript can register a listener for.

Voice call connection routing React-Native

I am trying to build an application which works this way: I as a user want to start a call with another user. The way I want the connection be made is by random. So it will connect to one of the many clients out there by random. Also when other clients try to make a call, it should connect to another random client and so on. I want those phone calls be made via application(such as WhatsApp) not as a phone call.
Now, the question is; is Twilio a good approach for this purpose?
If yes can you tell me which of their feature would fit my app the best?
Thanks for any suggestions!
Twilio developer evangelist here.
I can answer that Twilio would be a good approach for you to do this within your own application. I'd recommend using Twilio Video to build this as it allows cross platform communication via audio or video (in your case, you may not need the video, but this will give you the best audio quality).
As an example, my colleague Dominik built a video roulette application. It is the case that the interface was built in JavaScript for the web, but the idea would be the same for a native app. The code for the server side part of the application should give some insight into how to connect random pairings.
It's also possible to integrate Twilio Video with CallKit and Connection Services so that you can make outbound calls to other devices that ring like a real incoming call.