So I've check multiple posts and websites and I can't get it to work. It just renders a white screen with a the navbar. This is the code:
App.js:
import {BrowserRouter as Router, Routes, Route} from 'react-router-dom'
function App() {
return (
<Router>
<Nav/>
<Routes>
<Route path='/about' element={About}/>
</Routes>
</Router>
);
}
export default App;
Index.js:
ReactDOM.render(<React.StrictMode><App/></React.StrictMode>, document.getElementById('root'))
Some component:
<Link to="/about" className="btn btn-colored">Launch</Link>
The 'About' component is working cause I've tested and imported into App.js so that is not the problem.
You need to first import the component you want to render
For example you want to render About component so you would import the About component
Import the component
import About from "./pages/About";
Fix the syntax as in react-jsx we write it in </> brackets.
<Route path='/about' element={} />