Integrating Push API Persistence - reactjs

I'm trying to integrate persistent push notification with Push API in a PWA, i saw in the docs that it's possible to do that but i can't see any example or what so ever to do that, is there a tutorial that can help me achieve that ?

You need to set the requireInteraction flag in order to make a notification persistent (i.e. do not hide it after a few seconds automatically).
Currently this flag is supported only by some browsers.
Here you can find more information:
https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification

Related

React js push notification from laravel API

I have a Laravel API for a ReactJS site and I need to push notifications to it if there is a specific change in the database, I read about socket.io and websockets and I don't think that this is what I need I know that maybe I am wrong because I didn't understand the way that this tools works
I you can recommend a better way or tutorial that help me in this
or mention the concepts that I should know to execute this.
Sorry if the question is repeated or stupid but I really searched for it and didn't get anything.

Load firestore data before google bots watch the content?

How can I load the firebase data before Google sees the content?
For example, retrieve data and render it with h1, p and other html tags, but my problem is SEO. I've been watching Gatsby JS but I don't need something like that.
On Firebase, the SEO is called App Analytics and it's possible to disable it on your database. However, you can only disable it generally and not load the data before it starts, once it's activated, it's always working, unfortunately.
I would recommend you to raise a Feature Request for this to be implemented here, so Google can check for further development.
Besides that, in case you want more information about how this is possible, you can check the below documentation.
Disable Analytics data collection
In addition, this question from the Community - How to use Cloud Functions for Firebase to prerender pages for SEO? - there is a case that I believe might help you, since it's about pre-rendering content. This is for another type of use case, but I believe it might help.
Let me know if the information helped you!

How to use GET in ReactJS web chat app with Rest API back-end?

I am creating a chat app using ReactJS for a class project web app. For the back-end I am using Rest API. So ideally when I post something on the chat, I would use POST and when I receive a message from the other end, I would use GET. In terms of POST, I figure I can associate that with an event, such as pushing the submit button for the chat app. However, I am racking my mind for how I would call GET for receiving a message. Would it be as simple as using a React life cycle function, such as ComponentDidMount to call GET for receiving a message? Or would I need to use a timer with one of those functions? Or is there a radically different method altogether? From what I see of the life cycle functions, they only update based on changes in state and props.
Quite a lot of questions you have there. I will provide one possible solution.
Choose or implement chat UI, I recommend using https://github.com/PeterKottas/react-bell-chat as it's very easy to setup.
Implement backend, I recommend dot net core as it's fairly easy to wire this up in that framework.
Forget GET-ing messages on a timer. Imagine you have 1000 users getting every 5 seconds. That's a home-brew DDOS attack. Instead use bidirectional communication.
SignalR is the library that can help you implement that, you google the official repo, there's plenty of examples.
Connect to signalR on front end using the javascript (or typescript) client they provide.
And you're pretty much done.
Here they use angular but you should get the gist of it https://codingblast.com/asp-net-core-signalr-chat-angular/

How to provide WebView of React-Native-app with user authentication data?

I’m currently developing a web app using ReactJS and Firebase, it is going to be some kind of a forum.
Despite minor bugs, the ReactJS-part is done and works.
Currently, to provide a better user experience, I am working on hybrid apps with React-Native and implement OneSignal as a way to send push notifications everytime a user opens up a new thread or his/her own thread is commented.
My question;
is there a way to save time and 'recycle' my ReactJS-WebApp when loading it inside a React-Native WebView BUT providing the WebView with the user authentication data from the React-Native-login?
What I want to accomplish is being able to recieve push notifications (which needs the user to be logged into the app) without having him to login a second time inside the WebView.
[I read about those mixed hybrid apps when getting familiar with PhoneGap and how the folks at Basecamp thought about it, but I have no idea how to accomplish it. I think about the need of building a middleware/adapter/magic-thing to load different scenarios of my ReactJS-app depending on the request coming from an ordinary browser or an React-Native-app.] Thank you so much in advance!

Is it possible to send push notification in ionic framework

Is it possible to send push notification in ionic framework. any code is available
It definitely is. The Ionic documentation walks through this process (available here) and has code examples to show how the most common push tasks (send/receive) are done. There are also tutorials out there (just like this one) which show practical applications utilizing push notifications.

Resources