Once you need to interlink different pages in a react project, you will need to use the react Rooter as hyperlink to jump from one page to another
Before coding, you will need to download react router using the terminal inside of the current project and write "npm install react-router-dom"
Second step will be to import the different needed element in the header import. You can copy-paste it from here :
BrowserRouter as Router,
} from "react-router-dom";
- The first tag to rener is . The links and the switch won't work if they are not inside of a Router tag.
Within the navbar, you will now use "Home" to create a link. It is the equivalent of the HTML a href. It means now that when you click on the home link, the url will add /home at the end of the url link.
Once you are able to change the url clicking the links, you still need to set a Switch to be able to open another page acording to the current url.
In this example, if in the url the route path is set as /main, then the page Main.js is going to be opened in the website.