I am working on a small e-commerce app using React.js. While setting app the router v6, nothing is rendering. There should be a mistake in the configuring the router even in App.js or Index.js. here is a snapchot from the…
I have prepared a simple test case at Github for my question: In RouterLayout.jsx a media query makes the Outlet disappear at narrow screens, as you can see in the animated screenshot, where I drag the browser side to make…
I'm using React-router and it works fine while I'm clicking on link buttons, but when I refresh my webpage it shows an empty white screen. And also there are no console warnings, and return 200 for all network calls. When…
I have two useState state values currently, and they rely on each other. Here's some pseudocode: [getId, setId] = useState(); [getSearchParam1, setSearchParam1] = useSearchParams(); useEffect(() => { setId(getSearchParam1) }, [getSearchParam1]) useEffect(() => { setSearchParam1(getId) }, [getId]) where searchParam1 is just…
I have react-router-dom set up like below: <Router> <Routes> <Route path="/" element={<Home />} /> <Route path="/post/:slug" element={<Post />} /> // other routes </Routes> </Router> I have my frontend hosted in an S3 bucket and served through a CloudFront distribution. All…
I am trying to implement both Redux and React-Router in a React blog project in which I fetch data from an API and store in Redux, however, it is not being rendered and no error is given. I tried the…
I'm learning to use React and I'm stuck with a problem. I would appreciate it if you could help me. In a component, I have inserted a link, and I want it so that when clicked, it takes the user…
The root url of my React application is /movies, not /. And there are detail pages like: /movies/:id. I want to host my app. But no matter what I try, it starts with / root url. And I'm presented with…
I have an issue with redirect to another page. I can't use useNavigate() inside the function. Because it's not an component. redirect also not working. How can i redirect? import { redirect, useNavigate } from "react-router-dom"; import { ILogin }…
I'm trying to implement JWT in my project and an article provides a nice solution: https://dev.to/sanjayttg/jwt-authentication-in-react-with-react-router-1d03. Routes.jsx import { RouterProvider, createBrowserRouter } from "react-router-dom"; import { useAuth } from "../provider/authProvider"; import { ProtectedRoute } from "./ProtectedRoute"; import Login from "../pages/Login";…