PWA - How to send push notifications to all subscribed users - javascript

I would like to set up a notifications system to be used when a new update of my progressive web app is available.
The pwa uses react and has node (with express) as the backend.
I followed google's guide to push notifications (link) and everything works fine when sending a push message from the devTools' service workers tab.
The problem is that the guide ends there and i would like to be able to send a notification to every subscribed user.
I tried to look for a solution and i found out that Firebase Cloud Messaging could do what i need, but when i tried to implement it i got a bit confused as it seems quite different from what I've done in the guide mentioned above.
I've also looked at other guides here and there but they don't do what i need and some of them doesn't even work.
Can someone please explain me what should i do the get that result?
Thanks in advance for the help, i hope my question isn't too stupid '^^

Related

consumer producer communication from java to javascript

I have a very common problem and believe me I am not able to find a apt solution over the internet .
[problem]: Front end application
Here in this current architecture I have tried using
SNS
But not able to figure out do I send data to a particular logged in user from Application A
SQS
Same issue on how do I send data to a particular logged in user
push notification
That works for every user but still it requires permission from browser and a lot of other stuff
I have also come up my own solution which became very complicated but
this is a very common problem and there is always a very good design
for this I am sure but not able to figure out what it is?
The java application is spring boot
The middle one is Nodejs
The front end is JavaScript
Can some one give me some idea on how do I achieve this ,or if someone can guide me into a correct direction is much appreciated .
Thank you.

Get steamID with Steam API using javascript

First off sorry if this question is a 'bad' one; I am very new to the world of web apps, API's and Javascript.
As the title says I am trying to get a user's steamID using the Steam API using javascript.
This is for a web app that needs to get information about the games a user plays. (Which from my understanding is only obtainable using this special ID.)
My initial thoughts on how to do this would be to use openID so that the user gives Steam their info and the ID is returned to my app.
I have seen that there are lots of examples of this using php; however, because of project requirements, everything must be run in the browser. There is no backend server to even run php on so it is not an option what so ever.
I have spent a better part of a day trying to figure this out and have made no real progress, everything seems to lead back to using php. (maybe what I need under my requirements is not possible?) So an example or anything really would be much appreciated.
welcome to Stack Overflow I can see you are confused as to where to start or progress so here is a basic roadmap:
You will need to contact Steam to get an API key first.
Next part is more tricky for a beginner. You will need to get node.js which is a package manager. Effectively it's a large library of javascript programs which you can import into your own program to do things with. One of these so called "packages" is openid-client, which is an implementation of openID that you can add to your site. Users click on the openID button on your site, it redirects them to steam servers, they login, then your site gets their info without leaking their username or password to you.
Now that you have both the steamID and your API Key your program can input these two into the url steam provides to get owned games. You can input this completed url into fetch or axios (another node package that can request data from servers) and it will respond with the user's owned games in json format.
Here are a list of resources in order to get you started:
https://steamcommunity.com/dev
https://nodejs.org/en/
https://www.npmjs.com/package/openid-client
https://www.npmjs.com/package/node-fetch OR https://www.npmjs.com/package/axios
https://developer.valvesoftware.com/wiki/Steam_Web_API#GetOwnedGames_.28v0001.29
I suggest reading the documentation in each of these links and seeing if there is any youtube tutorials that try and do what you are doing with these technologies to help you implement them as a newbie. Overall there is a lot to learn on each of these technologies but as long as you orient yourself using guides or tutorials you will succeed. Good luck.
Check out this page: How to retrieve Steam username using SteamWorks API?.
However, it seems like an issue you might be having is connecting to the actual API. What exactly are you using for testing?
I know from experience, for example, that you can connect using Postman to various API's, and format a request for them in a chosen language, including JS>

Send Push Notification from Web Application using AWS PinPoint

I have a react web application that assigns tickets and a react-native app for user to see their assigned tickets. I want to be able to send a push notification to the user when they are assigned a ticket. I'm looking through PinPoint JavaScript SDK, but having trouble seeing if I can do it. Has anyone been able to accomplish this?
I was able to accomplish this. You use AWS Amplify Analytics to put UserId or any attribute you want to be associated with a user. Then Use Pinpoint SDK to createSegment which attributes target the ones associated with the user. Then Pinpoint SDK to createCampaign for created segment. Hope this helps.

react native - store object on device and upload on internet reconnection

I’ve looked at the storage api’s for both react-native and expo and I’m struggling to find a suitable way to structure my app.
I’ve made an app for my workplace in which we scan equipment and record the data. At the moment I’m using firebase to upload the data and store on their servers.
My boss has asked whether we can implement a way of storing the data locally if the user has no access to wifi and then upload the data upon internet reconnection.
I’m not sure where to start with this. I understand that I can use NetInfo and add an event listener to monitor the connection. However I’m not sure how I would persist any scanned data with the opening and closing of the app and such.
If anyone could help point me in the right direction, it would be greatly appreciated it.
Thanks

how to show real time data to all users using react and firebase?

I am building a messaging app that updates in realtime. So far I can log in with google and post a message and then that message displays on screen. however, if I log in via another google account (the app is hosted on heroku) and post a message as userB then userA won't see this message on their screen until they refresh the page. what is the best way to update all screens in real time so people can actually have a conversation in real time.
every message is posted and stored in the firebase. my only solution so far requires using the javascript setInterval method and pulling from the database every 3-5 seconds. this worked however it caused the app to become very slow and laggy and a poor experience. any pointers/tips are welcomed
You are using the Firebase and its one of the main feature is the real-time database. Firebase will automatically let you know if there is any change in your JSON database. You no need to send the request in interval basic.
You can refer Zero to App: Develop with Firebase - Google I/O 2016 It is also a messaging app demo by the Google Guys.
You can find the sample source code in Github to send and receive the message in real-time.
There are a lot of ways to do this. Generally, you will want to be notified by the server once a new message has come in and not have to ping the server every X seconds.
You could look at these:
socket.io and learn about websockets in general
A nice list of existing chat apps that utilize react
Google's cloud messaging, as you already use firebase, this might be the way to go for you here.
This should lead you in the right direction.

Categories

Resources