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

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!

Related

How does it work when there are multiple users accessing a React web app?

I am learning React.js and new to web programming. All along when doing my own projects it's only for my own use, and hosted on localhost:3000. (i.e. one user).
I have a question about multiple users which I don't know if it's specific to React or just general web programming, but I can't seem to find it online, as perhaps it's too basic? And sorry if it's a very basic question. I will have to make an app for internal use for a team of less than 10 people soon, and it will be hosted on a local server accessible by this team.
Would the code be any different in terms of how I write this app? (say, it's just a todo list where users are able to add and remove items)
Specifically, how do states work when there are more than one user? Are they stored on the user's local device?
If one user clicks a button and sets some state from true to false for example, does it re-render for the other users too? Or do all users get their own instance of the app?
I would also appreciate it if you would know what kind of resources I should look at for this question, as I would like to read more in-depth about it.
well, all the apps run on each user own machine independently. State, actions and all other(whole app) are happening only one user own machine. So there is no interaction if I may say so out of the box between different machines(users). You may achieve that with help of some sockets connections( for example instant chat)

Making Data available offline in Progressive Web App

I made a progressive web app with Create React App.
The user shall be able to make data available offline by clicking i.e. a button. Is there a convention or best practise to do that?
I have read this awesome documentation, that helps to make your PWA work offline
Part 1
Part 2
Have a look at workbox. It's used in Create React App as well as Next.js.
The actual answer to the question can be found in section Access Caches from Your Web App's Code.

I want to make a User to User Private Live Chat App with React & Django

I'm really confused about that. I want to make a user to user chat app on my project with Django and React. I've tried create a model and fetch messages with Rest Framework API. But that's not what i need.
I need to live chat between just two users. When a user send a message to me i want to display that instantly (without click anywhere) like Whatsapp. When i try this with DRF i can get messages and save them inside to useState. But i must to refresh page for display new messages. I don't want to this. I don't want to refresh to page.
How can i do that? I saw Django Channel but i don't know can i use this for just between two user's private messaging. Also i don't know how to set this on React JS.
Can anyone help me? I just need your opinions. I can try your opinion. You don't have to write code for me.
You have to use web sockets if you want to display data live.
So, for example, someone sent a message to the server and the server instantly send it to the socket target.
Here is the simple chat application wrote with socketio, you just have to follow it step by step https://socket.io/get-started/chat

web app created using angularjs showing my code in web

I created a web app in mvc 5, using angularjs as controller but the problem is, all my code of my app will be shown if i click on inspect in google chrome, i don't want to show my coding to any user, how can i prevent the user to view my coding,
and is angularjs is less safer then c# and is there any way (by coding) to prevent all the users to view our code in insect element
i know this is not exactly related to coding, but my app has the
transacion related to banks
This is normal with any web application that depends on client side scripting language.
JavaScript should be only used to handle the user interface flow and interactions, the business logic and persistence should be handled in the back end.
You should never trust any data coming from the UI, always validate it before retrieval or saving.
As for the code that is visible, you can always minify the JavaScript files, this will make it at least harder for anyone to inspect and understand the code

Ionic Facebook Login

I have recently been migrating my app from Meteor JS to Ionic Framework. One that has been a struggle is finding a really good plug and play Facebook login oAuth.
Currently it just needs to control view access based on logged in or logged off. As well as returning the Facebook user id.
I have searched for many with Ionic and the best I have gotten to work so far is ng-cordova. But it is rather confusing because it references another git repo from Wizcorp, and seems to run several errors upon setup.
So I am curious is anyone has a better tutorial to follow, or an overall sure fire plugin.
I did facebook login using Openfb+ InAPP Browser .
First create App on developer.facebook.com and then use In App Browser plugin
And adding to the answer, you have to build the login flow, manually.
Facebook: Build the login flow manually

Resources