Not able to route in reactjs - reactjs

I am not getting how to link different pages in react js. I'm using react router through which by using link and route tags I'm able to change the url but not getting the content.
Can I get the answer as soon as possible..

Can you provide your code snippet?
There might be several reasons, maybe check the router nested settings, and see if it setup correct.

Related

Everytime i refresh my react app, it shows me 404 file not found

I'm trying to deploy my small react app, but every time I logged in and refresh the page, the 404 file not found appears. I'm using local storage to save the data of the current user. Can someone explain what I'm doing wrong and how to fixed these.
These is my repository https://github.com/GabrielDelaPena/expenses_tracker.
If you are using React router, then you can solve this issue by using HashRouter instead of BrowserRouter.
For more knowledge on this, you can refer to this thread:
React-router urls don't work when refreshing or writing manually

Going back with react-router if previous visit is from another web site

I believe this is a very well know and solved issue on router but perhaps I was not able to search properly in order to find the already answered question. Sorry in advance.
I am developing a react application with react router enabled. When I am browsing in the app itself all is fine. Using the history.goBack() works properly. But when it comes to a visit from another web page. The history.goBack brings me to the previous page, instead I would like to go to another page in my app. I think there are some solutions available. But still not sure;
Do not draw the go back button if router history is empty.
Modify the router history manually. So that the going back will keep me in my own app.
It's not related to react-router if you are visiting from another web URL. In that case, vanilla javascript can help you out.
document.referrer
This one refers to the previous url you have visited. So simple you can use window object to go back.
window.location.href = document.referrer

Refresh browser after route change in react router

I am learning react-router for client-side routing in my basic webpage. I want to know how to refresh the browser once immediately after the route changes.
Is there a way to refresh the browser after the route changes using react-router?
Please do comment for more clarity if needed.
Note: Please provide suggestions for scenarios where react-router v4 is not used and an older version of react-router is used. (Just curious...........XD)
I was also searching for programmatically updating react router and found the best anwser which covers all router versions.
hope you will find this useful
https://stackoverflow.com/a/31079244/8542218
to refresh the page you can simply pass '/' or your home(landing) page route.

Refresh or Direct Url not working after bundle with webpack in react js?

I had an issue that the react js app with browser history only working on normal. But after build with webpack, i had an issue with refresh or paste relative url. If i'm using hash history instead of browser history it works well. I used several methods, but i'm only getting the issue
Mostly says this is a problem of tomcat server not webpack; If any one know to solve this issue please give a valid answers.
Note: I don't wanna use hash history, it's ugly for urls
You should only use browser history if you have a backend server supporting your application with routes.
If you're using webpack-dev-server (or any other) on a fully client side app you should use hash history
If you're using react-router v4 they are both accessible by BrowserRouter and HashRouter components.

Any cleaner way to trigger React Route change?

I am pretty new to React-Router, I wonder if there is a simple way to change Route, some concept like state in Angular UI Router. From the React Router official tutorial :
https://github.com/reactjs/react-router-tutorial/tree/master/lessons/12-navigating
My understanding is: I have to manually change the url to trigger route change.
What exactly are you trying to achieve? Did you take at look at the react-router Link component?
Perhaps the most used component in your app is Link. Its almost identical to the <a/> tag you're used to except that its aware of the Router it was rendered in.
React-Router Tutorial / Lesson 3: Navigating with Link

Resources