Which is the best way of implement auth protected routes in React Router V4? - react-router-v4

Which is the best way of implement auth protected routes in React Router V4?

Its a bit of an open question as your auth requirements may not be the same as someone elses however there is an example in the V4 documentation.
V4 auth routing example

Related

How to access $axios in composition API without using useContext

I am trying to access $axios in Vue composition API without using useContext() because the current app is not a Nuxt app and is like a library that either can be used inside a Nuxt app or Vue app. So if I use $axios in the code then in Nuxt app it can be called serverside too. if anyone can help it would be very helpful, even if we can made this mechanism with inject/provide.
Nuxt 3 officially recommends using $fetch for making http request
Note that $fetch is the preferred way to make HTTP calls in Nuxt 3 instead of #nuxt/http and #nuxtjs/axios that are made for Nuxt 2.
https://nuxt.com/docs/api/utils/dollarfetch
However if you want to set it up for example to add headers, you can create a composable and work with it throughout the nuxt app
import axios from "axios";
export const $axios = axios.create({
  baseURL: BASE_URL,
  headers: {
    ...headers
  },
});

React Native Authentication

I have my website in Angular and NodeJs(backend). Now I am developing the app with the same website functionality in React Native.
This is my authentication flow
Firebase phone(OTP) auth
Setting cookies and userId
Since browsers implement cookie storage, I don't have to manually store the session id
To get data/call the APIs, I use passport.js(req.isAuthenticated()) as middleware
I read articles on how to do the same steps, but I didn't get clear information. I want to follow the same approach in React Native APP(since our APIs are already defined and configured). Since I am using Axios, it would be great if I can get some insights on how to send withCredentials: true & some headers globally configured to all the APIs. Any articles on how to perform these would be great too.

Do i need redux to integrate laravel api with react native cli

Im am trying to integrate laravel login api with react native cli front end .Do i have to use redux ? And how to integrate it.
its not necessary to use redux for integration of api you can use fetch or axios to request the server and then you can store data into AsyncStorage or ContextApi.if you want to go with redux then you have to install couple of libs
"react-redux"
"redux"
"redux-logger"
"redux-persist"
"redux-thunk"
you can visit this link for proper guide how to integrate redux

Adding auth with aws amplify to an existing javascript project

So I have working app hosted on aws as static website. Currently it is publicly available, but I wanted to have authentication mechanism, so when user is not currently logged in it will show him login page instead. From following the aws documentation it seems that process requires to have some of additional front end frameworks such as react, vue etc? Is it possible to just use plain javascript to achieve the same results?
You can use the built in components for React, Vue and Angular.
If your app does not use these frameworks, its still possible to use vanilla js.
You need to import
import { Auth } from 'aws-amplify';
Then you can use the methods on the Auth class (https://aws-amplify.github.io/amplify-js/api/classes/authclass.html) independent of the react etc. controls.
For example, to sign up, you would use Auth.signUp and to sign in, you would use Auth.signIn
The AWS documentation for this is at https://docs.amplify.aws/lib/auth/emailpassword/q/platform/js

Lumen + ReactJS routing. Allocate path

I have a Lumen application which frontends uses ReactJS and on backend Lumen acts as a rest-api. With ReactJS I use react-router and when I refresh a react route than Lumen tries to find it's own.
$app->get('client', 'ApiController#index');
is the entry point to my ReactApp and I wonder if I could allocate all routes like client/* for React.
Is there a a way to do this?
Yes, you'll just have to define one more route:
$app->get('client/{namedParamEventhoughYouDoNotUseIt:.+}', 'ApiController#index');