React Router tutorial in Hindi #1 Setup with React js 18
What is React router
Install Router Router 7
Test React Router
Interview Question
React Router is a standard library for routing in React applications.
It allows you to create single-page applications (SPA) with multiple views while keeping the app fast and without refreshing the page.
Instead of loading a new HTML page for each route, it dynamically updates the UI.
import { BrowserRouter, Routes, Route ,Link, NavLink} from "react-router";
import Home from "./Home";
import About from "./About";
export default function App() {
return (
<div>
<NavLink to="/">Home</NavLink>
<NavLink to="/about">About</NavLink>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/about" element={<About />} />
</Routes>
</div>
)
}
export default function Home() {
return (
<div>
<h1>Home</h1>
</div>
)
}
export default function About() {
return (
<div>
<h1>About</h1>
</div>
)
}
import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import App from './App.jsx'
import { BrowserRouter, Routes, Route } from "react-router";
createRoot(document.getElementById('root')).render(
<StrictMode>
<BrowserRouter>
<App />
</BrowserRouter>
</StrictMode>,
)